| name | testing-ui |
| description | UI testing with Playwright and Puppeteer -- browser automation, visual regression, screenshots, and accessibility audits. |
| metadata | {"thinkfleetbot":{"emoji":"🎭","requires":{"bins":["npx","node"]}}} |
UI Testing
Browser-based UI testing with Playwright, Puppeteer, Cypress, and accessibility tools.
Install Playwright
npm init playwright@latest
npx playwright install --with-deps
npx playwright install chromium
Run Playwright tests
npx playwright test
npx playwright test tests/login.spec.ts
npx playwright test --headed
npx playwright test --project=chromium
npx playwright test --project=firefox
npx playwright test --project=webkit
npx playwright test --debug
Generate tests from URL
npx playwright codegen https://example.com
npx playwright codegen --output tests/generated.spec.ts https://example.com
npx playwright codegen --viewport-size=1280,720 https://example.com
Screenshot page
npx playwright screenshot --full-page https://example.com screenshot.png
npx playwright screenshot --viewport-size=1280,720 https://example.com screenshot.png
Visual regression
npx playwright test --update-snapshots
npx playwright test tests/visual.spec.ts
npx playwright show-report
Run Cypress tests
npx cypress open
npx cypress run
npx cypress run --spec cypress/e2e/login.cy.ts
npx cypress run --browser chrome
Accessibility audit with axe-core
npm install -g @axe-core/cli
npx @axe-core/cli https://example.com
npx @axe-core/cli https://example.com --rules wcag2a,wcag2aa
npx playwright test tests/accessibility.spec.ts