Testing modern web apps with Playwright and VS Code

Playwright is a framework for building end-to-end tests for modern web applications. It can help us create tests that are resilient and run on any browser and platform–and it now comes with a new VS Code extension! In this livestream, we'll scaffold a new project from scratch and create some tests for real web pages.


0:00 Welcome to the livestream!
3:20 What's Playwright
5:44 Creating tests in VS Code
8:55 The first test
11:18 Running the tests in VS Code
14:00 Testing in any browser
15:05 Running with the CLI and in CI/CD
17:35 Showing reports
18:15 Trace files
20:50 Automatic tests with Codegen
23:30 Playwright extension for VS Code
25:25 Q&A

[gruttewibe]

Correction on one of the comments: The recorder in Chrome Debugger Tools records Puppeteer scripts, not Playwright scripts. Due to common heritage, the Puppeteer scripts /might/ work with Playwright, but using Playwright's newer higher-level APIs is better (less code and less flaky). So it's better to use Playwright's own recorder.

[andreysmirnovusa]

Would be nice to have a video that shows how to enable the playwright extension in existing webapp SPA project. Looks like just installing the extension in VS Code is not enough

[cuongme]

That's an awesome image introducing Playwright. Can it be downloaded anywhere?

[sothrieg]

Nice vid; at 17:10 after command npx playright test -g "New Todo" i get an error "no tests found. The whole test set is running fine. What could be the problem that a specific test set won't start? Thanks and appreciate your work!

[chandramohanray]

Hey, i want a solution can some one help me with how to extract webtables and store it in excel sheet ?If someone will provide the snippet, that will be helpful,
Thanks in advance.

[User..]

6:53 by default, there is no Edge (MS) browser?

[Norfeldt]

Plz do a video on testing react native with vscode 🙏🙏🙏🙏

[rtorcato]

code -h will give you the help and tell you the diff between -a and -r

[NG-tcmh]

Nice video bro. When installing npm playwright browser in vscode, i'm getting failed error which says "failed install chromium v100 and unable to get local issuer certificate" in my company laptop. Do you have any suggestion?

[StijnHommes]

If you refer to websites as "web apps", I'm not sure you're even qualified to talk about this. You clearly don't know the difference between a website and an app.

[NomadicDmitry]

This is an awesome framework. How does it compare to TestCafe, btw? In your opinion guys?