Playwright VsCode Extension
An indepth video guide on how you can use the Playwright VsCode (Visual studio code) extension, to organise, create, execute and debug your playwright tests
- 00:37 How to install the Playwright VS Code extension
- 01:07 Exploring testing tab after installing extension
- 02:20 Explaining how to execute tests
- 06:10 Demonstration on debugging test and addressing failures
- 09:58 How to use extension to create tests
- 12:33 How to filter and sort tests
In this video, Jared from Commit Quality showcases the Playwright VS Code extension. This extension allows users to install Playwright test, create, execute, and debug tests from within Visual Studio Code easily.
To install the extension, users need to click on the extensions pad within Visual Studio code and search for Playwright. The Playwright test for VS Code authored by Microsoft should appear, and once installed, users can go ahead and start executing and debugging tests.
The Playwright extension tab features multiple useful settings and tools. One can choose to execute tests on an individual file level or execute everything from the top-level folder. It allows users to alter tests quickly from within the interface.
Jared also offers insight into debugging using Playwright. He shows us how to change file locators on the fly to troubleshoot errors within your test sequence by running test files in debug mode and following execution steps.
He further walks through features like recording Playwright tests, where a new test file is created, and all activities on an opened web page are recorded. This feature is beneficial while finding specific elements or understanding how to perform certain actions, like double click etc. However, it is not recommended to rely solely on these auto code-generated tools to assemble your test pack.
Jared also runs us through how to filter and sort tests by name or duration, change layouts, hide and unhide tests, clear all results, and view test outputs. These features aid in maintaining a simplified view of the tests and debugging.
The last part of the video is devoted to discussing test and debugging options to ensure code quality and effectiveness, showing the potential influence of the Playwright extension in VS Code on developers' everyday life. The extension is very flexible and is an excellent tool for both novice and experienced developers who want to save time and enhance their debugging processes.
Overall, the video is a practical guide aiding users to harness the full potential of the Playwright extension in Visual Studio Code.
Rayrun is a community for QA engineers. I am constantly looking for new ways to add value to people learning Playwright and other browser automation frameworks. If you have feedback, email luc@ray.run.