คลาสแอ็คชั่นใน Selenium

⚡ สรุปอย่างชาญฉลาด

คลาสแอ็คชั่นใน Selenium ไลบรารีนี้รองรับการจัดการเหตุการณ์ขั้นสูงจากแป้นพิมพ์และเมาส์ เช่น การวางเมาส์เหนือวัตถุ การลากและวาง การคลิกขวา และการกดปุ่มต่างๆ ผ่าน API การโต้ตอบของผู้ใช้ขั้นสูง บทช่วยสอนนี้จะอธิบายเกี่ยวกับ Actions และคลาส Action เมธอดหลัก และวิธีการเชื่อมโยงการโต้ตอบหลายๆ อย่างเข้าด้วยกันในลำดับเดียว

  • 🖱️ วัตถุประสงค์หลัก: คลาส Actions จะทำการจัดการเหตุการณ์เมาส์และคีย์บอร์ดแบบซับซ้อนโดยอัตโนมัติ ซึ่งฟังก์ชัน click() พื้นฐานไม่สามารถทำได้
  • 🔑 สองชั้นเรียน: Actions สร้างปฏิสัมพันธ์; Action จะจัดเก็บลำดับที่คอมไพล์แล้วเพื่อนำไปดำเนินการ
  • 🧱 สร้างแล้วจึงดำเนินการ: เชื่อมโยงเมธอดต่างๆ เข้าด้วยกัน จบด้วย build() และเรียกใช้งานด้วย perform()
  • 📋 วิธีการสำคัญ: moveToElement(), dragAndDrop(), keyDown()/keyUp(), contextClick() และ sendKeys()
  • 🤖 การเปิดใช้งาน AI: ผู้ช่วย AI สร้างโค้ดคลาส Action และแก้ไขตำแหน่งอัตโนมัติระหว่างการทดสอบการโต้ตอบ

เอาต์พุตเมื่อวางเมาส์เหนือวัตถุ

คลาสแอ็คชั่นใน Selenium

คลาสแอ็คชั่นใน Selenium เป็นฟีเจอร์ในตัวสำหรับการจัดการเหตุการณ์จากแป้นพิมพ์และเมาส์ รองรับการทำงานต่างๆ เช่น การคลิกหลายครั้งด้วยปุ่ม Control การลากและวาง และอื่นๆ อีกมากมาย การทำงานเหล่านี้ดำเนินการโดยใช้ Advanced User Interactions API ใน Selenium เว็บไดร์เวอร์

การจัดการเหตุการณ์แป้นพิมพ์และเมาส์

การจัดการเหตุการณ์พิเศษของแป้นพิมพ์และเมาส์ทำได้โดยใช้ API การโต้ตอบของผู้ใช้ขั้นสูง. มันมี สถานะ และ การกระทำ คลาสที่จำเป็นสำหรับการดำเนินการเหตุการณ์เหล่านี้ เหตุการณ์การใช้แป้นพิมพ์และเมาส์ที่ใช้บ่อยที่สุดซึ่งมีอยู่ในคลาส Actions แสดงไว้ด้านล่าง

วิธี Descriptไอออน
คลิกและถือ() คลิก (โดยไม่ปล่อย) ที่ตำแหน่งเมาส์ปัจจุบัน
บริบทคลิก() ทำการคลิกขวาที่ตำแหน่งเมาส์ปัจจุบัน
ดับเบิลคลิก() ดำเนินการดับเบิลคลิกที่ตำแหน่งเมาส์ปัจจุบัน
DragAndDrop(แหล่งที่มา เป้าหมาย) คลิกค้างไว้ที่องค์ประกอบต้นทาง ย้ายไปยังองค์ประกอบเป้าหมาย แล้วปล่อยเมาส์ พารามิเตอร์: ต้นทาง (องค์ประกอบที่จะกดค้าง), เป้าหมาย (องค์ประกอบที่จะปล่อยเมาส์)
DragAndDropBy (แหล่งที่มา, x-offset, y-offset) คลิกค้างไว้ที่องค์ประกอบต้นทาง เลื่อนไปตามค่าออฟเซ็ตที่กำหนด แล้วปล่อย พารามิเตอร์: องค์ประกอบต้นทาง, ค่าออฟเซ็ตแกน x (แนวนอน), ค่าออฟเซ็ตแกน y (แนวตั้ง)
keyDown (ตัวดัดแปลง_คีย์) กดปุ่มตัวดัดแปลงโดยไม่ปล่อย เพื่อให้การโต้ตอบในภายหลังถือว่าปุ่มนั้นยังคงถูกกดอยู่ พารามิเตอร์: ปุ่มตัวดัดแปลง (Keys.ALT, Keys.SHIFT หรือ Keys.CONTROL)
keyUp(modifier_key) ปล่อยปุ่มตัวดัดแปลง พารามิเตอร์: ปุ่มตัวดัดแปลง (Keys.ALT, Keys.SHIFT หรือ Keys.CONTROL)
moveByOffset(x-ออฟเซ็ต, y-ออฟเซ็ต) เลื่อนเมาส์จากตำแหน่งปัจจุบัน (หรือ 0,0) ไปตามค่าออฟเซ็ตที่กำหนด ค่า x ติดลบจะเลื่อนไปทางซ้าย ค่า y ติดลบจะเลื่อนขึ้น
moveToElement(เป็นองค์ประกอบ) ย้ายเมาส์ไปที่กึ่งกลางขององค์ประกอบ พารามิเตอร์: องค์ประกอบที่จะย้ายไป
ปล่อย() ปล่อยปุ่มเมาส์ซ้ายที่กดค้างไว้ ณ ตำแหน่งปัจจุบัน
sendKeys (onElement, ตัวอักษร) ส่งชุดการกดแป้นพิมพ์ไปยังองค์ประกอบหนึ่งๆ พารามิเตอร์: onElement (โดยปกติจะเป็นช่องข้อความ), charsequence (ชุดการกดแป้นพิมพ์ที่จะส่ง)

