在本節中,您將學習如何在Selenium WebDriver中執行像拖放這樣的複雜操作。
在繼續本節之前,先了解一些有關拖放操作的概念。
Selenium WebDriver拖放操作
要執行複雜的使用者互動,例如拖放,在Selenium WebDriver中有一個Actions
類。 使用Actions
類,首先構建一系列複合事件,然後使用Action(一個代表單個使用者互動的介面)執行它。 在這裡使用的Actions
類的一些方法是 -
clickAndHold(WebElement element)
- 單擊中間的Web元素(不釋放)。moveToElement(WebElement element)
- 將滑鼠指標移動到web元素的中間而不單擊。release(WebElement element)
- 釋放左鍵單擊(處於按下狀態)。build()
- 生成複合動作讓我們考慮一個測試用例,將自動化以下場景:
注:有關檔案 - testing.html 的程式碼在前幾章節中已經有給出。
我們將逐步建立測試用例,以便您完全了解如何在WebDriver中處理拖放操作。
第1步 - 啟動Eclipse IDE並開啟我們在本教學前幾節中建立的現有測試套件「Demo_Test」。
第2步 - 右鍵單擊「src」 檔案夾,然後從 New -> Class 建立一個新的類檔案。
將類的名稱命名為「Dragdrp_Test」 ,然後單擊「完成」按鈕。
第3步 - 開始編寫程式碼。
要呼叫Firefox瀏覽器,需要下載Gecko驅動程式並為Gecko驅動程式設定系統屬性。已在本教學的前面幾篇文章已經講解過這個問題。可以參考「在Firefox瀏覽器上執行測試」來了解如何下載和設定Firefox驅動程式的系統屬性。
以下是為Gecko驅動程式設定系統屬性的範例程式碼:
// System Property for Gecko Driver
System.setProperty("webdriver.gecko.driver","D:\\GeckoDriver\\geckodriver.exe" );
之後使用DesiredCapabilities
類初始化Gecko Driver。
以下是使用DesiredCapabilities
類初始化gecko驅動程式的範例程式碼。
// Initialize Gecko Driver using Desired Capabilities Class
DesiredCapabilities capabilities = DesiredCapabilities.firefox();
capabilities.setCapability("marionette",true);
WebDriver driver= new FirefoxDriver(capabilities);
結合上述兩個程式碼塊,完善啟動Firefox瀏覽器的程式碼片段。
// System Property for Gecko Driver
System.setProperty("webdriver.gecko.driver","D:\\GeckoDriver\\geckodriver.exe" );
// Initialize Gecko Driver using Desired Capabilities Class
DesiredCapabilities capabilities = DesiredCapabilities.firefox();
capabilities.setCapability("marionette",true);
WebDriver driver= new FirefoxDriver(capabilities);
之後需要編寫程式碼來自動化第二個測試場景(導航到所需的URL),以下是導航到URL的範例程式碼:
// Launch Website
driver.navigate().to("http://localhost/testing.html");
到目前為止完整的程式碼如下所示:
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.openqa.selenium.remote.DesiredCapabilities;
public class Dragdrp_Test {
public static void main(String[] args) {
// System Property for Gecko Driver
System.setProperty("webdriver.gecko.driver","D:\\GeckoDriver\\geckodriver.exe" );
// Initialize Gecko Driver using Desired Capabilities Class
DesiredCapabilities capabilities = DesiredCapabilities.firefox();
capabilities.setCapability("marionette",true);
WebDriver driver= new FirefoxDriver(capabilities);
// Launch Website
driver.navigate().to("http://localhost/testing.html");
}
}
第4步 - 現在嘗試找到易百教學 圖示和文字框,以便執行拖放操作,需要定位元素涉及檢查其HTML程式碼。
按照下面給出的步驟找到範例網頁上的下拉式選單。
它將啟動一個視窗,其中包含易百教學的圖示涉及的特定程式碼。
記下它的id
屬性值,即:sourceImage ,如下所示:
同樣,檢看放置圖示的文字框及的特定程式碼。
記下它的id
屬性,即targetDiv,如下圖所示:
第5步 - 要自動化第三和第四個測試場景,需要編寫將對易百教學圖示執行拖放操作的程式碼。
下面給出了執行拖放操作的程式碼片段。
//WebElement on which drag and drop operation needs to be performed
WebElement from = driver.findElement(By.id("sourceImage"));
//WebElement to which the above object is dropped
WebElement to = driver.findElement(By.id("targetDiv"));
//Creating object of Actions class to build composite actions
Actions act = new Actions(driver);
//Performing the drag and drop action
act.dragAndDrop(from,to).build().perform();
因此,最終測試指令碼如下所示:
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.remote.DesiredCapabilities;
public class Dragdrp_Test {
public static void main(String[] args) {
// System Property for Gecko Driver
System.setProperty("webdriver.gecko.driver","D:\\GeckoDriver\\geckodriver.exe" );
// Initialize Gecko Driver using Desired Capabilities Class
DesiredCapabilities capabilities = DesiredCapabilities.firefox();
capabilities.setCapability("marionette",true);
WebDriver driver= new FirefoxDriver(capabilities);
// Launch Website
driver.navigate().to("http://localhost/testing.html");
//WebElement on which drag and drop operation needs to be performed
WebElement from = driver.findElement(By.id("sourceImage"));
//WebElement to which the above object is dropped
WebElement to = driver.findElement(By.id("targetDiv"));
//Creating object of Actions class to build composite actions
Actions act = new Actions(driver);
//Performing the drag and drop action
act.dragAndDrop(from,to).build().perform();
}
}
第6步 - 右鍵單擊Eclipse程式碼,然後選擇 : Run As -> Java Application 。
執行後,上述測試指令碼將啟動Firefox瀏覽器並自動執行所有測試方案。可以看到易百教學的圖示將自動放入文字框中。