Rychlý start: Spuštění komplexních testů ve velkém měřítku pomocí microsoft Playwright Testing Preview

V tomto rychlém startu se dozvíte, jak spouštět testy Playwright s vysoce paralelními cloudovými prohlížeči pomocí microsoft Playwright Testing Preview. Použijte cloudovou infrastrukturu k ověření aplikace v různých prohlížečích, zařízeních a operačních systémech.

Po dokončení tohoto rychlého startu máte pracovní prostor Microsoft Playwright Testing ke spuštění testů Playwright ve velkém měřítku.

Důležité

Microsoft Playwright Testing je aktuálně ve verzi Preview. Právní podmínky, které se vztahují na funkce Azure, které jsou ve verzi beta, ve verzi Preview nebo které ještě nejsou vydány v obecné dostupnosti, najdete v dodatečných podmínkách použití pro verze Microsoft Azure Preview.

Požadavky

• Účet Azure s aktivním předplatným. Pokud ještě nemáte předplatné Azure, vytvořte si napřed bezplatný účet.
• Váš účet Azure potřebuje roli vlastníka, přispěvatele nebo některé z klasických rolí správce.
• Projekt playwright. Pokud projekt nemáte, vytvořte si ho pomocí úvodní dokumentace playwright nebo použijte ukázkový projekt Microsoft Playwright Testing.

Vytvoření pracovního prostoru

Pokud chcete začít se spouštěním testů Playwright ve velkém měřítku v cloudových prohlížečích, nejprve vytvoříte pracovní prostor Microsoft Playwright Testing na portálu Playwright.

1. Přihlaste se k portálu Playwright pomocí svého účtu Azure.

2. Pokud už pracovní prostor máte, vyberte existující pracovní prostor a přejděte k dalšímu kroku.

   Tip

   Pokud máte více pracovních prostorů, můžete přepnout do jiného pracovního prostoru tak, že v horní části stránky vyberete název pracovního prostoru a pak vyberete Spravovat všechny pracovní prostory.

3. Pokud ještě pracovní prostor nemáte, vyberte + Nový pracovní prostor a zadejte následující informace:

   Pole	Popis
   Název pracovního prostoru	Zadejte jedinečný název pro identifikaci pracovního prostoru. Název se může skládat pouze z alfanumerických znaků a má délku mezi 3 a 64 znaky.
   Předplatné Azure	Vyberte předplatné Azure, které chcete použít pro tento pracovní prostor Microsoft Playwright Testing.
   Oblast	Vyberte zeměpisné umístění pro hostování vašeho pracovního prostoru. Toto je umístění, kde jsou data testovacího spuštění uložená pro pracovní prostor.

   

4. Výběrem možnosti Vytvořit pracovní prostor vytvořte pracovní prostor ve vašem předplatném.

   Během vytváření pracovního prostoru se ve vašem předplatném Azure vytvoří nová skupina prostředků a prostředek Microsoft Playwright Testing Azure.

Po dokončení vytváření pracovního prostoru budete přesměrováni do průvodce nastavením.

Vytvoření přístupového tokenu pro ověřování služby

Microsoft Playwright Testing používá přístupové tokeny k autorizaci uživatelů ke spouštění testů Playwright ve službě. Nejprve vygenerujete přístupový token služby na portálu Playwright a pak hodnotu uložíte do proměnné prostředí.

Pokud chcete vygenerovat přístupový token, proveďte následující kroky:

1. V průvodci nastavením pracovního prostoru v části Vytvořit přístupový token vyberte Vygenerovat token.

   

2. Zkopírujte přístupový token pro pracovní prostor.

   Pro konfiguraci prostředí v pozdějším kroku potřebujete hodnotu přístupového tokenu.

   

Konfigurace koncového bodu oblasti služby

V konfiguraci služby musíte poskytnout koncový bod služby pro konkrétní oblast. Koncový bod závisí na oblasti Azure, kterou jste vybrali při vytváření pracovního prostoru.

Pokud chcete získat adresu URL koncového bodu služby, proveďte následující kroky:

1. V části Přidat koncový bod oblasti v nastavení zkopírujte koncový bod oblasti pro váš pracovní prostor.

   Adresa URL koncového bodu odpovídá oblasti Azure, kterou jste vybrali při vytváření pracovního prostoru.

   

Nastavení prostředí

