I wanted a place to capture a list of highlights that make Playwright awesome. Here it is, in no particular order:
- Uses the concept of browser contexts (equivalent to a brand new browser profile) to run tests in isolation with zero overhead (super fast!).
- VS Code extension has features to run tests with a single click, debug step by step, explore selectors, and record new tests (codegen).
- HTML report to view execution results in your browser. Includes visual diffs, and artifacts like traces, error logs, video recordings, and screenshots. The entire report is a self-contained page that can be easily hosted anywhere.
- Fastest test execution time in Checkly’s benchmarks versus Cypress, Selenium, and Puppeteer.
- Built-in toMatchScreenshot() to support visual regression testing, with recent improvements such as disabling animations and masking elements.
- Parallel test execution is supported locally, or remotely for grids such as Selenium Grid. In addition, you can shard tests between machines to run different tests in parallel e.g. using a GitHub Action CI job matrix.
- Cross-browser compatibility for Chromium, Chrome, Microsoft Edge, Firefox, WebKit.
- Built and maintained by Microsoft ♥️ Ok, I’m probably being biased here 😄
- Tracing that helps with troubleshooting test runs in a post-mortem manner. This works great to repro failed CI tests.
- Re-use signed-in state so tests can start as a logged-in user, saving time.
- Emulation for mobile devices, user agents, locales & timezones, permissions, geolocation, and dark/light mode.
- Works well with the white-box testing approach to prioritize user-facing attributes like text, instead of CSS selectors that can change frequently.
- Support for API Testing, to do things in your e2e test like set up data or assert things like response code = 200.
- Stub and mock network requests with network interception.
- Actions have auto-waiting built-in, so you don’t need to rely on hard-coded sleep commands that can cause flakiness and slow down tests. Also has custom waits such as until an element is visible, or until a pop-up is loaded.
- Support for recording user actions as Playwright test code aka Test Generator, that can be run via CLI or the record button in VS Code.
- Supports device-specific events like hovering with mouse, tapping on mobile, and keyboard shortcuts.
- Upload and download files supported out of the box.
- The magic of Locators eliminates flakiness caused by dynamic controls.
- Playwright Test uses the same Expect assertion library as Jest which will be familiar to many JS devs.
- Supports tagging of tests so you can run groups of related tests e.g. `@priority=high`, `@duration=short`.
- Provides docker images that have dependencies and browsers baked in. This makes CI configuration simple and fast.
Did I miss anything? Post your thoughts in the comments…
EDIT: I wanted to add a comment from a former colleague (Adam Bjerstedt), with his list of Playwright favorites, in comparison to Selenium:
1.) Playwright treats locators as a first-class citizen and eliminates stale elements. Selenium finds the pointer to the DOM element and then passes that around; whereas Playwright passes the locator to the action/assertion.
2.) Playwright has baked in implicit waits without the problems that Selenium has for negative tests.
3.) Playwright allows super powerful frame handling.
4.) Playwright has built-in mocking which allows you to write minified e2e tests at the component level (you don’t even need to use the component testing aspect).
5.) Playwright is so fast that we have to manually handle race conditions at times.
6.) Playwright supports powerful pseudo-CSS selectors that replace the only use cases for xpath (searching by text and traversing up the DOM). Xpath leads to many terrible habits and should be avoided.
7.) Playwright supports automation IDs as a first-class citizen. (Granted I still use them as data attributes so that I can write compound selectors).