Dela via


Konfigurera visuella jämförelser med Playwright Workspaces

I den här artikeln får du lära dig hur du konfigurerar dramatikerns visuella jämförelsetester korrekt när du använder Playwright Workspaces. Oväntade testfel kan inträffa eftersom Playwrights ögonblicksbilder skiljer sig mellan lokala webbläsare och fjärrwebbläsare.

Bakgrund

Playwright Test runner använder värdoperativsystemet som en del av den förväntade skärmbildssökvägen. Om du kör tester med hjälp av fjärrwebbläsare på ett annat operativsystem än värddatorn misslyckas de visuella jämförelsetesterna. Vår rekommendation är att endast köra visuella jämförelser när du använder tjänsten. Om du tar skärmbilder av tjänsten behöver du inte jämföra dem med din lokala konfiguration eftersom de inte matchar.

Konfigurera ignoreSnapshots

Du kan använda alternativetignoreSnapshots för att endast köra visuella jämförelser när du använder Playwright Workspaces.

  1. Ange ignoreSnapshots: true i originalet playwright.config.ts som inte använder tjänsten.
  2. Ange ignoreSnapshots: false i playwright.service.config.ts.

När du använder tjänsten åsidosätter playwright.config.tsdess konfiguration och kör visuella jämförelser.

Konfigurera sökvägen till ögonblicksbilden

Om du vill konfigurera sökvägar för ögonblicksbilder för ett visst projekt eller hela konfigurationen kan du ange snapshotPathTemplate ett alternativ.

// This path is exactly like the default path, but replaces OS with hardcoded value that is used on the service (linux).
config.snapshotPathTemplate = '{snapshotDir}/{testFileDir}/{testFileName}-snapshots/{arg}{-projectName}-linux{ext}'

// This is an alternative path where you keep screenshots in a separate directory, one per service OS (linux in this case).
config.snapshotPathTemplate = '{testDir}/__screenshots__/{testFilePath}/linux/{arg}{ext}';

Exempel på tjänstkonfiguration

Exempel på tjänstkonfiguration som kör visuella jämförelser och konfigurerar sökvägen för snapshotPathTemplate:

import { defineConfig } from '@playwright/test';
import { createAzurePlaywrightConfig, ServiceOS } from '@azure/playwright';
import { DefaultAzureCredential } from '@azure/identity';
import config from './playwright.config';

/* Learn more about service configuration at https://aka.ms/pww/docs/config */
export default defineConfig(
  config,
  createAzurePlaywrightConfig(config, {
    exposeNetwork: '<loopback>',
    connectTimeout: 30000,
    os: ServiceOS.LINUX,
    credential: new DefaultAzureCredential()
  }),
  {
    ignoreSnapshots: false,
    // Enable screenshot testing and configure directory with expectations. 
    snapshotPathTemplate: `{testDir}/__screenshots__/{testFilePath}/${ServiceOS.LINUX}/{arg}{ext}`,
  }
);