If you need to work with mouse hovers in your tests it may not be obvious how to do this with Selenium. And a quick search through the documentation will likely leave you befuddled forcing you to go spelunking through StackOverflow for the solution.
By leveraging Selenium's Action Builder we can handle more complex user interactions like hovers. This is done by telling Selenium which element we want to move the mouse to, and then performing what we need to after.
Let's dig in with an example.
Our example application is available here on the-internet. It has a few avatars displayed in a grid layout. When you hover over each of them, they display additional user information and a link to view a full profile.
Let's write a test that will hover over the first avatar and make sure that this additional information appears.
First, we'll want to include our requisite libraries (e.g.,
selenium-webdriver to control the browser, and
RSpec::Matchers for our assertion) and wire up some
# filename: hover.rb require 'selenium-webdriver' require 'rspec/expectations' include RSpec::Matchers def setup @driver = Selenium::WebDriver.for :firefox end def teardown @driver.quit end def run setup yield teardown end
Now let's write our test.
run do @driver.get 'http://the-internet.herokuapp.com/hovers' an_avatar = @driver.find_element(class: 'figure') @driver.action.move_to(an_avatar).perform expect(@driver.find_element(class: 'figcaption').displayed?).to eql true end
After loading the page we find the first avatar and store it in a variable (
an_avatar). We then use Selenium's
action.move_to method and feed the avatar variable to it (which triggers the hover).
We then check to see if the additional user information is displayed with
.displayed? and wrap that in an assertion.
If we save this file and run it (e.g.,
ruby hover.rb from the command-line) here is what will happen:
- Open the browser
- Visit the page
- Hover over the first avatar
- Assert that the caption appeared on the page
- Close the browser