Playwright Test Runner

intermediate

E2E testing framework for web applications.

Overview

Playwright is Microsoft's modern end-to-end testing framework that enables reliable testing across Chromium, Firefox, and WebKit browsers with a single API. Developed to address the challenges of flaky tests and browser inconsistencies, Playwright provides auto-waiting, network interception, and mobile testing capabilities that make cross-browser testing both reliable and efficient. Unlike older testing frameworks, Playwright runs tests in parallel by default and provides comprehensive debugging tools including trace viewing and video recording. This Docker stack leverages the official Microsoft Playwright image to create an isolated testing environment that eliminates browser dependency issues and ensures consistent test execution across different development machines. The configuration mounts your test files and configuration directly into the container while persisting test results and reports in a dedicated volume, making it easy to integrate into CI/CD pipelines or run locally without installing browser dependencies. Development teams working on modern web applications will find this setup particularly valuable for automated testing workflows, regression testing, and continuous integration environments. The containerized approach means QA engineers and developers can run identical test suites regardless of their host operating system, while the persistent results volume ensures test reports and traces remain available for debugging failed tests or generating compliance documentation.

Key Features

Cross-browser testing support for Chromium, Firefox, and WebKit with consistent APIs
Auto-waiting for elements to be actionable, eliminating flaky tests from timing issues
Built-in parallel test execution across multiple browser contexts and workers
Network request interception and mocking capabilities for testing offline scenarios
Comprehensive debugging tools including trace viewer, video recording, and screenshot capture
Test generator (codegen) for recording user interactions and auto-generating test scripts
Mobile device emulation with touch events, geolocation, and viewport simulation
Persistent test results volume for HTML reports, traces, and artifacts retention

Common Use Cases

1Automated regression testing for web applications across multiple browsers in CI/CD pipelines
2End-to-end testing of Progressive Web Apps (PWAs) with offline functionality verification
3Cross-platform testing for SaaS applications that need to work consistently across browser engines
4Mobile-responsive testing with device emulation for e-commerce and consumer-facing applications
5API testing combined with UI validation for full-stack application testing
6Accessibility testing automation with built-in a11y tree inspection capabilities
7Performance testing with network throttling and resource monitoring during user workflows

Prerequisites

Docker Engine 20.10+ and Docker Compose V2 for container orchestration support
Minimum 4GB RAM available for parallel browser testing (8GB recommended for large test suites)
Node.js test files and playwright.config.ts configuration file in your project directory
Understanding of JavaScript/TypeScript and CSS selectors for writing effective test scripts
Basic knowledge of web application architecture and browser developer tools for debugging
Sufficient disk space (2GB+) for browser binaries and test artifact storage

For development & testing. Review security settings, change default credentials, and test thoroughly before production use. See Terms

docker-compose.yml

1services: 
2  playwright: 
3    image: mcr.microsoft.com/playwright:latest
4    container_name: playwright
5    working_dir: /app
6    volumes: 
7      - ./tests:/app/tests
8      - ./playwright.config.ts:/app/playwright.config.ts
9      - playwright_results:/app/test-results
10    command: npx playwright test
11
12volumes: 
13  playwright_results:

.env Template

.env

1# Configure in playwright.config.ts

Usage Notes

1Docs: https://playwright.dev/docs/intro
2Run: docker-compose run playwright npx playwright test
3Tests Chromium, Firefox, and WebKit browsers
4Results saved in /app/test-results (HTML reports, traces)
5Codegen: npx playwright codegen to record tests
6Parallel test execution and auto-waiting built-in

Quick Start

terminal

1# 1. Create the compose file
2cat > docker-compose.yml << 'EOF'
3services:
4  playwright:
5    image: mcr.microsoft.com/playwright:latest
6    container_name: playwright
7    working_dir: /app
8    volumes:
9      - ./tests:/app/tests
10      - ./playwright.config.ts:/app/playwright.config.ts
11      - playwright_results:/app/test-results
12    command: npx playwright test
13
14volumes:
15  playwright_results:
16EOF
17
18# 2. Create the .env file
19cat > .env << 'EOF'
20# Configure in playwright.config.ts
21EOF
22
23# 3. Start the services
24docker compose up -d
25
26# 4. View logs
27docker compose logs -f

One-Liner

Run this command to download and set up the recipe in one step:

terminal

1curl -fsSL https://docker.recipes/api/recipes/playwright/run | bash

Troubleshooting

Tests timeout waiting for elements: Increase timeout values in playwright.config.ts or use more specific selectors instead of generic ones
Browser launch fails with permission errors: Ensure Docker has sufficient privileges and consider adding --cap-add=SYS_ADMIN to the container if running in restricted environments
Test results not persisting between runs: Verify the playwright_results volume is properly mounted and the container has write permissions to /app/test-results
Flaky tests in headless mode but work in headed: Add explicit waits for network requests or animations using page.waitForLoadState() or page.waitForTimeout()
Out of memory errors during parallel execution: Reduce workers count in playwright.config.ts or increase Docker container memory limits
Unable to access test reports: Check that HTML reports are generated with reporter: 'html' in config and accessible via the mounted volume path

Community Notes

Loading notes...

Download Recipe Kit

Get all files in a ready-to-deploy package

Includes docker-compose.yml, .env template, README, and license

Components

playwright

Related Recipes

Ad Space

Shortcuts: C CopyF FavoriteD Download