title: Protractor says that a checkbox is not visible, but it is. How to investigate and fix it?
body: <p>So, I have this HTML inside an angular app:</p>
  
  <pre><code>&lt;div class="panel"&gt;
      &lt;input class="eula" id="eula" type="checkbox" /&gt;
      &lt;label for="eula"&gt;I agree&lt;/label&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And this two expectations on the same spec (just to be sure that there's no other stuff running):</p>
  
  <pre><code>expect(element(by.css('.panel')).isDisplayed()).toBeTruthy();
  expect(element(by.css('.eula')).isDisplayed()).toBeTruthy();
  </code></pre>
  
  <p>First one, is true. Second one is false. That's strange. It should be also true.</p>
  
  <p>So, i try:</p>
  
  <pre><code>element( by.css( '.panel' ) ).getOuterHtml()
  .then( function ( html ) {
      console.log( html );
  });
  </code></pre>
  
  <p>And i get:</p>
  
  <pre><code>&lt;input class="eula" id="eula" type="checkbox"&gt;
  </code></pre>
  
  <p>From what I see, there's nothing hidding the checkbox so i don't understand why protractor says that is not visible. Is there another way to test this? Any idea on how to proceed to debug and fix it?</p>