ในตัวอย่างต่อไปนี้ เราใช้ moveToElement() วิธีการวางเมาส์เหนือหนึ่งในนั้น Mercury แถวโต๊ะทัวร์

การจัดการเหตุการณ์จากแป้นพิมพ์และเมาส์

เซลล์ที่แสดงด้านบนเป็นส่วนหนึ่งของ องค์ประกอบ เมื่อไม่ได้วางเมาส์เหนือองค์ประกอบนั้น สีจะเป็น #FFC455 (สีส้ม) หลังจากวางเมาส์เหนือองค์ประกอบแล้ว สีของเซลล์จะเปลี่ยนเป็นโปร่งใสและมีสีเดียวกับพื้นหลังของตารางโดยรอบ

ขั้นตอน 1) นำเข้า สถานะ และ การกระทำ ชั้นเรียน

นำเข้าแอ็กชันและคลาสแอ็กชัน

ขั้นตอน 2) สร้างอินสแตนซ์ของวัตถุ Actions ใหม่

สร้างอ็อบเจ็กต์ Actions

ขั้นตอน 3) สร้างอินสแตนซ์ของแอ็กชันโดยใช้ออบเจ็กต์แอ็กชันจากขั้นตอนที่ 2

สร้างอ็อบเจ็กต์ Action

ที่นี่เราใช้ moveToElement() วิธีการวางเมาส์เหนือลิงก์ “หน้าแรก” build() เมธอดนี้จะถูกเรียกใช้เป็นลำดับสุดท้ายเสมอ เพื่อให้การกระทำทั้งหมดที่ระบุไว้ถูกรวบรวมเป็นขั้นตอนเดียว

ขั้นตอน 4) ใช้ perform() วิธีการเรียกใช้งานอ็อบเจ็กต์ Action ที่ออกแบบไว้ในขั้นตอนที่ 3

ดำเนินการ

ด้านล่างนี้คือโค้ด WebDriver ฉบับเต็มที่ใช้ตรวจสอบสีพื้นหลังของ องค์ประกอบก่อนและหลังการวางเมาส์เหนือ

package newproject;

import org.openqa.selenium.*;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.openqa.selenium.interactions.Action;
import org.openqa.selenium.interactions.Actions;

public class PG7 {

    public static void main(String[] args) {
        String baseUrl = "https://demo.guru99.com/test/newtours/";
        System.setProperty("webdriver.gecko.driver", "C:\\geckodriver.exe");
        WebDriver driver = new FirefoxDriver();

        driver.get(baseUrl);
        WebElement link_Home = driver.findElement(By.linkText("Home"));
        WebElement td_Home = driver.findElement(By.xpath(
            "//html/body/div/table/tbody/tr/td"
            + "/table/tbody/tr/td"
            + "/table/tbody/tr/td"
            + "/table/tbody/tr"));

        Actions builder = new Actions(driver);
        Action mouseOverHome = builder.moveToElement(link_Home).build();

        String bgColor = td_Home.getCssValue("background-color");
        System.out.println("Before hover: " + bgColor);
        mouseOverHome.perform();
        bgColor = td_Home.getCssValue("background-color");
        System.out.println("After hover: " + bgColor);
        driver.close();
    }
}

ผลลัพธ์ด้านล่างแสดงให้เห็นว่าสีพื้นหลังเปลี่ยนเป็นโปร่งใสหลังจากวางเมาส์เหนือภาพ

