การรวมเครื่องมือทดสอบและ Playwright (เลิกใช้งาน)

โน้ต

กลไกการทดสอบจะถูกยกเลิกและ จะถูกลบออกในการเผยแพร่ในอนาคต ใช้ตัวอย่าง Power Platform Playwright สําหรับความสามารถในการทดสอบระบบอัตโนมัติใน Power Platform และบริการ Dynamics 365

Overview

Power Apps Test Engine ใช้ Playwright เป็นเทคโนโลยีหลักด้านระบบอัตโนมัติของเบราว์เซอร์ การบูรณาการนี้มอบความสามารถในการทดสอบที่ทรงพลัง เชื่อถือได้ และครอบคลุมหลายเบราว์เซอร์ให้กับ Test Engine พร้อมทั้งเพิ่มเลเยอร์การแยกส่วนหลายชั้นเพื่อลดความซับซ้อนในการสร้างการทดสอบสำหรับแอปพลิเคชัน Power Platform

Test Engine ช่วยเพิ่มประสิทธิภาพให้กับนักเขียนบทละครได้อย่างไร

แม้ว่า Playwright จะนำเสนอความสามารถในการทำงานอัตโนมัติของเบราว์เซอร์ที่ยอดเยี่ยม แต่ Test Engine ก็ได้ขยายความสามารถเหล่านี้โดยเฉพาะสำหรับ Power Platform:

การปรับปรุงเครื่องมือทดสอบ รายละเอียด
การแยกส่วนระดับแอป Test Engine ทำงานกับวัตถุในระดับแอปมากกว่าองค์ประกอบ DOM ทำให้การทดสอบมีความยืดหยุ่นต่อการเปลี่ยนแปลง UI มากขึ้น
การบูรณาการ Power Fx Test Engine เพิ่มการรองรับ Power Fx ทำให้สามารถใช้วิธีการเขียนการทดสอบแบบ low code ได้
การตรวจสอบสิทธิ์ในตัว กลไกการตรวจสอบสิทธิ์ที่สร้างไว้ล่วงหน้าจัดการ Microsoft Entra และสถานการณ์การเข้าถึงแบบมีเงื่อนไข
การบูรณาการ Dataverse การบูรณาการโดยตรงกับ Dataverse ช่วยให้สามารถทดสอบแบบครบวงจรได้
ผู้ให้บริการเฉพาะทาง ผู้ให้บริการที่ได้รับการปรับให้เหมาะสมสำหรับแอป Canvas และแอปที่ขับเคลื่อนด้วยโมเดล...

การดำเนินการทางเทคนิค

หัวข้อต่อไปนี้จะอธิบายว่า Test Engine สร้างบนรากฐานการทำงานอัตโนมัติของเบราว์เซอร์ของ Playwright ได้อย่างไร และบูรณาการเข้ากับการแยกส่วนที่เฉพาะเจาะจง ซึ่งช่วยให้สามารถทดสอบอัตโนมัติได้อย่างแข็งแกร่งและบำรุงรักษาได้ Power Platform

รากฐานการทำงานอัตโนมัติของเบราว์เซอร์

Test Engine ใช้ประโยชน์จากความสามารถหลักของ Playwright เพื่อการทำงานอัตโนมัติของเบราว์เซอร์ที่สม่ำเสมอ:

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

การบูรณาการสถาปัตยกรรมของ Test Engine

  • เลเยอร์ผู้ให้บริการ: เลเยอร์ผู้ให้บริการใน Test Engine เชื่อมต่อกับ Playwright API โดยตรงเพื่อควบคุมพฤติกรรมของเบราว์เซอร์
  • โมเดลวัตถุ: แทนที่จะทำงานกับองค์ประกอบ DOM แบบดิบ Test Engine จะแมปกับโมเดลวัตถุเฉพาะแอปพลิเคชัน
  • Power Fx เลเยอร์: ขั้นตอนการทดสอบที่เขียนใน Power Fx จะถูกตีความและดำเนินการผ่านเลเยอร์ผู้ให้บริการ

คุณสมบัติทางเทคนิคที่สำคัญ

ส่วนต่อไปนี้จะเน้นถึงคุณลักษณะทางเทคนิคที่สำคัญที่ Test Engine เพิ่มไว้บน Playwright รวมถึงตัวเลือกเฉพาะแอป การจัดการบริบทของเบราว์เซอร์ และการเข้าถึงฟังก์ชัน Playwright โดยตรงสำหรับสถานการณ์ขั้นสูง

ตัวเลือกเฉพาะแอป

Test Engine ใช้ตัวเลือกเฉพาะแอปแทน CSS หรือ XPath ตัวเลือก:

