Delen via

Quickstart: Problemen met tests oplossen met Microsoft Playwright Testing Preview

  • Artikel

In deze quickstart leert u hoe u problemen met playwright-tests eenvoudig kunt oplossen met behulp van rapporten en artefacten die zijn gepubliceerd op Microsoft Playwright Testing Preview. Daarnaast laat deze handleiding zien hoe u de rapportagefunctie gebruikt, ongeacht of u tests uitvoert op de in de cloud gehoste browsers die door de service worden geleverd.

Nadat u deze quickstart hebt voltooid, hebt u een Microsoft Playwright Testing-werkruimte om testresultaten en artefacten in de serviceportal weer te geven.

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.

Achtergrond

Met de Microsoft Playwright Testing-service kunt u het volgende doen:

  • Versnel build-pijplijnen door tests parallel uit te voeren met behulp van in de cloud gehoste browsers.
  • Vereenvoudig het oplossen van problemen door testresultaten en artefacten naar de service te publiceren, zodat ze toegankelijk zijn via de serviceportal.

Deze twee functies van de service kunnen onafhankelijk of samen worden gebruikt en elk heeft een eigen prijsplan. U hebt de flexibiliteit om:

  • Testuitvoeringen versnellen en probleemoplossing stroomlijnen met behulp van beide functies: tests uitvoeren in in de cloud gehoste browsers en resultaten publiceren naar de service.
  • Voer tests alleen uit in de cloud gehoste browsers om testuitvoeringen sneller te voltooien.
  • Publiceer testresultaten naar de service terwijl u lokaal tests blijft uitvoeren voor efficiënte probleemoplossing.

Notitie

In dit artikel wordt uitgelegd hoe u testresultaten naar de service kunt publiceren zonder gebruik te maken van in de cloud gehoste browsers. Als u wilt weten hoe u ook uw testuitvoeringen kunt versnellen, raadpleegt u de quickstart: Playwright-tests op schaal uitvoeren

Vereisten

Een werkruimte maken

Als u aan de slag wilt gaan met het publiceren van testresultaten in de Playwright Testing-service, maakt u eerst een Microsoft Playwright Testing-werkruimte in de Playwright-portal.

  1. Meld u aan bij de Playwright-portal met uw Azure-account.

  2. 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.

  3. 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.

    Schermopname van de pagina Werkruimte maken in de Playwright-portal.

  4. 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.

Microsoft Playwright Testing Package installeren

Als u de service wilt gebruiken, installeert u het Microsoft Playwright Testing-pakket.

npm init @azure/microsoft-playwright-testing@latest

Notitie

Zorg ervoor dat uw project versie 1.47 of hoger gebruikt @playwright/test .

Met deze opdracht wordt een bestand gegenereerd playwright.service.config.ts dat fungeert voor:

  • Uw Playwright-client omsturen en verifiëren bij de Microsoft Playwright Testing-service.
  • Hiermee voegt u een reporter toe om testresultaten en artefacten te publiceren.

Als u dit bestand al hebt, wordt u gevraagd het te overschrijven.

Als u alleen de rapportagefunctie voor de testuitvoering wilt gebruiken, schakelt u in de cloud gehoste browsers uit door deze in te stellen useCloudHostedBrowsers als onwaar.

export default defineConfig(
  config,
  getServiceConfig(config, {
    timeout: 30000,
    os: ServiceOS.LINUX,
	useCloudHostedBrowsers: false // Do not use cloud hosted browsers
  }),
  {
    reporter: [['list'], ['@azure/microsoft-playwright-testing/reporter']], // Reporter for Microsoft Playwright Testing service
  }
);

Als u de waarde instelt, false zorgt u ervoor dat browsers die in de cloud worden gehost, niet worden gebruikt om de tests uit te voeren. De tests worden uitgevoerd op uw lokale computer, maar de resultaten en artefacten worden gepubliceerd op de service.

Als u de service wilt gebruiken, installeert u het Microsoft Playwright Testing-pakket.

dotnet add package Azure.Developer.MicrosoftPlaywrightTesting.NUnit --prerelease

