← Back to Tutorials

15. Configurations

Project Configs

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

export default defineConfig({
  testDir: './tests',
  fullyParallel: true,
  forbidOnly: !!process.env.CI,
  retries: process.env.CI ? 2 : 0,
  workers: process.env.CI ? 1 : undefined,
  reporter: 'html',
  use: {
    baseURL: 'https://www.saucedemo.com',
    trace: 'on-first-retry',
    screenshot: 'only-on-failure',
    video: 'retain-on-failure',
  },
  projects: [
    {
      name: 'chromium',
      use: { ...devices['Desktop Chrome'] },
    },
    {
      name: 'firefox',
      use: { ...devices['Desktop Firefox'] },
    },
    {
      name: 'webkit',
      use: { ...devices['Desktop Safari'] },
    },
    {
      name: 'Mobile Chrome',
      use: { ...devices['Pixel 5'] },
    },
    {
      name: 'Mobile Safari',
      use: { ...devices['iPhone 13'] },
    },
  ],
});

Viewport & Device Emulation

// Custom viewport
use: {
  viewport: { width: 1440, height: 900 },
}

// Device emulation
use: { ...devices['iPad Pro 11'] }
use: { ...devices['Galaxy S9+'] }

SSL & Browser Options

use: {
  ignoreHTTPSErrors: true,       // handle self-signed certs
  bypassCSP: true,               // bypass Content Security Policy
  launchOptions: {
    args: ['--disable-web-security'],  // Chromium args
    slowMo: 100,                       // slow down for demo
  },
}

Screenshots & Video

use: {
  screenshot: 'only-on-failure',  // 'off', 'on', 'only-on-failure'
  video: 'retain-on-failure',     // 'off', 'on', 'retain-on-failure', 'on-first-retry'
  trace: 'on-first-retry',        // 'off', 'on', 'retain-on-failure', 'on-first-retry'
}
✏️ Exercise: Create a config with 3 browser projects and mobile emulation. Set screenshots and video to capture on failure only. Run a test that fails intentionally and inspect the artifacts.