# Test Engine (using app-level selectors)
- testSteps: |
    Select(Button1)

# Equivalent in raw Playwright (using DOM selectors)
    Select(Button1)
# page.locator('div[data-control-name="Button1"]').click();

การจัดการบริบทของเบราว์เซอร์

Test Engine จัดการบริบทเบราว์เซอร์เพื่อรองรับสถานการณ์การตรวจสอบสิทธิ์ต่างๆ:

# Test Engine handles browser context automatically
pac test run `
   --provider canvas `
   --test-plan-file testplan.te.yaml `
   --tenant $tenantId `
   --environment-id $environmentId

หน้าที่ของนักเขียนบทละครโดยตรง

แม้ว่า Test Engine จะสรุปการโต้ตอบของ Playwright จำนวนมาก แต่ก็มีสถานการณ์ที่การเข้าถึงความสามารถของ Playwright โดยตรงนั้นมีประโยชน์ Test Engine มีฟังก์ชันการแสดงตัวอย่างหลายอย่างที่ช่วยให้โต้ตอบกับ Playwright ได้โดยตรงภายในขั้นตอนการทดสอบของคุณ Power Fx

การใช้ฟังก์ชัน Playwright ใน Test Engine

Test Engine ประกอบด้วยฟังก์ชันการแสดงตัวอย่างต่อไปนี้ที่ช่วยให้คุณใช้ความสามารถในการเลือกองค์ประกอบของ Playwright ได้:

ฟังก์ชัน รายละเอียด ตัวอย่าง
Preview.PlaywrightAction ดำเนินการกับองค์ประกอบโดยใช้ CSS หรือตัวเลือก DOM Preview.PlaywrightAction("//button", "click")
ดู การดำเนินการของนักเขียนบทละครทั่วไป
Preview.PlaywrightActionValue ดำเนินการที่ต้องมีพารามิเตอร์ค่า Preview.PlaywrightActionValue("//input[@data-id='1']", "fill", "Hello")
ดู การดำเนินการค่าของ Playwright ที่พบบ่อย
ตัวอย่างสคริปต์ Playwright ดำเนินการสคริปต์ C# ที่กำหนดเองซึ่งเชื่อมต่อกับ Playwright Preview.PlaywrightScript("sample.csx")
ดู ขั้นสูง: สคริปต์นักเขียนบทละครที่กำหนดเอง
ดูตัวอย่าง หยุดชั่วคราว หยุดการดำเนินการทดสอบและแสดง Playwright Inspector Preview.Pause()

โน้ต

ในการใช้ฟังก์ชันการแสดงตัวอย่างเหล่านี้ คุณต้องเพิ่มฟังก์ชันการแสดงตัวอย่างลงในรายการที่อนุญาตในส่วนการตั้งค่าการทดสอบของคุณ

การดำเนินการของนักเขียนบทละครทั่วไป

สามารถดำเนินการต่อไปนี้ได้โดยใช้ Preview.PlaywrightAction:

การดำเนินการ รายละเอียด ตัวอย่าง
click การเลือกองค์ประกอบโดยใช้เหตุการณ์คลิก Preview.PlaywrightAction("//button[@id='submit']", "click")
exists ตรวจสอบว่ามีองค์ประกอบอยู่หรือไม่ Preview.PlaywrightAction("//div[@class='error-message']", "exists")
wait รอให้มีองค์ประกอบพร้อมใช้งาน Preview.PlaywrightAction("//table[@data-loading='false']", "wait")

การดำเนินการค่าของ Playwright ที่พบบ่อย

สามารถดำเนินการต่อไปนี้ได้โดยใช้ Preview.PlaywrightActionValue:

การดำเนินการ รายละเอียด ตัวอย่าง
fill กรอกช่องแบบฟอร์มด้วยข้อความ Preview.PlaywrightActionValue("//input[@name='search']", "fill", "Product name")
select เลือกตัวเลือกจากรายการตัวเลือก Preview.PlaywrightActionValue("//select", "select", "Option2")
setAttribute ตั้งค่าแอตทริบิวต์บนองค์ประกอบ Preview.PlaywrightActionValue("//div", "setAttribute", "data-custom='value'")

เมื่อใดจึงควรใช้ฟังก์ชัน Playwright โดยตรง

แม้ว่าการแยกส่วนในระดับแอปจะเป็นที่ต้องการ แต่ฟังก์ชัน Playwright โดยตรงก็มีประโยชน์ในสถานการณ์เหล่านี้:

  • การโต้ตอบ UI ที่ซับซ้อน ไม่ได้ครอบคลุมโดยฟังก์ชัน Test Engine มาตรฐาน
  • ส่วนประกอบของบุคคลที่สาม ที่ต้องการการจัดการพิเศษภายในแอปพลิเคชันของ Power Platform
  • การแก้ไขสถานการณ์การทดสอบที่ซับซ้อน ซึ่งจำเป็นต้องมีการควบคุมเพิ่มเติม
  • การตรวจสอบขั้นสูง ของสถานะหรือคุณสมบัติขององค์ประกอบ