Notitie

Zorg ervoor dat uw project versie 1.47 of hoger gebruikt Microsoft.Playwright.NUnit .

Als u alleen de rapportagefunctie wilt gebruiken, werkt u het volgende bij in het .runsettings bestand van uw project:

  1. Schakel in de cloud gehoste browsers uit door deze in te stellen useCloudHostedBrowsers op false.
  2. Voeg Microsoft Playwright Testing Logger toe in de sectie Loggers.
<?xml version="1.0" encoding="utf-8"?>
<RunSettings>
    <TestRunParameters>        
        <!--Select if you want to use cloud-hosted browsers to run your Playwright tests.-->
        <Parameter name="UseCloudHostedBrowsers" value="true" />
        <!--Select the authentication method you want to use with Entra-->
    </TestRunParameters> 
 .
 .
 .
    <LoggerRunSettings>
        <Loggers>
            <!--Microsoft Playwright Testing service logger for reporting -->
            <Logger friendlyName="microsoft-playwright-testing" enabled="True" />
            <!--could enable any logger additionally -->
            <Logger friendlyName="trx" enabled="false" />
        </Loggers>
    </LoggerRunSettings>
</RunSettings>

Tip

Als u de testuitvoering wilt versnellen met behulp van een in de cloud gehoste browser, kunt u instellen useCloudHostedBrowsers als waar. Hiermee worden uw tests uitgevoerd op de door de service beheerde browsers.

Het eindpunt van de serviceregio configureren

In uw installatie 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:

  1. 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. Zorg ervoor dat deze URL beschikbaar is in PLAYWRIGHT_SERVICE_URL de omgevingsvariabele.

    Schermopname van het kopiëren van het eindpunt van de werkruimteregio in de Playwright Testing-portal.

Uw omgeving instellen

Als u uw omgeving wilt instellen, moet u de PLAYWRIGHT_SERVICE_URL omgevingsvariabele configureren met de waarde 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.

  1. Voeg de dotenv module toe aan uw project:

    npm i --save-dev dotenv

  2. Maak een .env bestand naast het bestand in uw playwright.config.ts Playwright-project:

    PLAYWRIGHT_SERVICE_URL={MY-REGION-ENDPOINT}

    Zorg ervoor dat u de tijdelijke aanduiding voor tekst {MY-REGION-ENDPOINT} vervangt door de waarde die u eerder hebt gekopieerd.

Serviceconfiguratie instellen

Maak een bestand PlaywrightServiceSetup.cs in de hoofdmap met de volgende inhoud.

using Azure.Developer.MicrosoftPlaywrightTesting.NUnit;

namespace PlaywrightTests; // Remember to change this as per your project namespace

[SetUpFixture]
public class PlaywrightServiceSetup : PlaywrightServiceNUnit {};

Notitie

Zorg ervoor dat uw project versie 1.47 of hoger gebruikt Microsoft.Playwright.NUnit .

Verificatie instellen

Als u testresultaten en artefacten wilt publiceren naar uw Microsoft Playwright Testing-werkruimte, moet u de Playwright-client verifiëren waar u de tests uitvoert met de service. De client kan uw lokale dev-machine of CI-computer zijn.

De service biedt twee verificatiemethoden: Microsoft Entra ID en Toegangstokens.

Microsoft Entra ID maakt gebruik van uw Azure-referenties, waarvoor een aanmelding bij uw Azure-account is vereist voor beveiligde toegang. U kunt ook een toegangstoken genereren vanuit uw Playwright-werkruimte en deze gebruiken in uw installatie.

Verificatie instellen met behulp van Microsoft Entra-id

Microsoft Entra-id is de standaard- en aanbevolen verificatie voor de service. Vanaf uw lokale ontwikkelcomputer kunt u Azure CLI gebruiken om u aan te melden

az login

Notitie

Als u deel uitmaakt van meerdere Microsoft Entra-tenants, moet u zich aanmelden bij de tenant waartoe uw werkruimte behoort. U kunt de tenant-id ophalen uit de Azure-portal. Zie Uw Microsoft Entra-tenant zoeken voor meer informatie. Zodra u de id hebt getympt, meldt u zich aan met behulp van de opdracht az login --tenant <TenantID>

