Member-only story
How to Write End-to-End Tests for Chrome, Safari & Firefox Using Playwright
Getting started with everything you need to write end-to-end (E2E) tests using Microsoft’s Playwright browser automation & test library.
Playwright is an open source tool by Microsoft for browser automation and end-to-end testing. It’s like Google’s Puppeteer, or the archived Chromeless. Playwright can drive Chromium (Chrome), WebKit (Safari) and Firefox in both headed and headless modes (with and without windows on the screen.) It supports Typescript out of the box, too!
End-to-end (E2E) tests are not-really-unit tests in which real browsers are used to interact with a website or web app to check if things are working as expected. They’re commonly used to ensure that often-used UX/UI workflows like login pages or other app interactions are working correctly, often when it becomes too cumbersome to manually test everything in a SaaS product.
This article is Part 1 in a series of articles aimed at getting you started with everything you need to write end-to-end (E2E) tests using Playwright.
Articles in this series
- How to Write End-to-End Tests for Chrome, Safari & Firefox Using Playwright
- Playwright Comes with Amazing Tools for Writing and Debugging Your End-to-End Tests
- How to Manage Authentication & State in Your End-to-End Tests with Playwright
- Hidden Goodies in Playwright That Will Super-Charge Your End-to-End Testing Experience
The examples in this article are based on E2E tests from KPI Manager, a SaaS startup I’ve co-founded. Our product, for recruitment agencies, aims to eliminate sales and productivity problems in a positive, proactive way through gamification techniques. As we moved past our MVP and further developed the product, it became increasingly difficult to manually test all the workflows. Thus, we turned to writing end-to-end tests with Playwright for some of the more obscure screens and interactions — places which were more involved to test or less immediately visible.
