Accelerate Test Execution with Playwright and Docker
Executing test automation can be time-consuming, particularly when dealing with complex scenarios and a large number of tests within the suite. This challenge is amplified in today’s fast-paced software release cycles, where obtaining quick feedback is crucial. To address this, the execution time can be significantly reduced by leveraging parallel test execution using multiple workers or by scaling up resources. This approach ensures that tests run concurrently, providing faster feedback and improving overall efficiency in the development pipeline.
However, running tests on multiple workers, whether on a single or multiple resources, can lead to increased memory utilization and potentially slow down the tests. This is because each additional browser instance consumes more memory and CPU resources. Consequently, the system may experience higher resource contention, which can negatively impact test execution speed and overall performance.
In this article, I have summarized how to accelerate the execution using Playwright and Docker.
Create JavaScript project and add below code in server.js file.
const { chromium } = require('playwright');
(async () => {
const browserServer = await chromium.launchServer({
wsPath: '/sample_path',
port:9222
});
const wsEndpoint = browserServer.wsEndpoint();
console.log(`Browser server running at: ${customWSEndpoint}`);
})();This will run the remote chromium browser on server.
Create dockerfile to create new image and expose the Port.
FROM mcr.microsoft.com/playwright:focal
WORKDIR /app
COPY package*.json ./
# Install dependencies
RUN npm install
# Copy the rest of the application files
COPY . .
# Expose the desired port
EXPOSE 9222
# Command to run the server script
CMD ["node", "server.js"]Build the docker with command -
docker build -t playwright-image .Run the docker container with command -
docker run -p 0.0.0.0:9222:9222 --name playwright-server playwright-imageIt will run the docker container and listening to Port 9222
In test project, create browser instance and connect to remote browser endpoint.
const wsEndpoint = 'ws://localhost:9222/sample_path'; // WebSocket URL with the custom path
const browser = await chromium.connect({ wsEndpoint });
const page = await browser.newPage();
await page.goto('https://example.com');
console.log(await page.title());Or add the wsEndpoint in Playwright.Config.js file
use: {
/* Base URL to use in actions like `await page.goto('/')`. */
baseURL: process.env.BASE_URL,
browserName:'chromium',
connectOptions :{
wsEndpoint:"ws://localhost:9222/sample_path"
},
},Now the tests will connect to remote browser and perform actions.
This approach reduces memory consumption, allowing multiple workers to be initiated on a single resource, as the browser instances run within Docker containers. By containerizing browser instances, resources are managed more efficiently, and isolation is maintained, which optimizes the overall performance and enables more effective parallel test execution.
Summary — Deploying Docker containers on a high-end remote server facilitates the execution of more parallel tests, leveraging the server’s superior processing power and memory capacity. This setup also seamlessly integrates with CI/CD pipelines, enabling automated and continuous testing, which ensures rapid feedback and accelerates the development lifecycle.
