Mouse hover (moveToElement) in Selenium Java - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

What is the output of this Selenium Java code snippet?

Consider the following Selenium Java code that performs a mouse hover on a web element. What will be the result after executing this code?

Selenium Java

WebElement menu = driver.findElement(By.id("menu"));
Actions actions = new Actions(driver);
actions.moveToElement(menu).perform();
System.out.println(menu.getAttribute("class"));

A Throws a NoSuchElementException because the element is not found

B Prints the class attribute of the menu element, which includes 'hovered' if hover triggers a class change

C Throws an IllegalStateException because perform() is not called

D Prints null because moveToElement does not affect attributes

💡 Hint

Think about what moveToElement does and what getAttribute returns.

The moveToElement method moves the mouse pointer over the element, which may trigger CSS changes like adding a 'hovered' class. The getAttribute("class") call prints the current class attribute value. If the hover triggers a class change, it will be reflected here.

❓ assertion

intermediate

Which assertion correctly verifies the hover effect?

You want to verify that hovering over a button changes its background color to blue. Which assertion is correct?

Selenium Java

WebElement button = driver.findElement(By.cssSelector("button#submit"));
Actions actions = new Actions(driver);
actions.moveToElement(button).perform();
String bgColor = button.getCssValue("background-color");

A assertNotNull(bgColor);

B assertTrue(bgColor.contains("blue"));

C assertEquals("rgba(0, 0, 255, 1)", bgColor);

D assertFalse(bgColor.equals("rgba(0, 0, 255, 1)"));

💡 Hint

Check the exact CSS value for blue in rgba format.

The background color blue in rgba is 'rgba(0, 0, 255, 1)'. The assertion must check for exact equality to confirm the hover effect.

❓ locator

advanced

Which locator is best for hovering over a submenu item?

You want to hover over a submenu item that only appears after hovering the main menu. Which locator is best to find the submenu item reliably?

A By.className("submenu-item")

B By.cssSelector("#main-menu > li:nth-child(2) > ul > li:first-child")

C By.id("submenu-item")

D By.xpath("//ul[@id='main-menu']/li[2]/ul/li[1]")

💡 Hint

Consider the submenu's position in the DOM and uniqueness.

XPath allows precise navigation to the submenu item based on its position in the menu structure, which is reliable when submenu appears only after hover.

🔧 Debug

advanced

Why does this hover action fail to trigger the submenu?

This code tries to hover over a menu to reveal a submenu, but the submenu does not appear. What is the likely cause?

Selenium Java

WebElement menu = driver.findElement(By.id("menu"));
Actions actions = new Actions(driver);
actions.moveToElement(menu);
// missing perform()
WebElement submenu = driver.findElement(By.id("submenu"));
submenu.click();

A The perform() method is missing, so the hover action is not executed

B The submenu element is not visible because the locator is incorrect

C The click() method is called before the submenu is loaded

D The moveToElement() method requires a double click to trigger hover

💡 Hint

Check if the action chain is completed.

Without calling perform(), the moveToElement action is not executed, so the submenu does not appear.

❓ framework

expert

How to implement a reusable hover method in a Selenium Java framework?

You want to create a reusable method hoverOverElement(WebDriver driver, By locator) that moves the mouse over an element and waits until a related submenu is visible. Which implementation is correct?

A

public void hoverOverElement(WebDriver driver, By locator) {
  WebElement element = driver.findElement(locator);
  new Actions(driver).moveToElement(element).perform();
  new WebDriverWait(driver, Duration.ofSeconds(5))
    .until(ExpectedConditions.visibilityOfElementLocated(By.cssSelector(".submenu")));
}

B

public void hoverOverElement(WebDriver driver, By locator) {
  WebElement element = driver.findElement(locator);
  new Actions(driver).click(element).perform();
  Thread.sleep(5000);
}

C

public void hoverOverElement(WebDriver driver, By locator) {
  WebElement element = driver.findElement(locator);
  new Actions(driver).moveToElement(element);
  new WebDriverWait(driver, Duration.ofSeconds(5))
    .until(ExpectedConditions.elementToBeClickable(element));
}

D

public void hoverOverElement(WebDriver driver, By locator) {
  WebElement element = driver.findElement(locator);
  new Actions(driver).moveToElement(element).perform();
  driver.manage().timeouts().implicitlyWait(Duration.ofSeconds(5));
}

💡 Hint

Consider both performing the hover and waiting explicitly for submenu visibility.

Option A correctly performs the hover action and explicitly waits for the submenu to be visible using WebDriverWait and ExpectedConditions, making it reusable and reliable.

Practice

1. What is the primary purpose of using moveToElement() in Selenium WebDriver?

easy

A. To scroll the page down

B. To click on a web element

C. To enter text into a text box

D. To simulate mouse hover over a web element

Solution

1. Step 1: Understand the function of moveToElement()

   The moveToElement() method is used to move the mouse pointer over a specific web element, simulating a hover action.

