Free Trial

Instrucciones para Playwright y TypeScript

This page is not available in the language you requested. You have been redirected to the English version of the page.
Link to this page copied to clipboard

Configurando sus pruebas con Playwright y TypeScript

Free Trial
Not for use with personal data

  1. En el nivel raíz de su carpeta de pruebas, instale el paquete @axe-core/watcher y todas sus dependencias usando npm o su administrador de paquetes preferido (por ejemplo, Yarn o pnpm).

    npm install --save-dev @axe-core/watcher

  2. En su archivo o archivos de prueba, importe la función playwrightConfig(), la función wrapPlaywright() y la clase PlaywrightController de @axe-core/watcher:

    import {
  wrapPlaywrightPage,
  playwrightConfig,
  PlaywrightController
} from '@axe-core/watcher';

  3. En el código de configuración de prueba (normalmente en un bloque before o beforeAll ), envuelva cualquier código existente para crear una instancia browserContext con una llamada a playwrightConfig mientras proporciona su clave API:

    import { chromium, BrowserContext } from 'playwright';
import { playwrightConfig } from '@axe-core/watcher';

const API_KEY = process.env.API_KEY

const browserContext: BrowserContext = await chromium.launchPersistentContext(
  /**
   * We set userDataDir to an empty string which saves
   * browser data to a temporary directory
   * @see https://playwright.dev/docs/api/class-browsertype#browser-type-launch-persistent-context
   */
  '',
  playwrightConfig({
    axe: {
      apiKey: API_KEY
    },
    /**
     * We support both headless and headed mode with Chrome.
     * 
     * For headless mode:
     * - Use '--headless=chrome' for browsers v94-108.
     * - Use '--headless=new' for browsers v109+.
     * 
     * For headed mode:
     * - Remove the '--headless' flag.
     * 
     * @see https://playwright.dev/docs/chrome-extensions#headless-mode
     */
    headless: false,
    args: ['--headless=new']
  })
);

  4. Una vez que tenga una instancia de página , cree una instancia de la clase PlaywrightController y envuelva su browserContext:

    // Create a page instance, using your browser context.
let page = await browserContext.newPage();

// Initialize the PlaywrightController by passing in the Playwright page.
const controller = new PlaywrightController(page);

// Use the new wrapped Playwright page instance.
page = wrapPlaywrightPage(page, controller);

  5. Por último, asegúrese de que se hayan eliminado todos los resultados de las pruebas de Axe Watcher. Para ello, agregue el siguiente bloque de código a su código de desmontaje de prueba (normalmente en un bloque afterEach ):

    afterEach(async () => {
  await controller.flush()
})

Is this page helpful?

Help us improve this page

Still need help?