Instruções para Puppeteer e TypeScript
Configurando seus testes com Puppeteer e TypeScript
-
No nível raiz da sua pasta de testes, instale o pacote
@axe-core/watchere todas as suas dependências usando onpmou seu gerenciador de pacotes preferido (por exemplo,yarnoupnpm).npm install --save-dev @axe-core/watcher -
No seu arquivo ou arquivos de teste, importe a função
puppeteerConfig(), a funçãowrapPuppeteer()e a classePuppeteerControllerde@axe-core/watcher/puppeteer:import { puppeteerConfig, wrapPuppeteerPage, PuppeteerController } from '@axe-core/watcher/puppeteer' -
Atualize seu código de configuração de testes (normalmente em um bloco
beforeoubeforeAll) envolvendo qualquer código existente para criar uma instância debrowsercom uma chamada parapuppeteerConfig(), enquanto obtém sua chave de API do ambiente (comoACCESSIBILITY_API_KEY):// Original code: browser = await puppeteer.launch({ // Your existing launch options... }) // Becomes: const ACCESSIBILITY_API_KEY = process.env.ACCESSIBILITY_API_KEY const PROJECT_ID = process.env.PROJECT_ID const SERVER_URL = process.env.SERVER_URL const browser = await puppeteer.launch( puppeteerConfig({ axe: { apiKey: ACCESSIBILITY_API_KEY, projectId: PROJECT_ID, serverURL: SERVER_URL }, headless: false }) );Certifique-se de configurar
ACCESSIBILITY_API_KEYePROJECT_IDno seu ambiente com sua chave de API pessoal (encontrada na sua Conta Axe, aba **API KEYS**) e o ID do seu projeto (mostrado no topo destas instruções quando você criou seu projeto ou disponível na página de Projetos escolhendo **Configurar projeto** em **Configurações**). Se sua organização usar uma instância regional, nuvem privada ou local do Axe Developer Hub, também configureSERVER_URLcom a URL base dessa instância (por exemplo,https://axe-eu.deque.com); caso contrário, omitaSERVER_URLe o padrãohttps://axe.deque.comserá utilizado. -
Crie uma instância de
PuppeteerControllere envolva seubrowserContextdo Puppeteer:// Create a page instance, using your browser instance. let page = await browser.newPage() // Initialize the PuppeteerController by passing in the Puppeteer page. const controller = new PuppeteerController(page) // Use the new wrapped Puppeteer page instance. page = wrapPuppeteerPage(page, controller) -
Por fim, garanta que todos os resultados de teste do Axe Watcher sejam descartados. Para fazer isso, adicione o seguinte bloco de código ao seu código de desmontagem de teste (geralmente em um bloco
afterEach):afterEach(async () => { await controller.flush() });
