Skip to content

Latest commit

 

History

History
242 lines (180 loc) · 5.55 KB

File metadata and controls

242 lines (180 loc) · 5.55 KB

🎭 Playwright Retail Automation Framework

A production-grade UI test automation framework for the SauceDemo retail site — built with Playwright, TypeScript, Page Object Model, Allure reports, Docker, Jenkins CI/CD, and GitHub Actions.


📁 Project Structure

playwright-framework/
├── src/
│   ├── pages/               # Page Object Model
│   │   ├── BasePage.ts      # Abstract base class
│   │   ├── LoginPage.ts
│   │   ├── InventoryPage.ts
│   │   ├── CartPage.ts
│   │   └── CheckoutPage.ts
│   ├── tests/               # Test suites
│   │   ├── login.spec.ts
│   │   ├── inventory.spec.ts
│   │   └── checkout.spec.ts
│   ├── fixtures/            # Playwright custom fixtures
│   │   └── index.ts
│   ├── data/                # Test data
│   │   ├── users.ts
│   │   └── products.ts
│   └── utils/               # Utilities
│       └── helpers.ts
├── .github/workflows/
│   └── playwright.yml       # GitHub Actions CI/CD
├── Dockerfile               # Containerised test runner
├── docker-compose.yml       # Multi-service Docker setup
├── Jenkinsfile              # Jenkins declarative pipeline
├── playwright.config.ts     # Playwright configuration
├── tsconfig.json
└── package.json

🚀 Quick Start

Prerequisites

  • Node.js 20+
  • npm 10+
  • Docker (optional)
  • Java 17+ (for Allure CLI, optional)

Install & Run Locally

# Install dependencies
npm ci

# Install browsers
npx playwright install --with-deps

# Copy env
cp .env.example .env

# Run all tests
npm test

# Run smoke tests only
npm run test:smoke

# Run with headed browser
npm run test:headed

# Run interactive UI mode
npm run test:ui

🐳 Docker

Run with Docker Compose

# Build and run all tests
docker-compose up playwright-tests

# Run smoke tests only
docker-compose --profile smoke up playwright-smoke

# Serve Allure report after tests
docker-compose --profile report up allure-report

Run with Docker directly

# Build image
docker build -t playwright-retail .

# Run tests
docker run --rm \
  -v $(pwd)/allure-results:/app/allure-results \
  -v $(pwd)/test-results:/app/test-results \
  -e BASE_URL=https://www.saucedemo.com \
  playwright-retail

# Run smoke only
docker run --rm \
  -e CI=true \
  playwright-retail \
  npm run test:smoke

📊 Allure Reports

Generate & View

# Generate report
npm run allure:generate

# Open report in browser
npm run allure:open

# Serve live (auto-opens browser)
npm run allure:serve

# One command: generate + open
npm run report

Report Features

  • 📁 Suites, stories, features breakdown
  • 🔴 Severity levels: blocker, critical, normal, minor
  • 🏷️ Tags: @smoke, @regression, @e2e
  • 📸 Screenshots on failure
  • 🎬 Video capture on first retry
  • 📝 Step-by-step execution logs
  • 🌍 Environment info (URL, platform, Node version)

🔁 Retry & Video Capture

Configured in playwright.config.ts:

Setting Local CI
Retries 1 2
Workers 2 4
Screenshots on-failure on-failure
Video on-first-retry on-first-retry
Trace on-first-retry on-first-retry

🏗️ Jenkins Pipeline

Setup

  1. Install Jenkins plugins: Allure, HTML Publisher, AnsiColor, Email Extension
  2. Create a new Pipeline job
  3. Point to Jenkinsfile in the repository
  4. Configure DEFAULT_RECIPIENTS for email notifications

Pipeline Stages

Checkout → Install Deps → Install Allure → Run Tests → Generate Report → Publish

Parameters

Parameter Default Options
BASE_URL saucedemo.com Any URL
TEST_SUITE all all / smoke / regression
BROWSER chromium chromium / firefox / webkit
PARALLEL true true / false
VIDEO false true / false

⚙️ GitHub Actions CI/CD

Workflows

Job Trigger Browsers
lint Every push/PR -
smoke Every push/PR Chromium, Firefox
regression main / schedule All 3
allure-report After all jobs - (aggregated)

Schedule

  • Daily regression run at 6 AM UTC
  • Allure report deployed to GitHub Pages on main

🧪 Test Suites

Login Tests (@smoke, @regression)

  • ✅ Valid credentials → success
  • ✅ Locked-out user → error
  • ✅ Invalid credentials → error
  • ✅ Empty username/password → validation errors
  • ✅ Logout flow
  • ✅ Data-driven multi-user login

Inventory Tests (@smoke, @regression)

  • ✅ Page loads with 6 products
  • ✅ Sort A-Z, Z-A, price low→high, price high→low
  • ✅ Add/remove products
  • ✅ Cart count badge updates
  • ✅ All products visible

Checkout Tests (@smoke, @regression, @e2e)

  • ✅ Complete E2E checkout (single item)
  • ✅ Complete E2E checkout (multiple items)
  • ✅ Order total calculation validation
  • ✅ Missing form field validations
  • ✅ Cart item removal
  • ✅ Continue shopping flow

🌐 Target Application

SauceDemo — A purpose-built retail testing site by Sauce Labs.

User Password Type
standard_user secret_sauce Normal
locked_out_user secret_sauce Locked
problem_user secret_sauce UI bugs
performance_glitch_user secret_sauce Slow

📬 Support

Open an issue or PR. Happy testing! 🎭