Use storageState() para Autenticação

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

Autenticando testes usando cookies de sessão salvos do Playwright

Not for use with personal data

Se os seus testes requerem sessões autenticadas, você pode usar o storageState() do Playwright para carregar cookies de autenticação previamente salvos no contexto do navegador. Como o Axe Watcher usa suas próprias fixtures do Playwright, você deve mesclar a fixture de autenticação com a fixture do Axe Watcher usando mergeTests.

Arquivo de Fixtures

Crie um arquivo fixtures.ts que leia cookies de um arquivo storageState.json salvo e os injete no BrowserContext do Playwright:

import { readFileSync } from 'fs'
import { test as base, type BrowserContext, mergeTests } from '@playwright/test'
import { playwrightTest } from '@axe-core/watcher/playwright-test'

// Environment variables for Axe Developer Hub
const ACCESSIBILITY_API_KEY = process.env.ACCESSIBILITY_API_KEY
const PROJECT_ID = process.env.PROJECT_ID
const SERVER_URL = process.env.SERVER_URL

// Configure Axe Watcher
const { test: watcherTest, expect } = playwrightTest({
  axe: {
    apiKey: ACCESSIBILITY_API_KEY,
    projectId: PROJECT_ID,
    serverURL: SERVER_URL
  },
  headless: false
})

// Custom fixture: Cookie-based authentication
class AuthCookie {
  #context: BrowserContext

  constructor(context: BrowserContext) {
    this.#context = context
  }

  async inject() {
    await this.#context.addCookies(
      JSON.parse(readFileSync('storageState.json', 'utf-8')).cookies
    )
  }
}

// Define auth cookie fixture
const authCookieFixture = base.extend<{ authCookie: AuthCookie }>({
  authCookie: async ({ context }, use) => {
    const auth = new AuthCookie(context)
    await use(auth)
  }
})

// Merge fixtures
const test = mergeTests(authCookieFixture, watcherTest)

// Export merged test and expect
export { test, expect }

Uso em Testes

Nos seus arquivos de teste, chame authCookie.inject() antes de navegar para páginas autenticadas:

import { test, expect } from './fixtures'

test('should display accessible authenticated page', async ({ page, authCookie }) => {
  await authCookie.inject()
  await page.goto('https://example.com/authenticated-page')

  // Accessibility testing happens automatically
})
note

Gere storageState.json antes de executar seus testes usando o configuração global do Playwright. Este arquivo contém cookies de autenticação e não deve ser adicionado ao controle de versão.

Veja Também