All Weeks
DAY 08

Why POM & BasePage

Understand exactly what POM solves. Build the foundation everything extends.

Core Practice

  1. Create src/pages/BasePage.ts — constructor accepts Page
  2. Add to BasePage: navigate(), waitForNetworkIdle(), isElementVisible()
  3. Create src/pages/LoginPage.ts extending BasePage
  4. Implement login(user, pass) and getErrorMessage()
  5. Rewrite login tests from Week 1 using these new classes
DAY 09

Feature Page Objects

Build page objects for every module. Methods as user actions, not code.
  • Create NavigationPage.ts for sidebar/top-nav
  • Create EmployeePage.ts: methods for create, search, and delete
  • Create LeavePage.ts: apply, approve, and reject logic
  • Verify tests read like plain English business scenarios
DAY 10

Data Models & Faker

Design the data contracts. Create unique, robust test data sets.
  1. Install @faker-js/faker
  2. Refine models: Employee, LeaveRequest, Candidate
  3. Create src/data/EmployeeBuilder.ts with override methods
  4. Replace hardcoded data with builder-generated unique values
DAY 11

Custom Fixtures

Stop repeating setup code. Fixtures are the clean way to share state.
  • Define custom fixture types in src/fixtures/base.ts
  • Create authenticatedPage and page object fixtures
  • Create a testEmployee fixture (creates/deletes employee)
  • Rewrite tests to use pre-instantiated fixtures
DAY 12

Framework Architecture

Establish the structure that holds the entire framework.
  • Set up Path Aliases: @pages, @fixtures, @models
  • Establish production folder layout (api, data, utils, config)
  • Configure ESLint & Prettier for consistency
  • Write README.md & CONTRIBUTING.md
DAY 13

Multi-Project Config

One config for every environment, browser, and scenario.
  1. Define Chromium, Firefox, and WebKit projects
  2. Define a 'mobile' project using Pixel 5 emulation
  3. Configure 3 reporters simultaneously (html, json, list)
  4. Add smoke project with grep: /@smoke/
DAY 14

Session Auth State

Login once, reuse everywhere. Cut suite time by 30-50%.
  1. Create globalSetup.ts to perform login and save state
  2. Reference globalSetup in playwright.config.ts
  3. Set storageState: '.auth/admin.json' for your project
  4. Verify tests run pre-authenticated without hitting the login page
Previous Day Next Day