Playwright: E2E Tests That Aren't Flaky
Playwright makes E2E tests reliable by automatically waiting for UI elements to be ready. Use it to test critical user journeys across Chrome, Firefox, and WebKit. The footgun is using brittle CSS selectors instead of user-facing locators like getByRole.
Why it exists
End-to-end tests traditionally suffer from flakiness. Tests fail not because the app is broken, but because of timing issues, like a script trying to click a button before it's visible or enabled. This erodes trust in the test suite. Playwright was built to solve this reliability problem from the ground up.
The mental model
Think of Playwright as a patient, multi-lingual robot QA tester. It drives a real browser (Chrome, Firefox, or WebKit) just like a user would, but it has superpowers. Its main power is "auto-waiting": it won't try to click a button until the button is actually visible, enabled, and not covered by something else. It doesn't rely on clumsy, arbitrary sleep commands.
How it works
Playwright launches a browser instance for each test, ensuring total isolation. You write scripts in TypeScript, Python, or Java that command the browser. For example, page.getByRole('button', { name: 'Sign in' }).click() finds a button with the text "Sign in" and clicks it. Playwright's engine automatically waits for that button to be actionable before executing the click. If an assertion fails, it automatically retries for a short period, giving the app time to update.
When to use it
Use Playwright for testing critical, multi-step user flows that are the backbone of your application. Examples include the complete user registration and login flow, the shopping cart and checkout process, or a complex data submission form. It's also excellent for verifying that your app's core functionality works consistently across different browsers from a single test suite.
When not to use it
Do not use Playwright for testing individual components in isolation or for unit-testing business logic. Those are jobs for faster, more focused tools like Jest or Vitest. Using slow E2E tests for everything is expensive and unnecessary; reserve them for integrated flows that unit tests cannot cover.
One canonical example
A test to verify a login flow. The script navigates to the login page, fills the username and password fields using user-facing locators like getByLabel, clicks the sign-in button using getByRole, and then asserts that the URL has changed to the user's dashboard. This single test confirms that the frontend form, backend authentication, and routing all work together. The Trace Viewer tool can then show a full recording of this flow, making debugging trivial.
Interview question
What is Playwright's primary mechanism for preventing flaky end-to-end tests?
- a.It isolates each test in a fresh browser instance.
- b.It automatically waits for UI elements to be actionable before interaction.Correct
- c.It enforces the use of highly specific CSS selectors.
- d.It provides built-in retry logic for all test assertions.
Why? this is the answer
Playwright's core strength against flakiness is its "auto-waiting" capability, ensuring UI elements are ready for interaction before any action is attempted. While it does retry assertions and isolate tests, auto-waiting is the primary mechanism addressing timing-related flakiness during element interaction, unlike enforcing CSS selectors which is a common pitfall.
Just read this? Test yourself on what you have been reading.
Read the original → playwright.dev
- #e2e testing
- #playwright
- #automation
- #web testing
Put your scrolling time to good use
Learn one idea, try a quiz and save useful cards for revision. Tezvyn makes it easy to learn and stay current in your tech field, a few minutes at a time.
The iPhone app is on the way
We are building it. Until it lands, nothing here is held back from you: every interview card, your saved cards, streaks and the job board all work in Safari, plus hundreds of free practice quizzes of thirty questions each. Sign in and it all carries over to the app the day it arrives.
Want it as an icon? Tap Share at the bottom of Safari, then Add to Home Screen. It opens full screen and the cards you have read stay available offline.
We are hiring for this. Every open role lists the topics its interview covers, so you can prepare for the real thing rather than guessing.
See open roles