Test automation with Playwright

End-to-end tests that try flows such as sign-in, payment and ordering in a real browser on every release, by themselves.

We set up Playwright end-to-end test automation that tries your web app’s critical flows in a real browser on every release, by itself.

Last updated:

Our team’s experience

These are not Pepechura client projects; our team worked inside these companies’ own teams.

Subtraid

SaaS platform for the construction industry

Our team worked, from inside Subtraid’s own development team, on AI-assisted end-to-end test automation written with Playwright and TypeScript. The tests follow a page-object structure and run in the CI pipeline.

What Playwright is for

Playwright is an open-source browser automation tool from Microsoft. A test opens a real browser, signs in like a user, fills in forms, clicks buttons and checks that the expected result appears on screen. The same test can run on Chromium, Firefox and WebKit, the engine behind Safari. Because Playwright waits on its own for an element to be visible and clickable, it removes one of the main sources of tests that “sometimes pass, sometimes fail” from the start.

Where test automation pays off

  • You release often, and trying the same flows by hand every time eats into the team’s time
  • You have flows such as sign-in, payment, applications or orders where a break loses you customers directly
  • Users who sign in with different roles, such as admin, customer or dealer, see different screens in the same app
  • You want to know before release whether a change has broken another screen

Where Playwright alone is not enough

  • Native mobile apps downloaded from the stores: Playwright drives the browser, not the app on the phone
  • A very early prototype whose interface changes completely every week; tests go stale as fast as they are written
  • Load and performance testing: simulating many simultaneous users needs other tools
  • Judgements that need a human eye, such as whether the design looks right or the flow is easy to follow

What to automate and what to test by hand

Trying to automate everything produces a test suite that costs more to maintain than it did to write. We keep automation for flows that repeat on every release and are expensive when they break. The first try of a new feature, exploratory testing that steps off the script and usability checks stay human work. In our projects a senior QA tests every release before it goes out; automation does not replace that check, it spares the QA from repeating the same steps every week.

Good to automateBetter tested by hand
FlowFlows that stay the same on every release: sign-in, sign-up, payment, ordering, form submissionFeatures that are new and not yet settled
What is checkedThat the record is created, the right role sees the right screen, the error message appearsWhether the text is clear and the layout comfortable
WhenOn every release and every merge, automaticallyOn the screens that changed, once per release
MethodA script written in advance, the same steps every timeExploratory testing that tries unexpected use

How we deal with flaky tests

When a test sometimes passes and sometimes fails, the team soon stops looking at red results and the automation loses its value. To prevent that, we write tests with these rules from the start:

  • Instead of waiting a fixed amount of time, we wait for a specific state to appear on screen
  • We find elements by accessible names or stable test IDs (data-testid) added to the front end, not by CSS classes that may change
  • Each test prepares its own data; no test depends on data left behind by an earlier one
  • For a failed test, the trace, a screenshot and the error context are kept, so the report shows why it failed
  • A test that passes only on retry is reported separately as “flaky”, and its root cause is handled as a task of its own

Our team applied these rules while working on Playwright-based test automation from inside Subtraid’s own development team: tests written in TypeScript, a structure that puts each screen into a page object, a setup that signs in once per user role and shares the session across tests, and a CI pipeline that runs a short critical set and the full suite separately. AI coding agents, given the test-architecture rules in writing, were used to help write the tests.

What we use alongside Playwright

TypeScript

We write tests in the same language as the app itself; a mistyped selector or a missing parameter is caught before the test runs.

Page objects

Each screen’s fields and buttons live in one class. When the interface changes, only that class is updated and the scenarios stay the same.

CI pipeline

Tests run in a CI pipeline such as GitHub Actions or Bitbucket Pipelines, in Playwright’s official Docker image; a critical set gives fast feedback and the full suite runs in parallel steps.

Trace Viewer

Lets you replay every step of a failed test, its network requests and the screen at that moment, so the cause is found without guesswork.

Faker

To generate fresh, realistic test data on every run, so tests do not collide with each other’s data.

AI coding agents

For repetitive work such as writing new scenarios and adding test IDs to the front end, we use agents that follow written architecture rules.

How a test automation project runs

  1. 01

    Free scoping call

    30 min

    We talk about your app, how often you release and which flows you test by hand today.

  2. 02

    Critical flows and quote

    We rank the flows that do the most damage when they break, and write down which roles and which environment (test or staging) they will run against.

  3. 03

    Weekly releases

    Every week new tests are added to the CI pipeline. You see the report too, and we choose the next week’s flows together.

  4. 04

    Review and handover

    A senior QA tests the release before it goes out. We document how to run the tests, how to read the report and the rules for adding new ones.

  5. 05

    The 30 days after launch

    30 days

    We fix the bugs that surface in this period free of charge. After that, keeping the tests up to date as the interface changes can be part of monthly maintenance.

Timelines and budget ranges are published on our web application development and pricing pages; everything on this page follows the same figures.

Questions about Playwright test automation

Can Playwright tests be added to an existing app?

Yes. Playwright does not care which technology the app is built with; it works with any web app that opens in a browser. If the front end has no stable test IDs, we add them along with the tests, which requires access to the source code.

Why Playwright rather than Selenium or Cypress?

Automatic waiting for elements, driving several browser engines through one interface, running tests in parallel and recording a trace of failed tests all come built in. That said, if your team already has a settled Cypress or Selenium suite, we would not suggest rewriting it just to switch tools.

Can you test mobile apps as well?

Playwright is for the web: it can emulate mobile browsers’ screen sizes and touch behaviour, but it cannot drive a native app downloaded from the stores. If you have a mobile app, we discuss the right approach for it separately in the scoping call.

With automation in place, do I still need QA?

Yes. Automation checks that the flows we know about have not broken; finding out whether a new feature is designed right, or what happens under unexpected use, is human work. In our projects a senior QA tests every release before it goes out.

What do I keep when the project ends?

A perpetual licence to use the software and documentation. If you want the source code transferred to you, that is possible for an extra fee, stated separately in the quote.

Related services

Web applicationCustom softwareMVP
Contact

Let’s talk about test automation

Tell us which flows you test by hand today; in a free 30-minute scoping call we work out together which of them are worth automating.