Integrazione tra Test Engine e Playwright (anteprima)

Nota

Le funzionalità di anteprima non sono destinate ad essere utilizzate per la produzione e sono soggette a restrizioni. Vengono rese disponibili prima di una versione ufficiale in modo che i clienti possano accedervi con anticipo e fornire i loro commenti.

Descrizione

Power Apps Test Engine utilizza Playwright come tecnologia principale di automazione del browser. Questa integrazione fornisce a Test Engine funzionalità di test potenti, affidabili e multi-browser, aggiungendo al contempo diversi livelli di astrazione per semplificare la creazione di test per le applicazioni. Power Platform

Come Test Engine migliora Playwright

Mentre Playwright offre eccellenti capacità di automazione del browser, Test Engine estende queste capacità specificatamente per Power Platform:

Miglioramento del motore di prova	Descrzione
Astrazioni a livello di applicazione	Il motore di test funziona con oggetti a livello di app anziché con elementi DOM, rendendo i test più resistenti alle modifiche dell'interfaccia utente
Power Fx Integrazione	Test Engine aggiunge il supporto, consentendo un approccio low-code alla creazione di test Power Fx
Autenticazione integrata	I meccanismi di autenticazione predefiniti gestiscono scenari di accesso condizionale Microsoft Entra
Dataverse Integrazione	L'integrazione diretta con Dataverse consente test end-to-end completi
Fornitori specializzati	Provider ottimizzati per app canvas e app basate su modelli...

Implementazione tecnica

Le sezioni seguenti descrivono il modo in cui Test Engine si basa sulla base dell'automazione del browser di Playwright e la integra con astrazioni specifiche, consentendo un'automazione dei test solida e gestibile. Power Platform

Fondamenti di automazione del browser

Test Engine sfrutta le funzionalità principali di Playwright per un'automazione coerente del browser:

• Supporto multi-browser per Chrome, e Firefox Microsoft Edge
• Meccanismi di attesa affidabili che attendono automaticamente che gli elementi siano pronti
• Intercettazione delle richieste di rete per simulare le risposte API
• Strumenti di tracciamento e debug per diagnosticare i fallimenti dei test

Integrazione architettonica del Test Engine

• Livello provider: il livello provider in Test Engine interagisce direttamente con le API di Playwright per controllare il comportamento del browser
• Modello di oggetto: anziché lavorare con elementi DOM grezzi, Test Engine mappa modelli di oggetti specifici dell'applicazione
• Power Fx Livello: i passaggi di test scritti in Power Fx vengono interpretati ed eseguiti tramite il livello del provider

Caratteristiche tecniche principali

Le sezioni seguenti evidenziano importanti funzionalità tecniche che Test Engine aggiunge a Playwright, tra cui selettori specifici per app, gestione del contesto del browser e accesso diretto alle funzioni di Playwright per scenari avanzati.

Selettori specifici per app

Il motore di test utilizza selettori specifici dell'app anziché selettori CSS o 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();

Gestione del contesto del browser

Test Engine gestisce i contesti del browser per supportare vari scenari di autenticazione:

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

Funzioni del drammaturgo diretto

Sebbene Test Engine astragga molte interazioni di Playwright, vi sono scenari in cui l'accesso diretto alle funzionalità di Playwright può essere utile. Test Engine offre numerose funzioni di anteprima che consentono l'interazione diretta con Playwright durante i passaggi del test. Power Fx

Utilizzo delle funzioni di Playwright in Test Engine

Test Engine include le seguenti funzioni di anteprima che consentono di applicare le capacità di selezione degli elementi di Playwright:

Funzione	Descrzione	Esempio
Anteprima.Azione drammaturgo	Esegui un'azione sugli elementi utilizzando i selettori CSS o DOM	Preview.PlaywrightAction("//button", "click") Vedi Operazioni comuni del drammaturgo
Anteprima.ValoreAzioneDrammatico	Esegui un'azione che richiede un parametro di valore	Preview.PlaywrightActionValue("//input[@data-id='1']", "fill", "Hello") Vedere Operazioni comuni sul valore delle azioni dei drammaturghi
Anteprima.Copione del drammaturgo	Eseguire uno script C# personalizzato che si interfaccia con Playwright	Preview.PlaywrightScript("sample.csx") Vedi Avanzate: Script drammaturgici personalizzati
Anteprima.Pausa	Metti in pausa l'esecuzione del test e visualizza Playwright Inspector	Preview.Pause()

