nmg49 nmg49 - 8 months ago 79
Ruby Question

Capybara with Selenium: Can't click on hidden element

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:


<div id="button_div">
<i id="icon" data-bind="click: dosomething"></i>


i {
display: none;

#button_div:hover {
i {
display: block;

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:

find('#icon', visible: false).click

This gives me the a "Selenium::WebDriver::Error::ElementNotVisibleError" error.


Capybara.ignore_hidden_elements = false

Gives me the exact same error

I've also tried using a Selenium Action such as:

button_div_element = find('#button_div').native
button_element = find('#button', visible: false).native

While this doesn't throw an error, it also doesn't click the button.

Does anyone have any idea what I might be doing wrong?


After some painstaking trial and error, I managed to find a solution that worked

button_div = find("#button_div_id").native
icon = find("#icon_id").native
page.driver.browser.action.move_to(button_div, :right_by => -50).click.perform

Not sure why I had to manually tell Capybara to go left by 50px, but that seems to have done the trick.

Also, I added the following line to my setup code:


This makes sure the window is maximized before running the test. I'm not 100% sure, but this might have also had something to do with the fix.