Playwright Intermediate Interview Practice

Prepare for your next SDET or QA interview with curated questions and answers.

Q1: How to integrate Playwright with Jenkins, GitHub Actions, or Azure DevOps?

Answer: Playwright can be integrated into CI/CD pipelines to run automated tests on every code push, pull request, or deployment.

GitHub Actions Example

YAML

name: Playwright Tests

on:
  push:
    branches: [main]

jobs:
  test:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout Code
        uses: actions/checkout@v4

      - name: Install Node.js
        uses: actions/setup-node@v4
        with:
          node-version: 20

      - name: Install Dependencies
        run: npm install

      - name: Install Playwright Browsers
        run: npx playwright install --with-deps

      - name: Run Tests
        run: npx playwright test

Jenkins Integration

Install Node.js in Jenkins machine
Configure Jenkins pipeline
Run:

BASH

npm install
npx playwright install
npx playwright test

Azure DevOps

Use YAML pipeline:

YAML

- script: npm install
- script: npx playwright install --with-deps
- script: npx playwright test

Q2: How do you structure a scalable automation framework with Playwright?

Answer: A scalable framework should be modular, reusable, and maintainable.

Recommended Structure

Framework Structure

project/
│
├── tests/
├── pages/
├── utils/
├── fixtures/
├── test-data/
├── api/
├── playwright.config.ts
└── package.json

Best Practices

Use Page Object Model (POM)
Keep reusable utilities separate
Store test data externally
Use fixtures for setup/teardown
Maintain environment configs

Example POM

TypeScript

export class LoginPage {
  constructor(private page) {}

  async login(username: string, password: string) {
    await this.page.fill('#user', username);
    await this.page.fill('#pass', password);
    await this.page.click('#login');
  }
}

Q3: How to combine UI and API testing in one suite?

Answer: Playwright supports both browser automation and API testing.

Example

TypeScript

import { test, expect, request } from '@playwright/test';

test('API + UI Validation', async ({ page }) => {

  // API Call
  const apiContext = await request.newContext();
  const response = await apiContext.get('https://reqres.in/api/users/2');

  expect(response.status()).toBe(200);

  // UI Validation
  await page.goto('https://example.com');
  await expect(page.locator('h1')).toContainText('Example');
});

Advantages

End-to-end validation
Faster setup using APIs
Backend + frontend verification

Q4: How to use environment variables for different test environments?

Answer: Environment variables help switch between QA, UAT, PROD, etc.

.env File

ENV File

BASE_URL=https://qa.example.com
USERNAME=admin
PASSWORD=admin123

Install dotenv

BASH

npm install dotenv

playwright.config.ts

TypeScript

import dotenv from 'dotenv';

dotenv.config();

export default defineConfig({
  use: {
    baseURL: process.env.BASE_URL
  }
});

Usage

TypeScript

await page.goto(process.env.BASE_URL!);

Q5: How to implement reporting in Playwright (HTML, Allure, etc.)?

Answer: Playwright supports multiple reporters.

HTML Report

TypeScript

reporter: [['html']]

Run:

BASH

npx playwright show-report

Allure Report

Install:

BASH

npm install -D allure-playwright

Config:

TypeScript

reporter: [
  ['line'],
  ['allure-playwright']
]

Generate Report:

BASH

allure generate ./allure-results --clean
allure open

Benefits

Screenshots
Videos
Failure traces
Execution analytics

Q6: Stay tuned for more questions...

Answer: