Dela via


Snabbstart: Felsöka tester med Förhandsversion av Microsoft Playwright-testning

I den här snabbstarten får du lära dig hur du felsöker dina Playwright-tester enkelt med hjälp av rapporter och artefakter som publicerats på Microsoft Playwright Testing Preview. Dessutom visar den här guiden hur du använder rapporteringsfunktionen, oavsett om du kör tester på de molnbaserade webbläsare som tillhandahålls av tjänsten.

När du har slutfört den här snabbstarten har du en Microsoft Playwright Testing-arbetsyta för att visa testresultat och artefakter i tjänstportalen.

Viktigt!

Microsoft Playwright Testing är för närvarande i förhandsversion. Juridiska villkor som gäller för Azure-funktioner som är i betaversion, förhandsversion eller som ännu inte har släppts i allmän tillgänglighet finns i Kompletterande användningsvillkor för Förhandsversioner av Microsoft Azure.

Bakgrund

Med Microsoft Playwright Testing Service kan du:

  • Påskynda bygg-pipelines genom att köra tester parallellt med hjälp av molnbaserade webbläsare.
  • Förenkla felsökningen genom att publicera testresultat och artefakter till tjänsten, vilket gör dem tillgängliga via tjänstportalen.

Dessa två funktioner i tjänsten kan användas separat eller tillsammans, och var och en har en egen prisplan. Du har flexibiliteten att:

  • Påskynda testkörningar och effektivisera felsökningen med hjälp av båda funktionerna: köra tester i molnbaserade webbläsare och publicera resultat till tjänsten.
  • Kör endast tester i molnbaserade webbläsare för att slutföra testkörningar snabbare.
  • Publicera testresultat till tjänsten samtidigt som du fortsätter att köra tester lokalt för effektiv felsökning.

Kommentar

Den här artikeln fokuserar på hur du kan publicera testresultat till tjänsten utan att använda molnbaserade webbläsare. Om du vill lära dig hur du även påskyndar dina testkörningar kan du läsa snabbstart: köra Playwright-tester i stor skala

Förutsättningar

  • Ett Azure-konto med en aktiv prenumeration. Om du inte har någon Azure-prenumeration skapar du ett kostnadsfritt konto innan du börjar.
  • Ditt Azure-konto behöver rollen Ägare, Deltagare eller någon av de klassiska administratörsrollerna.
  • Ett dramatikerprojekt. Om du inte har ett projekt skapar du ett med hjälp av dokumentationen om att komma igång med Dramatiker eller använder vårt Exempelprojekt för Microsoft Playwright Testing.
  • Azure CLI. Om du inte har Azure CLI kan du läsa Installera Azure CLI.

Skapa en arbetsyta

För att komma igång med publicering av testresultat på playwright testing service skapar du först en Microsoft Playwright Testing-arbetsyta i Playwright-portalen.

  1. Logga in på Playwright-portalen med ditt Azure-konto.

  2. Om du redan har en arbetsyta väljer du en befintlig arbetsyta och går vidare till nästa steg.

    Dricks

    Om du har flera arbetsytor kan du växla till en annan arbetsyta genom att välja namnet på arbetsytan överst på sidan och sedan välja Hantera alla arbetsytor.

  3. Om du inte har någon arbetsyta än väljer du + Ny arbetsyta och anger sedan följande information:

    Fält beskrivning
    Namn på arbetsyta Ange ett unikt namn för att identifiera din arbetsyta.
    Namnet kan bara bestå av alfanumeriska tecken och ha en längd på mellan 3 och 64 tecken.
    Azure-prenumeration Välj den Azure-prenumeration som du vill använda för den här Microsoft Playwright Testing-arbetsytan.
    Region Välj en geografisk plats som värd för din arbetsyta.
    Det här är den plats där testkörningsdata lagras för arbetsytan.

    Skärmbild som visar sidan Skapa arbetsyta i Playwright-portalen.

  4. Välj Skapa arbetsyta för att skapa arbetsytan i din prenumeration.

    När arbetsytan skapas skapas en ny resursgrupp och en Microsoft Playwright Testing Azure-resurs i din Azure-prenumeration.

När arbetsytan har skapats omdirigeras du till installationsguiden.

Installera Testpaket för Microsoft Playwright

Om du vill använda tjänsten installerar du Microsoft Playwright Testing-paketet.

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

Kommentar

Kontrollera att ditt projekt använder @playwright/test version 1.47 eller senare.

Det här kommandot genererar playwright.service.config.ts en fil som används för att:

  • Dirigera och autentisera din Playwright-klient till Microsoft Playwright Testing-tjänsten.
  • Lägger till en reporter för att publicera testresultat och artefakter.

Om du redan har den här filen uppmanas du att åsidosätta den.

Om du bara vill använda rapporteringsfunktionen för testkörningen inaktiverar du molnbaserade webbläsare genom att ange useCloudHostedBrowsers som false.

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

Om du anger värdet som false ser du till att molnbaserade webbläsare inte används för att köra testerna. Testerna körs på den lokala datorn, men resultaten och artefakterna publiceras i tjänsten.