ตัวอย่าง: แนวทางแบบผสมผสาน

ตัวอย่างนี้สาธิตการรวมการแยกระดับแอปกับการดำเนินการ Playwright โดยตรง:

testSteps: |
  # Use app-level abstraction for Power Apps control
  Select(SubmitButton);
  
  # Use direct Playwright action for a third-party component
  Preview.PlaywrightAction("//div[@class='custom-calendar']//button[@data-day='15']", "click");
  
  # Wait for a specific condition using Playwright
  Preview.PlaywrightAction("//div[@data-status='complete']", "wait");
  
  # Resume using app-level abstractions
  Assert(Label1.Text = "Submission Complete");

ขั้นสูง: สคริปต์บทละครที่กำหนดเอง

สำหรับสถานการณ์ที่มีความเฉพาะทางสูง คุณสามารถสร้างสคริปต์ Playwright ที่กำหนดเองได้:

  1. สร้างไฟล์ .csx ด้วยตรรกะนักเขียนบทละครที่คุณกำหนดเอง
  2. การอ้างอิงที่จำเป็นของชุดประกอบบทละคร
  3. ปฏิบัติตามโครงสร้างคลาสที่จำเป็น
  4. เรียกสคริปต์จากขั้นตอนการทดสอบของคุณ
// sample.csx
#r "Microsoft.Playwright.dll"
#r "Microsoft.Extensions.Logging.dll"
using Microsoft.Playwright;
using Microsoft.Extensions.Logging;

public class PlaywrightScript {
    public static void Run(IBrowserContext context, ILogger logger) {
        Execute(context, logger).Wait();
    }

    public static async Task Execute(IBrowserContext context, ILogger logger) {
        var page = context.Pages.First();
        // Custom Playwright logic here
    }
}

โน้ต

Preview.PlaywrightScript จะถูกนำไปใช้เฉพาะกับการสร้างดีบักของ Test Engine ที่สร้างจากซอร์สเท่านั้น ไม่ใช่ในเครื่องมือ pac test run ที่เผยแพร่

การบูรณาการกับกระบวนการพัฒนา

หัวข้อต่อไปนี้จะอธิบายวิธีการใช้ Test Engine และ Playwright ในสภาพแวดล้อมการพัฒนาภายในเครื่องและ CI/CD โดยรองรับเวิร์กโฟลว์ต่างๆ ตั้งแต่การดีบักแบบโต้ตอบไปจนถึงการดำเนินการตามขั้นตอนอัตโนมัติ

การพัฒนาท้องถิ่น

สำหรับการพัฒนาในพื้นที่ Test Engine มอบสภาพแวดล้อมที่สมบูรณ์:

  • การดำเนินการเบราว์เซอร์ภายในเครื่องพร้อมการมองเห็น UI
  • การดำเนินการทดสอบแบบทีละขั้นตอน
  • บันทึกและการวินิจฉัยโดยละเอียด

การรวม CI/CD

ในสภาพแวดล้อม CI/CD Test Engine สามารถรัน Playwright ในโหมดไม่มีส่วนหัวได้:

# Example Azure DevOps pipeline step
- task: PowerShell@2
  displayName: 'Run Test Engine Tests'
  inputs:
    script: |
      pac test run `
        --provider canvas `
        --test-plan-file "$(Build.SourcesDirectory)/tests/testplan.te.yaml" `
        --tenant "$(TenantId)" `
        --environment-id "$(EnvironmentId)"

แนวทางปฏิบัติที่ดีที่สุด

เมื่อทำงานกับการเชื่อมต่อ Playwright ของ Test Engine:

  • มุ่งเน้นไปที่วัตถุระดับแอป มากกว่าองค์ประกอบ DOM
  • ใช้ Power Fx ฟังก์ชัน สำหรับตรรกะที่ซับซ้อนมากกว่า JavaScript แบบดิบๆ
  • ใช้ประโยชน์จากกลไกการตรวจสอบสิทธิ์ในตัว
  • สำรองฟังก์ชัน Playwright โดยตรง สำหรับสถานการณ์ที่การแยกส่วนระดับแอปไม่เพียงพอ
  • ตรวจสอบการทดสอบที่สร้างขึ้น เพื่อเพิ่มประสิทธิภาพสำหรับการอ่านและการบำรุงรักษา