Verificatie instellen met behulp van toegangstokens

U kunt een toegangstoken genereren vanuit uw Playwright Testing-werkruimte en deze gebruiken in uw installatie. We raden Microsoft Entra ID echter ten zeerste aan voor verificatie vanwege de verbeterde beveiliging. Toegangstokens, terwijl dit handig is, werken zoals wachtwoorden met een lange levensduur en zijn gevoeliger voor inbreuk.

  1. Verificatie met toegangstokens is standaard uitgeschakeld. Als u wilt gebruiken, schakelt u verificatie op basis van toegangstokens in

  2. Verificatie instellen met behulp van toegangstokens

Let op

We raden u ten zeerste aan Microsoft Entra ID te gebruiken voor verificatie bij de service. Als u toegangstokens gebruikt, raadpleegt u Toegangstokens beheren

Artefacten inschakelen in uw Playwright-installatie

Zorg ervoor dat u alle vereiste artefacten verzamelt in het playwright.config.ts bestand van uw project.

  use: {
    trace: 'on-first-retry',
    video:'retain-on-failure',
    screenshot:'on'
  }

Hiermee kunt u artefacten zoals schermopname, video's en traceringen vastleggen door Playwright.

  • Zie Schermopnamen vastleggen voor schermopnamen
  • Zie video's opnemen voor uw tests voor video's
  • Zie Een tracering opnemen voor traceringen

Zodra u deze artefacten hebt verzameld, voegt u deze toe aan de TestContext artefacten om ervoor te zorgen dat ze beschikbaar zijn in uw testrapporten. Zie ons voorbeeldproject voor NUnit voor meer informatie

Uw tests uitvoeren en resultaten publiceren op Microsoft Playwright Testing

U hebt nu de configuratie voorbereid voor het publiceren van testresultaten en artefacten met Microsoft Playwright Testing. Voer tests uit met behulp van het zojuist gemaakte playwright.service.config.ts bestand en publiceer testresultaten en artefacten naar de service.

   npx playwright test --config=playwright.service.config.ts

Notitie

Voor de rapportagefunctie van Microsoft Playwright Testing worden kosten in rekening gebracht op basis van de gepubliceerde nummertestresultaten. Als u een eerste gebruiker bent of aan de slag gaat met een gratis proefversie, kunt u beginnen met het publiceren van één testresultaat in plaats van uw volledige testpakket om te voorkomen dat de limieten voor de gratis proefversie worden uitgeput.

Nadat de test is voltooid, kunt u de teststatus in de terminal bekijken.

Running 6 test using 2 worker
    5 passed, 1 failed (20.2s)

Test report: https://playwright.microsoft.com/workspaces/<workspace-id>/runs/<run-id>

U hebt nu de configuratie voorbereid voor het publiceren van testresultaten en artefacten met Microsoft Playwright Testing. Voer tests uit met behulp van het .runsettings bestand en publiceer testresultaten en artefacten naar de service.

dotnet test --settings:.runsettings

De instellingen voor de testuitvoering worden gedefinieerd in .runsettings het bestand. Zie voor meer informatie over het gebruik van servicepakketopties

Notitie

Voor de rapportagefunctie van Microsoft Playwright Testing worden kosten in rekening gebracht op basis van de gepubliceerde nummertestresultaten. Als u een eerste gebruiker bent of aan de slag gaat met een gratis proefversie, kunt u beginnen met het publiceren van één testresultaat in plaats van uw volledige testpakket om te voorkomen dat de limieten voor de gratis proefversie worden uitgeput.

Nadat de testuitvoering is voltooid, kunt u de teststatus in de terminal bekijken.

Starting test execution, please wait...

Initializing reporting for this test run. You can view the results at: https://playwright.microsoft.com/workspaces/<workspace-id>/runs/<run-id>

A total of 100 test files matched the specified pattern.

Test Report: https://playwright.microsoft.com/workspaces/<workspace-id>/runs/<run-id>