Om du vill använda tjänsten installerar du Microsoft Playwright Testing-paketet.

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

Kommentar

Kontrollera att ditt projekt använder Microsoft.Playwright.NUnit version 1.47 eller senare.

Om du bara vill använda rapporteringsfunktionen uppdaterar du följande i filen i .runsettings projektet:

  1. Inaktivera molnbaserade webbläsare genom att ange useCloudHostedBrowsers som false.
  2. Lägg till Microsoft Playwright Testing-logger i avsnittet "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>

Dricks

Om du vill påskynda testkörningen med hjälp av en molnbaserad webbläsare kan du ange useCloudHostedBrowsers som true. Då körs dina tester i de tjänsthanterade webbläsarna.

Konfigurera tjänstregionens slutpunkt

I konfigurationen måste du ange den regionspecifika tjänstslutpunkten. Slutpunkten beror på vilken Azure-region du valde när du skapade arbetsytan.

Utför följande steg för att hämta tjänstens slutpunkts-URL:

  1. I Lägg till regionslutpunkt i konfigurationen kopierar du regionslutpunkten för din arbetsyta.

    Slutpunkts-URL:en matchar den Azure-region som du valde när du skapade arbetsytan. Kontrollera att den här URL:en är tillgänglig i PLAYWRIGHT_SERVICE_URL miljövariabeln.

    Skärmbild som visar hur du kopierar arbetsytans regionslutpunkt i portalen för dramatikertestning.

Konfigurera din miljö

För att konfigurera din miljö måste du konfigurera PLAYWRIGHT_SERVICE_URL miljövariabeln med det värde som du fick i föregående steg.

Vi rekommenderar att du använder modulen dotenv för att hantera din miljö. Med dotenvdefinierar du dina miljövariabler i .env filen.

  1. Lägg till modulen i dotenv projektet:

    npm i --save-dev dotenv
    
  2. Skapa en .env fil tillsammans med playwright.config.ts filen i ditt Playwright-projekt:

    PLAYWRIGHT_SERVICE_URL={MY-REGION-ENDPOINT}
    

    Ersätt {MY-REGION-ENDPOINT} textplatshållaren med det värde som du kopierade tidigare.

Konfigurera tjänstkonfiguration

Skapa en fil PlaywrightServiceSetup.cs i rotkatalogen med följande innehåll.

using Azure.Developer.MicrosoftPlaywrightTesting.NUnit;

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

[SetUpFixture]
public class PlaywrightServiceSetup : PlaywrightServiceNUnit {};

Kommentar

Kontrollera att ditt projekt använder Microsoft.Playwright.NUnit version 1.47 eller senare.

Konfigurera autentisering

Om du vill publicera testresultat och artefakter på din Microsoft Playwright Testing-arbetsyta måste du autentisera Playwright-klienten där du kör testerna med tjänsten. Klienten kan vara din lokala utvecklingsdator eller CI-dator.

Tjänsten erbjuder två autentiseringsmetoder: Microsoft Entra-ID och åtkomsttoken.

Microsoft Entra-ID använder dina Azure-autentiseringsuppgifter och kräver en inloggning till ditt Azure-konto för säker åtkomst. Du kan också generera en åtkomsttoken från din Playwright-arbetsyta och använda den i konfigurationen.

Konfigurera autentisering med Microsoft Entra-ID

Microsoft Entra-ID är standard och rekommenderad autentisering för tjänsten. Från din lokala utvecklingsdator kan du använda Azure CLI för att logga in

az login

Kommentar

Om du är en del av flera Microsoft Entra-klienter kontrollerar du att du loggar in på den klientorganisation där din arbetsyta tillhör. Du kan hämta klientorganisations-ID:t från Azure Portal. Mer information finns i Hitta din Microsoft Entra-klientorganisation. När du har fått ID:t loggar du in med kommandot az login --tenant <TenantID>

Konfigurera autentisering med hjälp av åtkomsttoken

Du kan generera en åtkomsttoken från din Playwright Testing-arbetsyta och använda den i konfigurationen. Vi rekommenderar dock starkt Microsoft Entra-ID för autentisering på grund av den förbättrade säkerheten. Åtkomsttoken fungerar, även om de är praktiska, som långlivade lösenord och är mer mottagliga för att komprometteras.

  1. Autentisering med åtkomsttoken är inaktiverat som standard. Aktivera åtkomsttokenbaserad autentisering för att använda

  2. Konfigurera autentisering med hjälp av åtkomsttoken

Varning

Vi rekommenderar starkt att du använder Microsoft Entra-ID för autentisering till tjänsten. Om du använder åtkomsttoken läser du Hantera åtkomsttoken

Aktivera artefakter i din playwright-konfiguration

playwright.config.ts Kontrollera att du samlar in alla nödvändiga artefakter i filen för projektet.

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

Aktivera artefakter som skärmbild, videor och spårningar som ska fångas av Dramatiker.

När du har samlat in dessa artefakter kopplar du dem till TestContext för att säkerställa att de är tillgängliga i testrapporterna. Mer information finns i vårt exempelprojekt för NUnit

Kör dina tester och publicera resultat på Microsoft Playwright Testing

