title: How to structure Protractor promises
body: <p>In this example I'm testing whether an element is located at the bottom of the page. I'm using the promises in Protractor/Webdriver, but I think I'm using it wrong because I don't think it's supposed to look this messy.</p>
  
  <pre><code>describe('Element', function(){
      it('should be placed at bottom', function(){
          element(by.id('page').getSize().then(function(dimP){
              element(by.id('element').getLocation().then(function(locE){
                  element(by.id('element').getSize().then(function(dimE){
                      expect(locE.y + dimE.height).toEqual(dimP.height);
                  })
              });
          });
      })
  });
  </code></pre>
  
  <p>How can I do this in a cleaner way? I'm using Protractor version 2.1.0.</p>
  
  <p>I have tried to do like this:</p>
  
  <pre><code>expect(element(by.id('page').getSize().height).toEqual(1000);
  </code></pre>
  
  <p>But it says <em>Expected undefined to equal 1000.</em> So it seems like I can't use return values as explained here: <a href="https://github.com/angular/protractor/blob/master/docs/control-flow.md" rel="nofollow">https://github.com/angular/protractor/blob/master/docs/control-flow.md</a></p>
  
  <p>(I am using a page object in my actual test, so the variables are not as ugly as in the example.)</p>