網頁自動化測試如何處理Mouse MoveOver的選單?

網頁自動化測試如何處理Mouse MoveOver的選單?

這篇文章主要說明網頁自動化測試如何透過 Mouse MoveOver 選取到預期的選單?

網頁上有些選單是當滑鼠游標移動到該選單上方才會出現，

這時候滑鼠的動作只有移動Move，還沒有任何點擊Click的動作，

我們會用 Pchome 的選單作為範例，最後還是用 Selenium/Java實作，提供一個完整的程式說明。

測試情境

1. 瀏覽 Pchome

2. 將滑鼠移動到 “日用”

3. 選單出現後，再將滑鼠移動到 “洗髮精”

整個滑鼠的過程只有移動沒有任何點擊 click的動作

程式說明

像這樣選單只有透過滑鼠移動就出現的，我們就必須透過 Selenium  中的 Action 來操作

Actions 可以執行許多附合鍵、鍵盤操作。這邊我們用到的主要是滑鼠的動作moveToElement。

透過這個方式我們就可以將滑鼠移動至預期的網頁原件 (DailyMenu)

Actions builder = new Actions(driver);
builder.moveToElement(DailyMenu).build().perform();

Java/Selenium範例程式

[pastacode lang=”java” message=”” highlight=”” provider=”manual”]

package mySelenium;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.openqa.selenium.interactions.Actions;
import org.openqa.selenium.support.ui.ExpectedConditions;
import org.openqa.selenium.support.ui.WebDriverWait;

public class MoveOverMenu {

	public static void main(String[] args) {
		WebDriver driver = new FirefoxDriver();
		driver.get("http://shopping.pchome.com.tw/");
		WebElement DailyMenu = driver.findElement(By.xpath("(//a[@href='http://24h.pchome.com.tw/sign/daily.htm'])[1]"));
		
		
		Actions builder = new Actions(driver);
		builder.moveToElement(DailyMenu).build().perform();
		
		
		WebElement Shampoo = driver.findElement(By.xpath("//a[@href='http://24h.pchome.com.tw/region/DAAA']"));
		builder.moveToElement(Shampoo).build().perform();

	}

}

[/pastacode]