Playwright Configuration Setup

When Playwright is installed, a file named playwright.config.js is created automatically. This is the central configuration file for Playwright. This file controls test behavior, base URL, browser settings, screenshots, video recordings, retries, timeouts, parallel execution, and more. Instead of configuring these options inside every test, the config file helps to define them once and use if for all the test. Let’s go through the configuration that is created by default during Playwright installation.

Default playwright.config.js, you can find this file in the root of the folder where playwright is installed. 

Example plawright.config.js

// @ts-check
import { defineConfig, devices } from '@playwright/test';
/**
 * @see https://playwright.dev/docs/test-configuration
 */
export default defineConfig({
  testDir: './tests',

  /* Run tests in files in parallel */
  fullyParallel: true,
  /* Fail the build on CI if you accidentally left test.only in the source code. */
  forbidOnly: !!process.env.CI,
  /* Retry on CI only */
  retries: process.env.CI ? 2 : 0,
  /* Opt out of parallel tests on CI. */
  workers: process.env.CI ? 1 : undefined,
  /* Reporter to use. See https://playwright.dev/docs/test-reporters */
  reporter: 'html',
  /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
  use: {
    /* Base URL to use in actions like `await page.goto('')`. */
    baseURL: 'https://www.qafeast.com',
    /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
    trace: 'on-first-retry',
  },
  /* Configure projects for major browsers */
  projects: [
    {
      name: 'chromium',
      use: { ...devices['Desktop Chrome'] },
    },
    {
      name: 'firefox',
      use: { ...devices['Desktop Firefox'] },
    },
    {
      name: 'webkit',
      use: { ...devices['Desktop Safari'] },
    },
  ],
});


Lets breakdown the configuration file and see it uses. 

1. Import Statements

import { defineConfig, devices } from '@playwright/test';


     - defineConfig: Helps with auto-completion and validation
     - devices: Provides predefined browser and device configurations

2. Test Directory

testDir: './tests',


All Playwright test files should be placed inside this folder. Playwright automatically scans this directory to find tests.

3. Fully Parallel Execution

fullyParallel: true,


     - Allows tests within the same file to run in parallel
     - Improves execution speed
     - Safe because Playwright isolates each test using browser contexts

4. Workers (Parallel Threads)

workers: process.env.CI ? 1 : undefined,


     - CI environment: Tests run serially (1 worker)
     - Local environment: Playwright uses available CPU cores

Example:

workers: 2


This means:

     - Playwright can execute tests using 2 parallel workers
     - Multiple tests may run at the same time
     - Execution becomes faster for large test suites

5. Prevent test.only in CI

forbidOnly: !!process.env.CI,


Fails the CI build if test.only is committed also prevents accidentally running only part of the test suite in CI.

6. Retries Configuration

retries: process.env.CI ? 2 : 0,


This statement retries failed tests only in CI, No retries when running tests locally

7. Retry on all places

retries: 2


This means:

     - If a test fails, it will be retried up to 2 additional times
      - If it passes in a retry, it is marked as flaky
     - If it fails in all retries, it is marked as failed

8. Reporter Configuration

reporter: 'html',


     - Generates an interactive HTML report
     - Open the report using: npx playwright show-report
     - In Playwright html, list, dot, line, json and junit report types are avilable. We can also configure multiple reports. 

9. Shared use Options

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


     - These settings apply to all tests and browsers
     - Trace is collected only when a test fails and retries
     - Trace includes screenshots, DOM snapshots, network activity, and console logs. We will cover Playwright tracing in detail in an upcoming section.

10 Base URL Configuration

use: {
  baseURL: 'https://qafeast.com',
}


baseURL allows you to write cleaner navigation code. Instead of writing full URL like await page.goto('https://qafeast.com/tools'); you can write await page.goto('/tools');

11. Browser Projects (Cross-Browser Testing)

projects: [
  {
    name: 'chromium',
    use: { ...devices['Desktop Chrome'] },
  },
  {
    name: 'firefox',
    use: { ...devices['Desktop Firefox'] },
  },
  {
    name: 'webkit',
    use: { ...devices['Desktop Safari'] },
  },
],


This configuration allows the same tests to run on: Chromium (Google Chrome and MS Edge), Firefox and WebKit (Safari engine)

This makes cross-browser testing easy without duplicating test code.

 

Related Tutorials