Nota

Per utilizzare queste funzioni di anteprima, è necessario aggiungerle all'elenco consentito nella sezione delle impostazioni di test.

Operazioni comuni di azione del drammaturgo

Le seguenti operazioni possono essere eseguite con Preview.PlaywrightAction:

Azione	Descrzione	Esempio
click	Selezione di un elemento tramite evento click	Preview.PlaywrightAction("//button[@id='submit']", "click")
exists	Controlla se un elemento esiste	Preview.PlaywrightAction("//div[@class='error-message']", "exists")
wait	Attendi che un elemento sia disponibile	Preview.PlaywrightAction("//table[@data-loading='false']", "wait")

Operazioni di valore di azione di Common Playwright

Le seguenti operazioni possono essere eseguite con Preview.PlaywrightActionValue:

Azione	Descrzione	Esempio
fill	Riempi un campo del modulo con del testo	Preview.PlaywrightActionValue("//input[@name='search']", "fill", "Product name")
select	Seleziona un'opzione da un elenco di selezione	Preview.PlaywrightActionValue("//select", "select", "Option2")
setAttribute	Imposta un attributo su un elemento	Preview.PlaywrightActionValue("//div", "setAttribute", "data-custom='value'")

Quando utilizzare le funzioni dirette di Playwright

Sebbene siano preferite le astrazioni a livello di app, le funzioni dirette di Playwright sono utili in questi scenari:

• Interazioni complesse dell'interfaccia utente non coperte dalle funzioni standard del Test Engine
• Componenti di terze parti all'interno di Power Platform applicazioni che necessitano di una gestione speciale
• Debug di scenari di test complessi in cui è necessario un maggiore controllo
• Validazione avanzata degli stati o delle proprietà degli elementi

Esempio: approccio combinato

Questo esempio dimostra la combinazione di astrazioni a livello di app con azioni dirette di 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");

Avanzate: copioni personalizzati per drammaturghi

Per scenari altamente specializzati, puoi creare script Playwright personalizzati:

1. Crea un file con la tua logica Playwright personalizzata .csx
2. Riferimento richiesto Assemblee di drammaturghi
3. Implementare la struttura di classe richiesta
4. Chiama lo script dai tuoi passaggi di test

// 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
    }
}

Nota

Preview.PlaywrightScript è implementato solo per le build di debug del Test Engine compilate dal codice sorgente, non nello strumento rilasciato. pac test run

Integrazione con il processo di sviluppo

Le sezioni seguenti descrivono come Test Engine e Playwright possono essere utilizzati sia in ambienti di sviluppo locali che in ambienti CI/CD, supportando una gamma di flussi di lavoro che vanno dal debug interattivo all'esecuzione automatizzata della pipeline.

Sviluppo locale

Per lo sviluppo locale, Test Engine fornisce un ambiente completo:

• Esecuzione del browser locale con visibilità dell'interfaccia utente
• Esecuzione del test passo dopo passo
• Registri e diagnostica dettagliati

Integrazione CI/CD

Negli ambienti CI/CD, Test Engine può eseguire Playwright in modalità headless:

# 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)"

Procedure consigliate

Quando si lavora con l'integrazione Playwright di Test Engine:

• Concentrarsi sugli oggetti a livello di app piuttosto che sugli elementi DOM
• Utilizzare Power Fx funzioni per la logica complessa anziché per il JavaScript grezzo
• Sfrutta i meccanismi di autenticazione integrati
• Riservare le funzioni dirette di Playwright per scenari in cui le astrazioni a livello di app sono insufficienti
• Esaminare i test generati per ottimizzare la leggibilità e la manutenzione