測試引擎與 Playwright 整合(已棄用)

Note

測試引擎已被棄用 ,未來版本將被移除。 使用 Power Platform Playwright 範例,用於 Power Platform 和 Dynamics 365 服務中的自動化測試功能。

Overview

Power Apps 測試引擎採用 Playwright 作為其核心瀏覽器自動化技術。 這項整合為測試引擎提供強大、可靠的跨瀏覽器測試功能,並通過增加多層抽象來簡化 Power Platform 應用程式的測試創建。

測試引擎如何增強 Playwright

雖然 Playwright 提供了出色的瀏覽器自動化功能,但 Test Engine 專門將這些功能擴展為 Power Platform:

測試引擎增強 Description
應用級抽象 測試引擎與應用級物件而不是 DOM 元素配合使用,使測試對 UI 更改更具彈性
Power Fx 集成 測試引擎增加了 Power Fx 支援,支援以低程式碼方法進行測試編寫
內置身份驗證 預先建構的認證機制可處理 Microsoft Entra 及條件存取情境
Dataverse 集成 直接 Dataverse 集成,可實現全面的端到端測試
專業供應商 優化的提供者適用於畫布應用模型驅動應用

技術實現

以下部分介紹了測試引擎如何建立在 Playwright 的瀏覽器自動化基礎上,並將其與 Power Platform特定的抽象集成,從而實現強大且可維護的測試自動化。

瀏覽器自動化基礎

測試引擎利用 Playwright 的核心功能實現一致的瀏覽器自動化:

  • Chrome、Firefox及 Microsoft Edge 的跨瀏覽器支援
  • 自動等待元素準備就緒的可靠等待機制
  • 用於類比 API 回應的網路請求攔截
  • 用於診斷測試失敗的跟蹤和調試工具

Test Engine 的架構集成

  • 提供程式層:測試引擎中的提供程式層直接與 Playwright API 交互以控制瀏覽器行為
  • 物件模型:測試引擎不是使用原始 DOM 元素,而是映射到特定於應用程式的物件模型
  • Power Fx 層:以 Power Fx 編寫的測試步驟透過提供者層進行解譯和執行

主要技術特點

以下部分重點介紹了 Test Engine 在 Playwright 之上添加的重要技術功能,包括特定於應用程式的選擇器、瀏覽器上下文管理以及直接訪問高級場景的 Playwright 函數。

應用程式專用選擇器

測試引擎使用特定於應用的選擇器,而不是 CSS or 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 handles browser context automatically
pac test run `
   --provider canvas `
   --test-plan-file testplan.te.yaml `
   --tenant $tenantId `
   --environment-id $environmentId

Direct Playwright 函式

雖然測試引擎抽象了許多 Playwright 交互,但在某些情況下,直接訪問 Playwright 功能可能很有價值。 測試引擎提供多項預覽功能,使您能夠直接在 Power Fx 測試步驟中與 Playwright 進行互動。

在測試引擎中使用 Playwright 函數

測試引擎包括以下預覽函數,允許您應用 Playwright 的元素選擇功能:

功能 Description Example
Preview.PlaywrightAction 使用 CSS 或 DOM 選擇器對元素執行操作 Preview.PlaywrightAction("//button", "click")
參見 常見的劇作家動作作
Preview.PlaywrightActionValue 執行需要參數值的動作 Preview.PlaywrightActionValue("//input[@data-id='1']", "fill", "Hello")
參見 常見的 Playwright 操作值運算
預覽.Playwright Script 執行與 Playwright 互動的自訂 C# 腳本 Preview.PlaywrightScript("sample.csx")
參見 高級:自定義劇作家腳本
預覽.暫停 暫停測試執行並顯示 Playwright Inspector Preview.Pause()

Note

若要使用這些預覽函數,必須將預覽函數添加到測試設置部分的允許清單中。

常見的劇作家動作作

可以使用 Preview.PlaywrightAction 執行以下操作:

Action Description Example
click 使用單擊事件選擇元素 Preview.PlaywrightAction("//button[@id='submit']", "click")
exists 檢查元素是否存在 Preview.PlaywrightAction("//div[@class='error-message']", "exists")
wait 等待元素可供使用 Preview.PlaywrightAction("//table[@data-loading='false']", "wait")

常見的劇作家動作值運算

以下操作可以使用 Preview.PlaywrightActionValue 執行:

Action Description Example
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 交互
  • 在 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. 使用自定義 Playwright 邏輯創建 .csx
  2. 參考所需的 Playwright 組件
  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
    }
}

Note

Preview.PlaywrightScript 僅針對從原始程式碼構建的測試引擎的調試版本實現,而不是在已發佈 pac test run 的工具中實現。

與開發過程集成

以下部分介紹了如何在本地開發和 CI/CD 環境中使用 Test Engine 和 Playwright,支援從互動式調試到自動管道執行的一系列工作流程。

地方發展

對於本地開發,Test Engine 提供了一個完整的環境:

  • 具有 UI 可見性的本地瀏覽器運行
  • 分步測試執行
  • 詳細日誌和診斷

CI/CD 集成

在 CI/CD 環境中,測試引擎可以在無頭模式下運行 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 集成時:

  • 專注於應用級物件 而不是 DOM 元素
  • 使用 Power Fx 函數 來處理複雜邏輯,而非原始的 JavaScript 代碼。
  • 利用內置的身份驗證 機制
  • 為應用級抽象不足的場景預留直接 Playwright 函數
  • 查看生成的測試 以優化可讀性和維護性