Thao tác Mouse hover trong Selenium Webdriver

Bài viết được sự cho phép của vntesters.com

Sự xuất hiện của class Action cũng như là các method mà nó cung cấp, được sử dụng để giúp bạn xử lý một số các thao tác hơi đặc biệt một chút liên quan đến mouse, keyboard… mà ta vẫn gặp trong các ứng dụng web. Ở các bài viết trước đây như xử lý Drag- drop, right-click, double-click… các bạn cũng đã biết được chức năng và cách sử dụng của nó rồi. Và hôm nay mình sẽ bổ sung thêm trong list kia một method khác mà đôi khi ta cũng có thể gặp phải, đó chính là mouse hover (các bạn cũng có thể search google với tên khác là mouseover).

Thao tác Mouse hover trong Selenium Webdriver

Trong thực tế, cũng có không ít những tình huống ta gặp phải những trường hợp như này, đó là thực hiện đưa con trỏ chuột vào một menu hay button nào đó, từ menu hay button ấy sẽ hiển thị ra thông tin nào đó hoặc là lại tiếp tục hiển thị ra các submenu nhỏ hơn để ta có những lựa chọn tương ứng phù hợp. Công việc của chúng ta bây giờ là dùng Selenium để automate thao tác này.

  Đợi đối tượng UI hoặc sự kiện với Selenium WebDriver

  Sử dụng các câu lệnh điều khiển trên Selenium IDE

Xem thêm tuyển dụng ReactJS hấp dẫn trên TopDev

Thao tác Mouse hover trong Selenium Webdriver

Dạo quanh các trang web, diễn đàn hay blog tìm hiểu về cái này thì hầu hết đều đi đến một mẫu số chung cho bài toán này đó là sử dụng class Action, với method moveToElement(toElement). Ta có cú pháp như sau:

Hover:

public static void Hover(WebDriver driver, WebElement element) {
               Actions action = new Actions(driver);
               action.moveToElement(element).perform();
}

Hover kết hợp click:

public static void hoverAndClick(WebDriver driver,WebElement elementToHover, 
                                 WebElement elementToClick) {
      Actions action = new Actions(driver);
      action.moveToElement(elementToHover).click(elementToClick)
            .build().perform();
}

Hoặc :

public static void Hover(WebDriver driver, WebElement elementToHover, 
                         WebElement elementToClick) {
              Actions action = new Actions(driver);
              action.moveToElement(elementToHover).build().perform();
              elementToClick.click();
}

Đối với một số trình duyệt, có thể xảy ra trường hợp là khi hover vào một menu, submenu hiển thị ra nhưng Selenium chưa kịp thực hiện thao tác nào lên submenu ấy thì cái menu đã bị biến mất, nên không thể thao tác tiếp với submenu được. Do đó gợi ý cho bạn trong trường hợp này đó là ta sẽ sử dụng action perform() trên menu chính, cho đến khi Selenium có thể xác định và thao tác được đến submenu đích muốn thực hiện, chỉ với cú pháp đơn giản như sau:

public static void Hover(WebDriver driver, WebElement menuToHover, 
                         WebElement submenuToClick) {
               Actions action = new Actions(driver);
               action.moveToElement(menu).perform();
               action.moveToElement(submenu);
               action.click();
               action.perform();
}

Đó, vậy thôi. Cũng không quá khó đúng không nào. Hi vọng bài viết đã tổng hợp được những hữu ích nhất định cho các bạn.

Các bạn có thể tham khảo đoạn code ngắn ví dụ này của mình cho dễ hình dung nhé!

import org.openqa.selenium.By;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.openqa.selenium.firefox.FirefoxOptions;
import org.openqa.selenium.interactions.Actions;
public class MouseHover {
      public static void main(String[] args) {
            System.setProperty("webdriver.gecko.driver", "E:\\Program\\Firefox\\geckodriver.exe");
            FirefoxOptions options = new FirefoxOptions();
            options.setBinary("C:\\Program Files (x86)\\Mozilla Firefox\\firefox.exe");
            FirefoxDriver driver = new FirefoxDriver(options);
            driver.get("http://www.myntra.com");
            WebElement women = driver.findElement(By.linkText("Women"));           
            Actions action = new Actions(driver);
            action.moveToElement(women).build().perform();       
            WebElement type = driver.findElement(By.linkText("Kurtis, Tunics & Tops"));        
            type.click();
      }
}

Bài viết gốc được đăng tải tại vntesters.com

Có thể bạn quan tâm:

Xem thêm các việc làm ngành IT hấp dẫn trên TopDev