Passed!  - Failed:     0, Passed:     100, Skipped:     0, Total:     100, Duration: 10 m - PlaywrightTestsNUnit.dll (net7.0)

Workload updates are available. Run `dotnet workload list` for more information.

Let op

Afhankelijk van de grootte van uw testpakket, worden er mogelijk extra kosten in rekening gebracht voor de testresultaten buiten uw toegewezen gratis testresultaten.

Testuitvoeringen en resultaten weergeven in de Playwright-portal

U kunt nu problemen met de mislukte testcases oplossen in de Playwright-portal.

  1. Nadat de testuitvoering is voltooid, wordt er een koppeling naar de Playwright-portal gegenereerd. Open deze koppeling om gedetailleerde testresultaten en bijbehorende artefacten weer te geven. In de portal worden essentiële informatie weergegeven, waaronder:

    • Details van CI-build
    • Algemene testuitvoeringsstatus
    • De doorvoer-id die is gekoppeld aan de testuitvoering

    Schermopname van een lijst met tests in de testuitvoering.

  2. De Playwright-portal biedt alle benodigde informatie voor het oplossen van problemen. U kunt:

    • Schakelen tussen nieuwe pogingen.
    • Bekijk gedetailleerde foutenlogboeken, teststappen en bijgevoegde artefacten, zoals schermopnamen of video's.
    • Navigeer rechtstreeks naar traceerviewer voor een diepere analyse.

    Schermopname van het voorbeeld van een test.

  3. Met Trace Viewer kunt u uw testuitvoering visueel doorlopen. U kunt:

    • Gebruik de tijdlijn om de muisaanwijzer over afzonderlijke stappen te bewegen, waarbij de paginastatus voor en na elke actie wordt weergegeven.
    • Inspecteer gedetailleerde logboeken, DOM-momentopnamen, netwerkactiviteit, fouten en console-uitvoer voor elke stap.

    Schermopname van de traceringsviewer.

  1. Nadat de testuitvoering is voltooid, krijgt u een koppeling naar de Playwright-portal in uw terminal. Open deze koppeling om gedetailleerde testresultaten en bijbehorende artefacten weer te geven. In de portal worden essentiële informatie weergegeven, waaronder:

    • Details van CI-build
    • Algemene testuitvoeringsstatus
    • De doorvoer-id die is gekoppeld aan de testuitvoering

    Schermopname van een lijst met tests in de testuitvoering.

  2. De Playwright-portal biedt alle benodigde informatie voor het oplossen van problemen. U kunt:

    • Bekijk gedetailleerde foutenlogboeken en bijgevoegde artefacten, zoals schermopnamen of video's.
    • Navigeer rechtstreeks naar traceerviewer voor een diepere analyse.

    Schermopname van het voorbeeld van een test.

Notitie

Sommige metagegevens, zoals de eigenaar, beschrijving en categorie, worden momenteel niet weergegeven op het servicedashboard. Als er aanvullende informatie is die u wilt zien, dient u een GitHub-probleem in onze opslagplaats in.

  1. Met Trace Viewer kunt u uw testuitvoering visueel doorlopen. U kunt:

    • Gebruik de tijdlijn om de muisaanwijzer over afzonderlijke stappen te bewegen, waarbij de paginastatus voor en na elke actie wordt weergegeven.
    • Inspecteer gedetailleerde logboeken, DOM-momentopnamen, netwerkactiviteit, fouten en console-uitvoer voor elke stap.

    Schermopname van de traceringsviewer.

Tip

U kunt ook de Microsoft Playwright Testing-service gebruiken om tests parallel uit te voeren met behulp van in de cloud gehoste browsers. Zowel rapportage- als in de cloud gehoste browsers zijn onafhankelijke functies en worden afzonderlijk gefactureerd. U kunt deze of beide gebruiken. Zie Servicefuncties gebruiken voor meer informatie

Notitie

De testresultaten en artefacten die u publiceert, worden gedurende 90 dagen bewaard in de service. Daarna worden ze automatisch verwijderd.

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.

Doorlopend end-to-end testen instellen in CI/CD