Testing with Playwright in an AI-Assisted Development World

on YouTube ↗17m

" summary

Demonstrates using GitHub Copilot to generate a Vue counter component and Playwright to install browsers, auto-generate a test with Codegen, run it in VS Code and debug with the trace viewer; the recorded test asserts increment, decrement and reset, runs across Chromium, WebKit and mobile Safari emulation (viewport 390×664) and initially shows “one test passed” then fails when the start value changes, which is fixed and re-runs successfully. Tests run in isolation and parallel and traces include DOM snapshots and network details for quick debugging.

AI-written summary · about

" chapters (8)

1. 0:00Introduction to Playwright
2. 0:43Key Playwright features
3. 3:18Using GitHub Copilot
4. 5:24Building with AI assistance
5. 7:30Recording automated tests
6. 10:27Cross-browser testing
7. 12:52Debugging and fixing tests
8. 15:29Final thoughts on testing

" related talks

• 28mTesting Web Applications with PlaywrightDebbie O'Brien · vuejs.de Conf 2022
• 20mComponent Testing with PlaywrightDebbie O'Brien · ViteConf 2022
• 13mComponent Testing with Playwright for VueDebbie O'Brien · Vueconf.US 2022
• 51mTesting Web Applications with PlaywrightDebbie O'Brien · NDC Oslo 2022
• 30mTesting Web Applications with PlaywrightDebbie O'Brien · Nordic.js 2022
• 16mEnd to End testing with PlaywrightDebbie O'Brien · ViteConf 2023
• 20mTesting Web Applications with PlaywrightDebbie O'Brien · TestJS Summit 2022
• 51mAdvanced Playwright Techniques for Flawless TestingDebbie O'Brien · CPH DevFest 2024