เอาต์พุตเมื่อวางเมาส์เหนือวัตถุ

การสร้างชุดการดำเนินการหลายรายการ

คุณสามารถสร้างชุดการกระทำโดยใช้คลาส Action และ Actions ได้ อย่าลืมปิดชุดการกระทำด้วย build() วิธีการดังกล่าว พิจารณาตัวอย่างโค้ดด้านล่างนี้

การสร้างชุดการกระทำหลายอย่าง

public static void main(String[] args) {
    String baseUrl = "https://www.facebook.com/";
    WebDriver driver = new FirefoxDriver();

    driver.get(baseUrl);
    WebElement txtUsername = driver.findElement(By.id("email"));

    Actions builder = new Actions(driver);
    Action seriesOfActions = builder
        .moveToElement(txtUsername)
        .click()
        .keyDown(txtUsername, Keys.SHIFT)
        .sendKeys(txtUsername, "hello")
        .keyUp(txtUsername, Keys.SHIFT)
        .doubleClick(txtUsername)
        .contextClick()
        .build();

    seriesOfActions.perform();
}

ผลลัพธ์ของชุดการกระทำ

คำถามที่พบบ่อย

คลาส Action แสดงถึงลำดับการโต้ตอบระหว่างแป้นพิมพ์และเมาส์ที่ถูกคอมไพล์แล้ว ซึ่งสร้างขึ้นด้วยคลาส Actions โดยจะถูกเรียกใช้งานผ่าน Advanced User Interactions API Selenium เว็บไดร์เวอร์

Actions (พหูพจน์) คือตัวสร้างที่ใช้เชื่อมโยงการโต้ตอบต่างๆ เช่น การวางเมาส์เหนือวัตถุและการคลิก Action (เอกพจน์) คือวัตถุที่คอมไพล์แล้วซึ่งส่งคืนโดย build() และคุณจะเรียกใช้ด้วย perform()

ฟังก์ชัน build() จะรวบรวมปฏิสัมพันธ์ที่เชื่อมโยงกันทั้งหมดเข้าเป็น Action เดียว โดยจะถูกเรียกเป็นลำดับสุดท้ายเสมอ ก่อนฟังก์ชัน perform() เพื่อให้ขั้นตอนที่อยู่ในคิวทำงานพร้อมกันเป็นลำดับเดียว

`perform()` จะเรียกใช้ Action ที่สร้างขึ้นกับเบราว์เซอร์ หากไม่มีฟังก์ชันนี้ การโต้ตอบแบบต่อเนื่องจะถูกจัดคิวไว้เท่านั้นและจะไม่ถูกส่งไปยังหน้าเว็บจริง ๆ

ใช้เมธอด moveToElement(element) กับอ็อบเจ็กต์ Actions จากนั้นเรียกเมธอด build() และ perform() การทำเช่นนี้จะย้ายเคอร์เซอร์ไปยังกึ่งกลางขององค์ประกอบและกระตุ้นการทำงานเมื่อวางเมาส์เหนือองค์ประกอบ เช่น เมนูแบบดรอปดาวน์

โปรแกรมนี้รองรับการคลิกค้างไว้ (clickAndHold), การคลิกตามบริบท (contextClick), การคลิกสองครั้ง (doubleClick), การลากและวาง (dragAndDrop), การลากและวางโดยใช้ (dragAndDropBy), การกดปุ่ม (keyDown), การปล่อยปุ่ม (keyUp), การเคลื่อนที่ตามระยะห่าง (moveByOffset), การเคลื่อนที่ไปยังองค์ประกอบ (moveToElement), การปล่อย (release) และการส่งปุ่ม (sendKeys) ซึ่งครอบคลุมการโต้ตอบขั้นสูงส่วนใหญ่

เครื่องมือ AI ใช้ตัวระบุตำแหน่งที่แก้ไขตัวเองได้ ซึ่งจะปรับตัวเมื่อองค์ประกอบเปลี่ยนแปลง ลดความล้มเหลวที่ไม่เสถียรในการทดสอบการวางเมาส์เหนือองค์ประกอบและการลากและวาง นอกจากนี้ยังแนะนำ XPath ที่เสถียรและเพิ่มการรออัจฉริยะโดยอัตโนมัติ

ใช่แล้ว ผู้ช่วยเขียนโค้ด AI จะแปลงสถานการณ์ภาษาอังกฤษธรรมดาๆ เช่น “เลื่อนเมาส์ไปที่ Home แล้วคลิกขวา” ให้กลายเป็นลำดับการกระทำที่ใช้งานได้จริงด้วยฟังก์ชัน build() และ perform() และยังแนะนำตัวระบุตำแหน่งที่มีประสิทธิภาพอีกด้วย

สรุปโพสต์นี้ด้วย: