Skip to content
BS
Compiling experience_
Bipin Singh

Command Palette

Search anything on this site

Back to projects

Playwright Automation Framework

A POM-based Playwright framework cutting regression effort by 40%.

PlaywrightTypeScriptPage Object ModelPostmanCI/CD
40%Regression Effort Cut
10+Language Variants
4Portals Covered
Playwright Automation Framework cover artwork

Problem

Manual regression testing across client platforms like TenxYou and Freshterra was slow and inconsistent, with no shared structure for writing or maintaining UI tests — coverage routinely lagged behind release cycles.

Challenge

Build a single Playwright framework flexible enough to cover very different products — an e-commerce platform with checkout and inventory sync, a multilingual marketing campaign site, and a multi-portal driver training platform — without duplicating setup logic per project.

Architecture

The framework centers on a Page Object Model: each page or component owns its own locators and actions, fixtures handle authenticated sessions and test data setup, and a thin API client layer seeds and tears down state directly through the backend wherever possible instead of the UI.

Test Spec→ Fixtures (auth, seed data)→ Page Objects→ Playwright Runner→ CI Report

Technical Decisions

Page Object Model as the core structure

Every UI surface — TenxYou's checkout, the Sprite Campaign's multilingual flows, Ultimate Drivers Canada's four portals — got its own page object, so new tests reuse existing selectors instead of duplicating them.

API-first setup, UI-only for the behavior under test

Wherever the backend exposed an endpoint, seeding test data went through the API instead of clicking through the UI, keeping tests focused on the behavior actually being verified.

One framework, multiple clients

Rather than building a bespoke suite per project, fixtures and utilities were kept generic enough to support very different domains — e-commerce, marketing, and education — under one set of conventions.

Implementation

  • Set up a TypeScript Playwright project with a Page Object Model layer and reusable fixtures for authentication and test data.
  • Built API validation helpers so tests could assert directly on backend responses, not just rendered UI state.
  • Extended coverage to TenxYou's Saleor backend, GoKwik checkout, ERP inventory sync, payment, and return/exchange flows.
  • Added cross-browser test runs and wired results into the CI pipeline for regression gating.
  • Reused the same framework for the Sprite Campaign Platform's 10+ language variants and Ultimate Drivers Canada's Admin, Instructor, Student, and Franchise portals.

Results

  • Cut manual regression effort by 40% across covered platforms.
  • Extended a single framework across e-commerce, campaign, and education-portal products without a rewrite.
  • Verified GA4 event tracking and SEO behavior on TenxYou alongside functional regression.

Lessons Learned

  • A framework built around a strict Page Object Model scales better across unrelated products than one built around a single app's quirks.
  • API-first test setup pays off fastest on platforms with slow or flaky UI flows, like multi-step checkout.

Future Improvements

  • Add visual regression checks for the multilingual Sprite Campaign flows.
  • Expand contract-style assertions on the API validation layer.