Quickstart: End-to-end-tests op schaal uitvoeren met Microsoft Playwright Testing Preview
In deze quickstart leert u hoe u playwright-tests uitvoert met uiterst parallelle cloudbrowsers met behulp van Microsoft Playwright Testing Preview. Gebruik de cloudinfrastructuur om uw toepassing te valideren in meerdere browsers, apparaten en besturingssystemen.
Nadat u deze quickstart hebt voltooid, hebt u een Microsoft Playwright Testing-werkruimte om uw Playwright-tests op schaal uit te voeren.
Belangrijk
Microsoft Playwright Testing is momenteel beschikbaar als preview-versie. Zie de aanvullende gebruiksvoorwaarden voor Microsoft Azure Previews voor juridische voorwaarden die van toepassing zijn op Azure-functies die in de bètaversie, in preview of anderszins nog niet zijn uitgebracht in algemene beschikbaarheid.
Vereisten
- Een Azure-account met een actief abonnement. Als u geen Azure-abonnement hebt, maakt u een gratis account voordat u begint.
- Uw Azure-account heeft de rol Eigenaar, Inzender of een van de klassieke beheerdersrollen nodig.
- Een Playwright-project. Als u geen project hebt, maakt u er een met behulp van de playwright-documentatie aan de slag of gebruikt u ons Microsoft Playwright Testing-voorbeeldproject.
Een werkruimte maken
Als u aan de slag wilt gaan met het uitvoeren van playwright-tests op schaal in cloudbrowsers, maakt u eerst een Microsoft Playwright Testing-werkruimte in de Playwright-portal.
Meld u aan bij de Playwright-portal met uw Azure-account.
Als u al een werkruimte hebt, selecteert u een bestaande werkruimte en gaat u naar de volgende stap.
Tip
Als u meerdere werkruimten hebt, kunt u overschakelen naar een andere werkruimte door de naam van de werkruimte boven aan de pagina te selecteren en vervolgens alle werkruimten beheren te selecteren.
Als u nog geen werkruimte hebt, selecteert u + Nieuwe werkruimte en geeft u de volgende informatie op:
Veld Beschrijving Werkruimtenaam Voer een unieke naam in om uw werkruimte te identificeren.
De naam mag alleen bestaan uit alfanumerieke tekens en heeft een lengte tussen 3 en 64 tekens.Azure-abonnement Selecteer het Azure-abonnement dat u wilt gebruiken voor deze Microsoft Playwright Testing-werkruimte. Regio Selecteer een geografische locatie om uw werkruimte te hosten.
Dit is de locatie waar de testuitvoeringsgegevens worden opgeslagen voor de werkruimte.Selecteer Werkruimte maken om de werkruimte in uw abonnement te maken.
Tijdens het maken van de werkruimte worden een nieuwe resourcegroep en een Microsoft Playwright Testing Azure-resource gemaakt in uw Azure-abonnement.
Wanneer het maken van de werkruimte is voltooid, wordt u omgeleid naar de installatiehandleiding.
Een toegangstoken maken voor serviceverificatie
Microsoft Playwright Testing gebruikt toegangstokens om gebruikers te autoriseren playwright-tests uit te voeren met de service. U genereert eerst een servicetoegangstoken in de Playwright-portal en slaat vervolgens de waarde op in een omgevingsvariabele.
Voer de volgende stappen uit om het toegangstoken te genereren:
Selecteer in de installatiehandleiding van de werkruimte in Create an access token de optie Generate token.
Kopieer het toegangstoken voor de werkruimte.
U hebt de waarde van het toegangstoken nodig voor het configureren van uw omgeving in een latere stap.
Het eindpunt van de serviceregio configureren
In de serviceconfiguratie moet u het regiospecifieke service-eindpunt opgeven. Het eindpunt is afhankelijk van de Azure-regio die u hebt geselecteerd bij het maken van de werkruimte.
Voer de volgende stappen uit om de URL van het service-eindpunt op te halen:
In Het eindpunt regio toevoegen in uw installatie kopieert u het regio-eindpunt voor uw werkruimte.
De eindpunt-URL komt overeen met de Azure-regio die u hebt geselecteerd bij het maken van de werkruimte.
Uw omgeving instellen
Als u uw omgeving wilt instellen, moet u de PLAYWRIGHT_SERVICE_ACCESS_TOKEN
en PLAYWRIGHT_SERVICE_URL
omgevingsvariabelen configureren met de waarden die u in de vorige stappen hebt verkregen.
U wordt aangeraden de dotenv
module te gebruiken om uw omgeving te beheren. Met dotenv
, definieert u uw omgevingsvariabelen in het .env
bestand.
Voeg de
dotenv
module toe aan uw project:npm i --save-dev dotenv
Maak een
.env
bestand naast het bestand in uwplaywright.config.ts
Playwright-project:PLAYWRIGHT_SERVICE_ACCESS_TOKEN={MY-ACCESS-TOKEN} PLAYWRIGHT_SERVICE_URL={MY-REGION-ENDPOINT}
Vervang de tijdelijke aanduidingen voor tekst
{MY-ACCESS-TOKEN}
door{MY-REGION-ENDPOINT}
de waarden die u eerder hebt gekopieerd.
Let op
Zorg ervoor dat u het .env
bestand niet toevoegt aan uw broncodeopslagplaats om te voorkomen dat de waarde van het toegangstoken wordt gelekt.
Een serviceconfiguratiebestand toevoegen
Als u uw Playwright-tests wilt uitvoeren in uw Microsoft Playwright Testing-werkruimte, moet u een serviceconfiguratiebestand toevoegen naast uw Playwright-configuratiebestand. Het serviceconfiguratiebestand verwijst naar de omgevingsvariabelen om het werkruimte-eindpunt en uw toegangstoken op te halen.
De serviceconfiguratie toevoegen aan uw project:
Maak een nieuw bestand
playwright.service.config.ts
naast hetplaywright.config.ts
bestand.Gebruik desgewenst het
playwright.service.config.ts
bestand in de voorbeeldopslagplaats.Voeg de volgende inhoud toe:
/* * This file enables Playwright client to connect to remote browsers. * It should be placed in the same directory as playwright.config.ts. */ import { defineConfig } from '@playwright/test'; import config from './playwright.config'; import dotenv from 'dotenv'; // Define environment on the dev box in .env file: // .env: // PLAYWRIGHT_SERVICE_ACCESS_TOKEN=XXX // PLAYWRIGHT_SERVICE_URL=XXX // Define environment in your GitHub workflow spec. // env: // PLAYWRIGHT_SERVICE_ACCESS_TOKEN: ${{ secrets.PLAYWRIGHT_SERVICE_ACCESS_TOKEN }} // PLAYWRIGHT_SERVICE_URL: ${{ secrets.PLAYWRIGHT_SERVICE_URL }} // PLAYWRIGHT_SERVICE_RUN_ID: ${{ github.run_id }}-${{ github.run_attempt }}-${{ github.sha }} dotenv.config(); // Name the test run if it's not named yet. process.env.PLAYWRIGHT_SERVICE_RUN_ID = process.env.PLAYWRIGHT_SERVICE_RUN_ID || new Date().toISOString(); // Can be 'linux' or 'windows'. const os = process.env.PLAYWRIGHT_SERVICE_OS || 'linux'; export default defineConfig(config, { // Define more generous timeout for the service operation if necessary. // timeout: 60000, // expect: { // timeout: 10000, // }, workers: 20, // Enable screenshot testing and configure directory with expectations. // https://learn.microsoft.com/azure/playwright-testing/how-to-configure-visual-comparisons ignoreSnapshots: false, snapshotPathTemplate: `{testDir}/__screenshots__/{testFilePath}/${os}/{arg}{ext}`, use: { // Specify the service endpoint. connectOptions: { wsEndpoint: `${process.env.PLAYWRIGHT_SERVICE_URL}?cap=${JSON.stringify({ // Can be 'linux' or 'windows'. os, runId: process.env.PLAYWRIGHT_SERVICE_RUN_ID })}`, timeout: 30000, headers: { 'x-mpt-access-key': process.env.PLAYWRIGHT_SERVICE_ACCESS_TOKEN! }, // Allow service to access the localhost. exposeNetwork: '<loopback>' } }, // Tenmp workaround for config merge bug in OSS https://github.com/microsoft/playwright/pull/28224 projects: config.projects? config.projects : [{}] });
Sla het bestand op.
Uw tests op schaal uitvoeren met Microsoft Playwright Testing
U hebt nu de configuratie voorbereid voor het uitvoeren van playwright-tests in de cloud met Microsoft Playwright Testing. U kunt de Playwright CLI gebruiken om uw tests uit te voeren of de Playwright Test Visual Studio Code-extensie gebruiken.
Eén test op schaal uitvoeren
Met Microsoft Playwright Testing worden kosten in rekening gebracht op basis van het totale aantal testminuten. Als u een eerste gebruiker bent of aan de slag gaat met een gratis proefversie, kunt u beginnen met het uitvoeren van één test op schaal in plaats van uw volledige testpakket om te voorkomen dat u uw gratis testminuten uitgeput raakt.
Nadat u hebt gevalideerd dat de test is uitgevoerd, kunt u de belasting van de test geleidelijk verhogen door meer tests met de service uit te voeren.
Voer de volgende stappen uit om één Playwright-test uit te voeren met Microsoft Playwright Testing:
Als u de Playwright CLI wilt gebruiken om uw tests uit te voeren met Microsoft Playwright Testing, geeft u het serviceconfiguratiebestand door als een opdrachtregelparameter.
Een terminalvenster openen.
Voer de volgende opdracht in om uw Playwright-test uit te voeren op externe browsers in uw werkruimte:
Vervang de tijdelijke aanduiding voor tekst
{name-of-file.spec.ts}
door de naam van het testspecificatiebestand.npx playwright test {name-of-file.spec.ts} --config=playwright.service.config.ts
Nadat de test is voltooid, kunt u de teststatus in de terminal bekijken.
Running 1 test using 1 worker 1 passed (2.2s) To open last HTML report run: npx playwright show-report
U kunt nu meerdere tests uitvoeren met de service of uw hele testpakket uitvoeren op externe browsers.
Let op
Afhankelijk van de grootte van uw testpakket, worden er mogelijk extra kosten in rekening gebracht voor de testminuten die buiten uw gratis testminuten zijn toegewezen.
Een volledige testsuite op schaal uitvoeren
Nu u hebt gevalideerd dat u één test kunt uitvoeren met Microsoft Playwright Testing, kunt u een volledig Playwright-testpakket op schaal uitvoeren.
Voer de volgende stappen uit om een volledig Playwright-testpakket uit te voeren met Microsoft Playwright Testing:
Wanneer u meerdere Playwright-tests of een volledige testsuite uitvoert met Microsoft Playwright Testing, kunt u desgewenst het aantal parallelle werkrollen opgeven als opdrachtregelparameter.
Een terminalvenster openen.
Voer de volgende opdracht in om uw Playwright-testpakket uit te voeren op externe browsers in uw werkruimte:
npx playwright test --config=playwright.service.config.ts --workers=20
Afhankelijk van de grootte van uw testpakket voert deze opdracht uw tests uit op maximaal 20 parallelle werkrollen.
Nadat de test is voltooid, kunt u de teststatus in de terminal bekijken.
Running 6 tests using 6 workers 6 passed (18.2s) To open last HTML report run: npx playwright show-report
Testuitvoeringen weergeven in de Playwright-portal
Ga naar de Playwright-portal om de metagegevens en het activiteitenlogboek van de testuitvoering voor uw werkruimte weer te geven.
Het activiteitenlogboek bevat de volgende details voor elke testuitvoering: de totale voltooiingstijd van de test, het aantal parallelle werkrollen en het aantal testminuten.
Testresultaten weergeven in de Playwright-portal
Microsoft Playwright Testing ondersteunt nu het weergeven van testresultaten in de Playwright-portal. Deze functie is alleen beschikbaar als uitnodigingsfunctie.
Belangrijk
De rapportagefunctie van de Microsoft Playwright Testing-service is gratis tijdens de preview-versie voor alleen-uitnodigen. Bestaande functionaliteit van browsers die in de cloud worden gehost, blijft echter factureren volgens het Azure-prijsplan.
Zodra u toegang hebt tot het rapportagehulpprogramma, gebruikt u de volgende stappen om uw tests in te stellen.
Navigeer vanaf de startpagina van de werkruimte naar Instellingen.
Selecteer in Instellingen Algemeen en zorg ervoor dat rapportage is ingeschakeld.
Zorg ervoor dat de omgeving correct is ingesteld zoals vermeld in de sectie Uw omgeving instellen.
Rapportagepakket installeren
Omdat de functie momenteel niet openbaar is, moet u een paar extra stappen uitvoeren om het pakket te installeren. Deze stappen zijn niet nodig zodra de functie openbaar wordt.
Maak een bestand met de naam
.npmrc
op dezelfde locatie als uw Playwright-configuratiebestand.Voeg de volgende inhoud toe aan het bestand en sla deze op.
@microsoft:registry=https://npm.pkg.github.com
Maak een Persoonlijk GitHub-toegangstoken door deze stappen uit te voeren.
U moet machtigingen voor het token opgeven
read:packages
. Dit token wordt genoemdPAT_TOKEN_PACKAGE
voor de rest van dit artikel.Voer de volgende opdracht uit in uw terminal op de locatie van het Playwright-configuratiebestand. Vervang
PAT_TOKEN_PACKAGE
door het token dat in de vorige stap is gegenereerd.npm set //npm.pkg.github.com/:_authToken PAT_TOKEN_PACKAGE
Werk package.json bestand bij met het pakket.
"dependencies": { "@microsoft/mpt-reporter": "0.1.0-19072024-private-preview" }
Voer
npm install
uit om het pakket te installeren.
Playwright.config-bestand bijwerken
Voeg Playwright Testing reporter toe aan
Playwright.config.ts
dezelfde manier als u andere reporters gebruikt.import { defineConfig } from '@playwright/test'; export default defineConfig({ reporter: [ ['list'], ['json', { outputFile: 'test-results.json' }], ['@microsoft/mpt-reporter'] // Microsoft Playwright Testing reporter ], });
Zorg ervoor dat de artefacten zijn ingeschakeld in de configuratie voor betere probleemoplossing.
use: { // ... trace: 'on-first-retry', video:'retain-on-failure', screenshot:'only-on-failure', }
Playwright-tests uitvoeren
U kunt de opdracht uitvoeren
npx playwright test
en de resultaten en artefacten bekijken in de Playwright Testing-portal.
Tip
U kunt de Microsoft Playwright Testing-service gebruiken om testresultaten te publiceren naar de portal, onafhankelijk van de functie voor in de cloud gehoste browsers.
Parallelle werkrolconfiguratie optimaliseren
Zodra uw tests soepel worden uitgevoerd met de service, experimenteert u met verschillende parallelle werkrollen om de optimale configuratie te bepalen waarmee de voltooiingstijd van de test wordt geminimaliseerd.
Met Microsoft Playwright Testing kunt u maximaal 50 parallelle werkrollen uitvoeren. Verschillende factoren zijn van invloed op de beste configuratie voor uw project, zoals de CPU, het geheugen en de netwerkbronnen van uw clientcomputer, de belastingafhandelingscapaciteit van de doeltoepassing en het type acties dat in uw tests wordt uitgevoerd.
U kunt het aantal parallelle werkrollen opgeven op de opdrachtregel van playwright CLI of de workers
eigenschap configureren in het playwright-serviceconfiguratiebestand.
Meer informatie over het bepalen van de optimale configuratie voor het optimaliseren van de voltooiing van het testpakket.
Volgende stap
U hebt een Microsoft Playwright Testing-werkruimte gemaakt in de Playwright-portal en uw Playwright-tests uitvoeren op cloudbrowsers.
Ga naar de volgende quickstart om doorlopend end-to-end testen in te stellen door playwright-tests uit te voeren in uw CI/CD-werkstroom.
Feedback
https://aka.ms/ContentUserFeedback.
Binnenkort beschikbaar: In de loop van 2024 zullen we GitHub-problemen geleidelijk uitfaseren als het feedbackmechanisme voor inhoud en deze vervangen door een nieuw feedbacksysteem. Zie voor meer informatie:Feedback verzenden en weergeven voor