2. Step 2: Compare with other actions

   Clicking, scrolling, and typing are done by other methods like click(), scrollTo(), and sendKeys(). So, moveToElement() is specifically for hover.

3. Final Answer:

   To simulate mouse hover over a web element -> Option D

4. Quick Check:

   moveToElement() = mouse hover [OK]

Hint: moveToElement() always means mouse hover action [OK]

Common Mistakes:

• Confusing moveToElement() with click()
• Using moveToElement() to enter text
• Thinking moveToElement() scrolls the page

2. Which of the following is the correct syntax to perform a mouse hover on a WebElement named menu using Selenium Actions in Java?

easy

A. driver.moveToElement(menu).hover();

B. Actions.moveToElement(menu).perform();

C. new Actions(driver).moveToElement(menu).perform();

D. Actions(driver).hover(menu).perform();

Solution

1. Step 1: Recall the Actions class usage

   In Selenium Java, you create an Actions object with new Actions(driver), then chain moveToElement(element) and finish with perform().

2. Step 2: Check each option's syntax

   new Actions(driver).moveToElement(menu).perform(); correctly creates the Actions object and calls the methods. Options B, C, and D have incorrect method calls or missing object creation.

3. Final Answer:

   new Actions(driver).moveToElement(menu).perform(); -> Option C

4. Quick Check:

   Actions object + moveToElement + perform() = correct syntax [OK]

Hint: Always create Actions object before moveToElement() [OK]

Common Mistakes:

• Calling moveToElement() without Actions object
• Using driver.moveToElement() which is invalid
• Forgetting to call perform() at the end

3. Consider the following code snippet:

WebElement menu = driver.findElement(By.id("menu"));
Actions actions = new Actions(driver);
actions.moveToElement(menu).perform();
String tooltip = driver.findElement(By.id("tooltip")).getText();
System.out.println(tooltip);

What will be printed if the tooltip appears only after mouse hover?

medium

A. Empty string is printed

B. The tooltip text is printed

C. NoSuchElementException is thrown

D. StaleElementReferenceException is thrown

Solution

1. Step 1: Understand the hover effect

   The moveToElement(menu).perform() simulates mouse hover on the menu element, which triggers the tooltip to appear.

2. Step 2: Check tooltip retrieval

   After hover, the code finds the tooltip element by id and gets its text. Since the tooltip appears on hover, the text will be present and printed.

3. Final Answer:

   The tooltip text is printed -> Option B

4. Quick Check:

   Hover triggers tooltip, so text prints [OK]

Hint: Hover first, then get tooltip text to see it [OK]

Common Mistakes:

• Assuming tooltip is present before hover
• Not calling perform() after moveToElement()
• Expecting exceptions without missing elements

4. You wrote this code to hover over an element:

Actions actions = new Actions(driver);
actions.moveToElement(menu);

But the hover effect does not happen. What is the likely mistake?

medium

A. Missing perform() call after moveToElement()

B. Incorrect locator for menu element

C. Actions class cannot perform hover

D. Need to use click() instead of moveToElement()

Solution

1. Step 1: Check method chaining in Actions

   Actions methods like moveToElement() build the action but do not execute it until perform() is called.

2. Step 2: Identify missing perform()

   The code misses perform(), so the hover action is never executed.

3. Final Answer:

   Missing perform() call after moveToElement() -> Option A

4. Quick Check:

   Always end Actions with perform() [OK]

Hint: Always call perform() to execute Actions chain [OK]

Common Mistakes:

• Forgetting perform() after moveToElement()
• Assuming moveToElement() runs immediately
• Using click() when hover is needed

5. You want to hover over a menu item and then click a submenu item that appears only after hover. Which is the correct way to do this in Selenium Java?

hard

A. new Actions(driver).moveToElement(menu).click(submenu).perform();

B. menu.click(); submenu.click();

C. new Actions(driver).click(menu).click(submenu).perform();

D. driver.findElement(By.id("submenu")).click();

Solution

1. Step 1: Understand submenu visibility

   The submenu appears only after hovering over the menu, so we must hover first to reveal it.

2. Step 2: Use Actions to hover and click

   new Actions(driver).moveToElement(menu).click(submenu).perform(); chains moveToElement(menu) to hover, then click(submenu) to click the submenu, and finally perform() to execute both actions in order.

3. Step 3: Why other options fail

   menu.click(); submenu.click(); clicks menu without hover, so submenu may not appear. new Actions(driver).click(menu).click(submenu).perform(); clicks menu instead of hover. driver.findElement(By.id("submenu")).click(); clicks submenu directly without hover, likely causing failure.

4. Final Answer:

   new Actions(driver).moveToElement(menu).click(submenu).perform(); -> Option A

5. Quick Check:

   Hover then click submenu with Actions chain [OK]

Hint: Chain hover and click in Actions, then perform() [OK]

Common Mistakes:

• Clicking submenu before hover
• Using click() on menu instead of hover
• Not chaining actions before perform()