Wait, I have to test the front end too?
summary
Covers concrete setups: eslint with Airbnb base and stylelint in VS Code catch code/style errors early; pally using Puppeteer screenshots runs WCAG 2.1 checks (AA by default, AAA available), outputs JSON and screenshots and uses Promise.all to test multiple pages/viewports; visual regression with BackstopJS does pixel diffs but can yield false positives; end-to-end checks with Cypress run real UI flows and viewport tests — example failed when a missing .site-title class broke navigation and passed after fix.
AI-written summary · about
chapters (10)
- 0:00Introduction and speaker intro
- 2:31Why front-end testing matters
- 3:36Linting JavaScript with ESLint
- 7:27Linting CSS with Stylelint
- 9:36Accessibility testing with Pa11y
- 19:56Advanced Pa11y configuration
- 24:32Visual regression testing with BackstopJS
- 27:01End-to-end testing with Cypress
- 38:26Summary and additional resources
- 40:55Q&A
related talks
53mWait, I have to test the front end too?
49mWait, I have to test the front end too?
35mTesting in Frontend World
30mWait, before you write your next test...
01h 06mnpm run a11y-test
35mAutomated Accessibility Testing
26mModern Testing Practices in Frontend Applications
07mHow to Catch a11y Defects During Unit and E2E Testing