title: Capybara with Selenium: Can't click on hidden element
body: <p>I have a situation in my view where a clickable icon is only visible when it's containing div is hovered over (using Knockout JS, SCSS) . Something like this:</p>
  <h1>HTML</h1>
  <pre><code>&lt;div id=&quot;button_div&quot;&gt;
     &lt;i id=&quot;icon&quot; data-bind=&quot;click: dosomething&quot;&gt;&lt;/i&gt;
  &lt;/div&gt;
  </code></pre>
  <h1>SCSS</h1>
  <pre><code>i {
    display: none;
  }
  
  #button_div:hover {
     i {
        display: block;
     }
  }
  </code></pre>
  <p>Everything works fine on the page, but I can't seem to figure out how to click the element in Capybara. I've tried adding the :visible symbol to the method, but with no luck:</p>
  <pre><code>find('#icon', visible: false).click
  </code></pre>
  <p>This gives me the a &quot;Selenium::WebDriver::Error::ElementNotVisibleError&quot; error.</p>
  <p>Using:</p>
  <pre><code>Capybara.ignore_hidden_elements = false
  </code></pre>
  <p>Gives me the exact same error</p>
  <p>I've also tried using a Selenium Action such as:</p>
  <pre><code>button_div_element = find('#button_div').native
  button_element = find('#button', visible: false).native
  page.driver.browser.action.move_to(button_div_element).click(button_element).perform
  </code></pre>
  <p>While this doesn't throw an error, it also doesn't click the button.</p>
  <p>Does anyone have any idea what I might be doing wrong?</p>