Test Engine en Playwright-integratie (preview)

Notitie

Preview-functies zijn niet bedoeld voor productiegebruik en bieden mogelijk beperkte functionaliteit. Deze functies zijn beschikbaar voorafgaand aan een officiële release, zodat klanten vroeg toegang kunnen krijgen en feedback kunnen geven.

Samenzicht

Power Apps Test Engine gebruikt Playwright als belangrijkste browserautomatiseringstechnologie. Dankzij deze integratie beschikt Test Engine over krachtige, betrouwbare en browseronafhankelijke testmogelijkheden. Tegelijkertijd worden er meerdere abstractielagen toegevoegd om het maken van tests voor Power Platform toepassingen te vereenvoudigen.

Hoe Test Engine Playwright verbetert

Terwijl Playwright uitstekende mogelijkheden voor browserautomatisering biedt, breidt Test Engine deze mogelijkheden specifiek uit voor Power Platform:

Test Engine Verbetering	Omschrijving
Abstracties op app-niveau	Test Engine werkt met objecten op app-niveau in plaats van DOM-elementen, waardoor tests beter bestand zijn tegen wijzigingen in de gebruikersinterface.
Power Fx Integratie	Test Engine voegt ondersteuning toe, waardoor een low-code-aanpak voor het schrijven van tests mogelijk wordt Power Fx
Ingebouwde authenticatie	Vooraf gebouwde authenticatiemechanismen verwerken scenario's met voorwaardelijke toegang Microsoft Entra
Dataverse Integratie	Directe integratie met Dataverse maakt uitgebreide end-to-end-tests mogelijk
Gespecialiseerde aanbieders	Geoptimaliseerde providers voor Canvas-apps en Modelgestuurde apps

Technische implementatie

In de volgende secties wordt beschreven hoe Test Engine voortbouwt op de browserautomatiseringsbasis van Playwright en deze integreert met specifieke abstracties, waardoor robuuste en onderhoudbare testautomatisering mogelijk wordt. Power Platform

Browserautomatiseringsfundament

Test Engine maakt gebruik van de kernmogelijkheden van Playwright voor consistente browserautomatisering:

• Ondersteuning voor meerdere browsers Chrome, Firefox en Microsoft Edge
• Betrouwbare wachtmechanismen die automatisch wachten tot elementen gereed zijn
• Onderschepping van netwerkverzoeken voor het simuleren van API-reacties
• Hulpmiddelen voor het traceren en debuggen om testfouten te diagnosticeren

Architectonische integratie van Test Engine

• Providerlaag: De providerlaag in Test Engine communiceert rechtstreeks met Playwright API's om het browsergedrag te beheren
• Objectmodel: In plaats van te werken met ruwe DOM-elementen, maakt Test Engine een toewijzing aan applicatiespecifieke objectmodellen
• Power Fx Laag: Teststappen geschreven in Power Fx worden geïnterpreteerd en uitgevoerd via de providerlaag

Belangrijkste technische kenmerken

In de volgende secties worden de belangrijkste technische functies belicht die Test Engine toevoegt aan Playwright, waaronder app-specifieke selectoren, beheer van browsercontext en directe toegang tot Playwright-functies voor geavanceerde scenario's.

App-specifieke selectoren

Test Engine gebruikt app-specifieke selectoren in plaats van CSS of XPath selectoren:

# 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();

Browsercontextbeheer

Test Engine beheert browsercontexten ter ondersteuning van verschillende authenticatiescenario's:

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

Directe toneelschrijverfuncties

Hoewel Test Engine veel Playwright-interacties abstraheert, zijn er scenario's waarin directe toegang tot Playwright-mogelijkheden waardevol kan zijn. Test Engine biedt verschillende voorbeeldfuncties waarmee u direct met Playwright kunt communiceren vanuit uw teststappen. Power Fx

Playwright-functies gebruiken in Test Engine

Test Engine bevat de volgende voorbeeldfuncties waarmee u de elementselectiemogelijkheden van Playwright kunt toepassen:

Functie	Omschrijving	Voorbeeld
Preview.ToneelschrijverActie	Een actie uitvoeren op elementen met behulp van CSS of DOM-selectoren	Preview.PlaywrightAction("//button", "click") Zie Algemene Acties van Toneelschrijvers
Preview.PlaywrightActionValue	Een actie uitvoeren waarvoor een waardeparameter nodig is	Preview.PlaywrightActionValue("//input[@data-id='1']", "fill", "Hello") Zie Algemene toneelschrijver actiewaardebewerkingen
Preview.ToneelschrijverScript	Voer een aangepast C#-script uit dat een interface heeft met Playwright	Preview.PlaywrightScript("sample.csx") Zie Geavanceerd: Aangepaste toneelschrijverscripts
Voorbeeld.Pauzeren	Pauzeer de uitvoering van de test en geef de Playwright Inspector weer	Preview.Pause()

Notitie

Om deze voorbeeldfuncties te kunnen gebruiken, moet u de voorbeeldfuncties toevoegen aan de toegestane lijst in uw testinstellingen.

Algemene toneelschrijver actie operaties

De volgende bewerkingen kunnen worden uitgevoerd met Preview.PlaywrightAction:

Actie	Omschrijving	Voorbeeld
click	Selectie van een element met behulp van een klikgebeurtenis	Preview.PlaywrightAction("//button[@id='submit']", "click")
exists	Controleren of een element bestaat	Preview.PlaywrightAction("//div[@class='error-message']", "exists")
wait	Wacht tot een element beschikbaar is	Preview.PlaywrightAction("//table[@data-loading='false']", "wait")

Algemene toneelschrijver actiewaardebewerkingen

De volgende bewerkingen kunnen worden uitgevoerd met Preview.PlaywrightActionValue:

Actie	Omschrijving	Voorbeeld
fill	Vul een formulierveld in met tekst	Preview.PlaywrightActionValue("//input[@name='search']", "fill", "Product name")
select	Selecteer een optie uit een selectielijst	Preview.PlaywrightActionValue("//select", "select", "Option2")
setAttribute	Een kenmerk op een element instellen	Preview.PlaywrightActionValue("//div", "setAttribute", "data-custom='value'")

Wanneer u directe Playwright-functies moet gebruiken

Hoewel abstracties op app-niveau de voorkeur hebben, zijn directe Playwright-functies nuttig in de volgende scenario's:

• Complexe UI-interacties die niet worden gedekt door standaard Test Engine-functies
• Componenten van derden binnen Power Platform applicaties die speciale verwerking nodig hebben
• Het debuggen van complexe testscenario's waarbij meer controle nodig is
• Geavanceerde validatie van elementstatussen of eigenschappen

Voorbeeld: Gecombineerde aanpak

Dit voorbeeld laat zien hoe u abstracties op app-niveau kunt combineren met directe Playwright-acties:

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

Geavanceerd: Aangepaste toneelschrijverscripts

Voor zeer gespecialiseerde scenario's kunt u aangepaste Playwright-scripts maken:

1. Maak een .csx bestand met uw aangepaste Playwright-logica
2. Referentie vereist Toneelschrijversvergaderingen
3. Implementeer de vereiste klassenstructuur
4. Roep het script aan vanuit uw teststappen

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

Notitie

Preview.PlaywrightScript is alleen geïmplementeerd voor debug-builds van Test Engine die vanuit de broncode zijn gebouwd, niet in de uitgebrachte pac test run tool.

Integratie met ontwikkelingsproces

In de volgende secties wordt beschreven hoe Test Engine en Playwright kunnen worden gebruikt in zowel lokale ontwikkel- als CI/CD-omgevingen, waarbij een scala aan workflows wordt ondersteund, van interactief debuggen tot geautomatiseerde pijplijnuitvoering.

Lokale ontwikkeling

Voor lokale ontwikkeling biedt Test Engine een complete omgeving:

• Lokale browseruitvoering met UI-zichtbaarheid
• Stapsgewijze testuitvoering
• Gedetailleerde logboeken en diagnostiek

CI/CD-integratie

In CI/CD-omgevingen kan Test Engine Playwright in headless-modus uitvoeren:

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

Beste praktijken

Wanneer u werkt met de Playwright-integratie van Test Engine:

• focus op objecten op app-niveau in plaats van DOM-elementen
• gebruik Power Fx functies voor complexe logica in plaats van ruwe JavaScript
• Maak gebruik van ingebouwde authenticatiemechanismen
• Reserveer directe Playwright-functies voor scenario's waarin abstracties op app-niveau onvoldoende zijn
• Controleer gegenereerde tests om de leesbaarheid en het onderhoud te optimaliseren