Usar storageState() para la Autenticación
Autenticación de pruebas utilizando las cookies de sesión guardadas de Playwright
Si tus pruebas requieren sesiones autenticadas, puedes usar storageState() de Playwright para cargar cookies de autenticación previamente guardadas en el contexto del navegador. Dado que Axe Watcher utiliza sus propias fixtures de Playwright, debes fusionar la fixture de autenticación con la fixture de Axe Watcher usando mergeTests.
Archivo de Fixtures
Crea un archivo fixtures.ts que lea las cookies de un archivo storageState.json guardado y las inyecte en el BrowserContext de 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 en Pruebas
En tus archivos de prueba, llama a authCookie.inject() antes de navegar a 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
})Genera storageState.json antes de ejecutar tus pruebas utilizando configuración global de Playwright. Este archivo contiene cookies de autenticación y no debe ser incluido en el control de versiones.