Nu har du förberett konfigurationen för publicering av testresultat och artefakter med Microsoft Playwright Testing. Kör tester med hjälp av den nyligen skapade playwright.service.config.ts filen och publicera testresultat och artefakter till tjänsten.

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

Kommentar

För rapporteringsfunktionen i Microsoft Playwright Testing debiteras du baserat på antalet publicerade testresultat. Om du är förstagångsanvändare eller kommer igång med en kostnadsfri utvärderingsversion kan du börja med att publicera ett enskilt testresultat i stället för din fullständiga testsvit för att undvika att dina kostnadsfria utvärderingsgränser överskrids.

När testet är klart kan du visa teststatusen i terminalen.

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

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

Nu har du förberett konfigurationen för publicering av testresultat och artefakter med Microsoft Playwright Testing. Kör tester med hjälp av .runsettings filen och publicera testresultat och artefakter till tjänsten.

dotnet test --settings:.runsettings

Inställningarna för testkörningen definieras i .runsettings filen. Mer information finns i använda alternativ för tjänstpaket

Kommentar

För rapporteringsfunktionen i Microsoft Playwright Testing debiteras du baserat på antalet publicerade testresultat. Om du är förstagångsanvändare eller kommer igång med en kostnadsfri utvärderingsversion kan du börja med att publicera ett enskilt testresultat i stället för din fullständiga testsvit för att undvika att dina kostnadsfria utvärderingsgränser överskrids.

När testkörningen är klar kan du visa teststatusen i terminalen.

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.

Varning

Beroende på storleken på din testsvit kan du debiteras ytterligare avgifter för testresultaten utöver dina tilldelade kostnadsfria testresultat.

Visa testkörningar och resultat i Playwright-portalen

Nu kan du felsöka misslyckade testfall i Playwright-portalen.

  1. När testkörningen är klar genereras en länk till Playwright-portalen. Öppna den här länken om du vill visa detaljerade testresultat och associerade artefakter. Portalen visar viktig information, inklusive:

    • Information om CI-kompilering
    • Övergripande testkörningsstatus
    • Inchecknings-ID:t som är länkat till testkörningen

    Skärmbild som visar en lista över tester i testkörningen.

  2. Playwright-portalen innehåller all nödvändig information för felsökning. Du kan:

    • Växla mellan återförsök.
    • Visa detaljerade felloggar, teststeg och bifogade artefakter, till exempel skärmbilder eller videor.
    • Gå direkt till Spårningsläsaren för djupare analys.

    Skärmbild som visar förhandsversionen av ett test.

  3. Med Spårningsvisaren kan du gå igenom testkörningen visuellt. Du kan:

    • Använd tidslinjen för att hovra över enskilda steg och visa sidtillståndet före och efter varje åtgärd.
    • Granska detaljerade loggar, DOM-ögonblicksbilder, nätverksaktivitet, fel och konsolutdata för varje steg.

    Skärmbild som visar spårningsvisaren.

  1. När testkörningen är klar får du en länk till Playwright-portalen i terminalen. Öppna den här länken om du vill visa detaljerade testresultat och associerade artefakter. Portalen visar viktig information, inklusive:

    • Information om CI-kompilering
    • Övergripande testkörningsstatus
    • Inchecknings-ID:t som är länkat till testkörningen

    Skärmbild som visar en lista över tester i testkörningen.

  2. Playwright-portalen innehåller all nödvändig information för felsökning. Du kan:

    • Visa detaljerade felloggar och bifogade artefakter, till exempel skärmbilder eller videor.
    • Gå direkt till Spårningsläsaren för djupare analys.

    Skärmbild som visar förhandsversionen av ett test.

Kommentar

Vissa metadata, till exempel ägare, beskrivning och kategori, visas för närvarande inte på instrumentpanelen för tjänsten. Om det finns ytterligare information som du vill se inkluderad skickar du ett GitHub-problem på vår lagringsplats.

  1. Med Spårningsvisaren kan du gå igenom testkörningen visuellt. Du kan:

    • Använd tidslinjen för att hovra över enskilda steg och visa sidtillståndet före och efter varje åtgärd.
    • Granska detaljerade loggar, DOM-ögonblicksbilder, nätverksaktivitet, fel och konsolutdata för varje steg.

    Skärmbild som visar spårningsvisaren.

Dricks

Du kan också använda Microsoft Playwright Testing-tjänsten för att köra tester parallellt med hjälp av molnbaserade webbläsare. Både reporting och molnbaserade webbläsare är oberoende funktioner och faktureras separat. Du kan använda något av dessa eller båda. Mer information finns i Använda tjänstfunktioner

Kommentar

Testresultaten och artefakterna som du publicerar behålls i tjänsten i 90 dagar. Därefter tas de bort automatiskt.

Gå vidare

Du har skapat en Microsoft Playwright Testing-arbetsyta i Playwright-portalen och kört dina Playwright-tester i molnwebbläsare.

Gå vidare till nästa snabbstart för att konfigurera kontinuerlig testning från slutpunkt till slutpunkt genom att köra dina Playwright-tester i ditt CI/CD-arbetsflöde.