Playwright Advanced 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: How to handle parallel browser execution across devices?

Answer: Playwright supports parallel execution using projects and workers.

Example

TypeScript

projects: [
  {
    name: 'Chrome',
    use: { browserName: 'chromium' }
  },
  {
    name: 'Firefox',
    use: { browserName: 'firefox' }
  },
  {
    name: 'Mobile Chrome',
    use: devices['Pixel 5']
  }
]

Run Tests

BASH

npx playwright test --workers=4

Advantages

Faster execution
Cross-browser validation
Device compatibility testing

Q7: How to configure browser launch options for performance testing?

Answer: Launch options help simulate real environments.

Example

TypeScript

use: {
  launchOptions: {
    headless: true,
    slowMo: 100,
    args: ['--disable-gpu']
  }
}

Network Throttling

TypeScript

await page.route('**/*', async route => {
  await route.continue();
});

Useful Options

Headless mode
CPU throttling
Network simulation
Disable cache

Q8: How to debug failing Playwright tests efficiently?

Answer:

1. Headed Mode

BASH

npx playwright test --headed

2. Debug Mode

BASH

npx playwright test --debug

3. Pause Execution

TypeScript

await page.pause();

4. Trace Viewer

BASH

npx playwright show-trace trace.zip

Enable Trace

TypeScript

use: {
  trace: 'on-first-retry'
}

Benefits

Step-by-step execution
DOM inspection
Network analysis
Screenshots and videos

Q9: How to capture console logs or JavaScript errors?

Answer:

Capture Console Logs

TypeScript

page.on('console', msg => {
  console.log(msg.text());
});

Capture JavaScript Errors

TypeScript

page.on('pageerror', error => {
  console.log('JS Error:', error.message);
});

Example

TypeScript

test('Capture errors', async ({ page }) => {

  page.on('console', msg => console.log(msg.text()));

  page.on('pageerror', err =>
    console.log(err.message)
  );

  await page.goto('https://example.com');
});

Q10: How to use Playwright with BDD tools like Cucumber or Behave?

Answer: BDD allows writing tests in Gherkin syntax.

Install

BASH

npm install @cucumber/cucumber

Feature File

Gherkin

Feature: Login

Scenario: Valid Login
  Given user opens login page
  When user enters credentials
  Then dashboard should appear

Step Definition

TypeScript

test('Capture errors', async ({ page }) => {

  page.on('console', msg => console.log(msg.text()));

  page.on('pageerror', err =>
    console.log(err.message)
  );

  await page.goto('https://example.com');
});

Benefits

Business-readable tests
Better collaboration
Reusable steps

Q11: How to integrate Playwright with Docker containers?

Answer: Docker ensures consistent execution across environments.

Dockerfile

dockerfile

FROM mcr.microsoft.com/playwright:v1.52.0-jammy

WORKDIR /app

COPY . .

RUN npm install

CMD ["npx", "playwright", "test"]

Build Image

BASH

docker build -t playwright-tests .

Run Container

BASH

docker run playwright-tests

Advantages

Environment consistency
Easy CI/CD integration
Scalable execution

Q12: How to use Playwright with Java, Python, or .NET bindings?

Answer: Playwright supports multiple languages.

Java Example

Java

Browser browser = playwright.chromium().launch();
Page page = browser.newPage();
page.navigate("https://example.com");

Python Example

Python

from playwright.sync_api import sync_playwright

with sync_playwright() as p:
    browser = p.chromium.launch()
    page = browser.new_page()
    page.goto("https://example.com")

.NET Example

await page.GotoAsync("https://example.com");

Benefits

Language flexibility
Team compatibility
Shared automation concepts

Q13: How to mock network responses in Playwright for offline testing?

Answer: Mocking helps test without real backend dependency.

Example

TypeScript

await page.route('**/api/users', async route => {

  await route.fulfill({
    status: 200,
    contentType: 'application/json',
    body: JSON.stringify({
      name: 'Dhiraj',
      role: 'QA'
    })
 });

});

Benefits

Faster tests
Stable automation
Offline execution
Negative scenario testing

Q14: What are some common flakiness issues in Playwright and how to prevent them?

Answer:

Common Issues

Hardcoded waits
Dynamic elements
Slow Network
Shared test data
Negative scenario testing

Here is the prevention technique for network flakiness:

Use Auto Waiting

TypeScript

await locator.click();

Avoid Static Waits

❌ Bad

TypeScript

await page.waitForTimeout(5000);

✅ Good

TypeScript

await expect(locator).toBeVisible();

Use Stable Locators

TypeScript

page.getByTestId('submit-btn');

Retry Failed Tests

TypeScript

retries: 2

Isolate Tests

Independent test data
Fresh browser context

Q15: How to ensure test scalability and maintainability in large Playwright projects?

Answer:

1. Use Page Object Model

Separates UI actions from test logic.

2. Reusable Utilities

Create helper methods for:

Login
API calls
Data generation
Database operations

3. Proper Folder Structure

Folder Structure

pages/
tests/
utils/
fixtures/
data/

4. Centralized Configurations

TypeScript

baseURL
timeouts
retries
reporters

5. Use Fixtures

TypeScript

test.beforeEach(async ({ page }) => {
  await page.goto('/');
});

6. CI/CD Integration

Run automated tests in pipelines.

7. Parallel Execution

Improves execution speed.

8. Tagging & Grouping

BASH

npx playwright test --grep @smoke

9. Logging & Reporting

HTML reports
Allure reports
Screenshots/videos

10. Code Reviews & Standards

BASH

Maintain clean, reusable, readable automation code.