Abyste mohli nastavit prostředí, musíte nakonfigurovat PLAYWRIGHT_SERVICE_ACCESS_TOKEN proměnné prostředí a PLAYWRIGHT_SERVICE_URL proměnné prostředí s hodnotami, které jste získali v předchozích krocích.

Ke správě prostředí doporučujeme použít dotenv modul. V dotenvsouboru .env definujete proměnné prostředí.

1. Přidejte modul dotenv do projektu:

   npm i --save-dev dotenv
   

2. Vytvořte .env soubor společně se souborem playwright.config.ts v projektu Playwright:

   PLAYWRIGHT_SERVICE_ACCESS_TOKEN={MY-ACCESS-TOKEN}
   PLAYWRIGHT_SERVICE_URL={MY-REGION-ENDPOINT}
   

   Nezapomeňte nahradit {MY-ACCESS-TOKEN} zástupné symboly textu {MY-REGION-ENDPOINT} hodnotami, které jste zkopírovali dříve.

Upozornění

Ujistěte se, že soubor nepřidáte do úložiště zdrojového .env kódu, abyste zabránili úniku hodnoty přístupového tokenu.

Přidání konfiguračního souboru služby

Pokud chcete spustit testy Playwright v pracovním prostoru Microsoft Playwright Testing, musíte přidat konfigurační soubor služby spolu s konfiguračním souborem Playwright. Konfigurační soubor služby odkazuje na proměnné prostředí pro získání koncového bodu pracovního prostoru a vašeho přístupového tokenu.

Přidání konfigurace služby do projektu:

1. Vytvořte spolu se souborem playwright.config.ts nový souborplaywright.service.config.ts.

   Volitelně můžete použít playwright.service.config.ts soubor v ukázkovém úložišti.

2. Přidejte do něj následující obsah:

   /*
   * 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 : [{}]
   });
   

3. Soubor uložte.

Spouštění testů ve velkém měřítku pomocí microsoft Playwright Testing

Teď jste připravili konfiguraci pro spouštění testů Playwright v cloudu pomocí microsoft Playwright Testing. Ke spuštění testů můžete použít buď rozhraní příkazového řádku Playwright, nebo můžete použít rozšíření Playwright Test Visual Studio Code.

Spuštění jednoho testu ve velkém měřítku

Microsoft Playwright Testing vám bude účtován na základě celkového počtu testovacích minut. Pokud jste uživatelem poprvé nebo začínáte s bezplatnou zkušební verzí, můžete začít s spuštěním jednoho testu ve velkém měřítku místo plné sady testů, abyste se vyhnuli vyčerpání bezplatných testovacích minut.

Po ověření úspěšného spuštění testu můžete postupně zvýšit zátěž testu spuštěním dalších testů se službou.

Provedením následujících kroků spusťte jeden test Playwright pomocí microsoft Playwright Testing:

Playwright CLI

Pokud chcete použít playwright CLI ke spuštění testů pomocí microsoft Playwright Testing, předejte konfigurační soubor služby jako parametr příkazového řádku.

1. Otevřete okno terminálu.

2. Zadáním následujícího příkazu spusťte test Playwright ve vzdálených prohlížečích v pracovním prostoru:

   {name-of-file.spec.ts} Zástupný text nahraďte názvem souboru specifikace testu.

   npx playwright test {name-of-file.spec.ts} --config=playwright.service.config.ts
   

   Po dokončení testu můžete zobrazit stav testu v terminálu.

   Running 1 test using 1 worker
       1 passed (2.2s)
   
   To open last HTML report run:
   
   npx playwright show-report
   

Visual Studio Code

Pokud chcete spustit jeden test Playwright v editoru Visual Studio Code s microsoft Playwright Testing, vyberte v zobrazení Průzkumníka testů konfigurační soubor služby. Pak vyberte a spusťte test ze seznamu testů.

1. Nainstalujte rozšíření Playwright Test Visual Studio Code.

2. Otevřete zobrazení Průzkumníka testů na panelu aktivit.

   Průzkumník testů automaticky rozpozná testy Playwright a konfiguraci služby v projektu.

   

3. Vyberte Výchozí profil a pak v konfiguračním souboru služby vyberte výchozí projekty.

   Všimněte si, že profily spuštění služby pocházejí ze playwright.service.config.ts souboru, který jste přidali dříve.

   Nastavením výchozího profilu můžete automaticky spouštět testy se službou nebo současně spouštět více projektů Playwright.

   

4. V seznamu testů vyberte tlačítko Spustit test vedle testu a spusťte ho.

   Test se spustí na projektech, které jste vybrali ve výchozím profilu. Pokud jste vybrali jeden nebo více projektů z konfigurace služby, test se spustí ve vzdálených prohlížečích ve vašem pracovním prostoru.

   

   Tip

   Při spouštění testů ve vzdálených prohlížečích můžete stále ladit svůj testovací kód pomocí tlačítka Ladit test .

5. Výsledky testu můžete zobrazit přímo v editoru Visual Studio Code.

   

Teď můžete se službou spustit více testů nebo spustit celou sadu testů ve vzdálených prohlížečích.

Upozornění

V závislosti na velikosti testovací sady se vám můžou účtovat další poplatky za testovací minuty nad rámec přidělených bezplatných testovacích minut.

Spuštění úplné testovací sady ve velkém měřítku

Teď, když jste ověřili, že můžete spustit jeden test pomocí microsoft Playwright Testing, můžete spustit úplnou sadu testů Playwright ve velkém měřítku.

Provedením následujících kroků spusťte úplnou sadu testů Playwright pomocí microsoft Playwright Testing:

Playwright CLI

Když spustíte více testů Playwright nebo úplnou sadu testů pomocí microsoft Playwright Testing, můžete volitelně zadat počet paralelních pracovních procesů jako parametr příkazového řádku.

1. Otevřete okno terminálu.

2. Zadáním následujícího příkazu spusťte sadu testů Playwright ve vzdálených prohlížečích v pracovním prostoru:

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

   V závislosti na velikosti sady testů spustí tento příkaz testy až na 20 paralelních pracovních procesů.

   Po dokončení testu můžete zobrazit stav testu v terminálu.

   Running 6 tests using 6 workers
       6 passed (18.2s)
   
   To open last HTML report run:
   
       npx playwright show-report
   

Visual Studio Code

Spuštění sady testů Playwright v editoru Visual Studio Code pomocí microsoft Playwright Testing:

1. Otevřete zobrazení Průzkumníka testů na panelu aktivit.

2. Vyberte tlačítko Spustit testy a spusťte všechny testy pomocí nástroje Microsoft Playwright Testing.

   Při spuštění všech testů se použije výchozí profil. V předchozím kroku jste nakonfigurovali výchozí profil tak, aby používal projekty z konfigurace služby.

   

   Tip

   Při spouštění testů ve vzdálených prohlížečích můžete stále ladit svůj testovací kód pomocí tlačítka Ladění testů .

3. Případně můžete ze seznamu vybrat konkrétní konfiguraci služby, která spustí testy pouze pro konkrétní konfiguraci prohlížeče.

   

4. Všechny výsledky testů můžete zobrazit na kartě Výsledky testu .

Zobrazení testovacích spuštění na portálu Playwright

Přejděte na portál Playwright a zobrazte metadata testovacího spuštění a protokol aktivit pro váš pracovní prostor.

Protokol aktivit obsahuje pro každý test následující podrobnosti: celkový čas dokončení testu, počet paralelních pracovních procesů a počet testovacích minut.

Optimalizace konfigurace paralelního pracovního procesu

Po hladkém spuštění testů se službou experimentujte s proměnlivým počtem paralelních pracovních procesů a určete optimální konfiguraci, která minimalizuje dobu dokončení testu.

Microsoft Playwright Testing umožňuje spustit až 50 paralelních pracovních procesů. Několik faktorů ovlivňuje nejlepší konfiguraci vašeho projektu, například procesor, paměť a síťové prostředky vašeho klientského počítače, kapacitu zpracování zatížení cílové aplikace a typ akcí provedených v testech.

Můžete zadat počet paralelních pracovních procesů na příkazovém řádku Rozhraní příkazového řádku Playwright nebo nakonfigurovat workers vlastnost v konfiguračním souboru služby Playwright.

Přečtěte si další informace o tom , jak určit optimální konfiguraci pro optimalizaci dokončení sady testů.

Další krok

Úspěšně jste vytvořili pracovní prostor Microsoft Playwright Testing na portálu Playwright a spustili testy Playwright v cloudových prohlížečích.

Přejděte k dalšímu rychlému startu a nastavte průběžné kompletní testování spuštěním testů Playwright v pracovním postupu CI/CD.

Nastavení průběžného kompletního testování v CI/CD