Failed to click element /html/body/div[@id='wrapper']/div[@id='page-content-wrapper']/div/div/div/form[@id='signup']/div[@id='user_section']/div/div/div/button[@id='review_button'] because of overlapping element /html/body/div at position 209, 718;
A screenshot of the page at the time of the failure has been written to /tmp/click_failed_S10458.png
The actual problem was; there was a link_tag (<a>) inside the <label> tag. So when I asked the capybara to click on the <label> it clicked on the “Terms and Conditions” area and a popup appeared.
To Solve this, I kept the link separate from the Label
Some useful links
There may come situation when you try to check(tick) the checkboxes via RSpec. using codes like
We have hidden the original checkbox and the fancy checkbox was being shown. Since the item was hidden Capybara was not able to find the element.
Instead of searching for hidden item, I triggered the click event on the Label for that Checkbox
I recently moved from Selenium Web Driver to Thoughtbot’s Capybara Webkit as JS Driver for Capybara. The main reason is, webkit is super fast in running the test suite and its headless (no browser pops up ) .
Problem I faced
I was changing the option in select box and expecting the change in span’s content. Actually some sort of calculation should have been triggered. Webkit was not triggering the ‘change‘ event properly.
To use helper method you need to visit some web page like
For Text fields
fill 'user[email]', with: 'firstname.lastname@example.org'
fill_in 'user[name]', with: 'John Smith'
fill_in 'user[email]', with: 'email@example.com'
For Select box
select 'Annually', from: 'subscription_type'
# The `Annually` is the text not the value attribute
# 'subscription_type' is name attribute
select 'Monthly', from: 'subscription_type'