Some links on this page are affiliate links: if you buy through them we may earn a commission, at no extra cost to you.
Use one Playwright suite with five projects: bundled Chromium, Firefox and WebKit, plus the branded Chrome and Edge channels. Run the projects locally with npx playwright test, then send the same project matrix to a hosted provider such as Sauce Labs or BrowserStack. This gives you five browser configurations, not five independent rendering engines: Chrome and Edge are Chromium channels.
What “five browser engines” means in Playwright
Playwright has three independent bundled engines: Chromium, Firefox and WebKit. Google Chrome and Microsoft Edge are branded Chromium channels selected with the channel option. A five-way matrix therefore tests five targets, while only three represent separate engine codebases.
| Project target | Playwright setting | What it represents |
|---|---|---|
| Chromium | Default bundled browser | Playwright’s bundled Chromium build |
| Firefox | Default bundled browser | Playwright’s patched Firefox build, not branded Firefox |
| WebKit | Default bundled browser | Playwright’s WebKit build, used as a Safari compatibility proxy |
| Chrome | channel: 'chrome' |
Installed branded Google Chrome channel |
| Edge | channel: 'msedge' |
Installed branded Microsoft Edge channel |
The project model keeps test code shared while allowing each target to vary its browser channel, device profile, timeout, retry policy and environment variables.
The Tool Desk
Outbyte PC Repair FREERepair Windows errors before they cause bigger problemsFix Now →Outbyte Driver Updater FREEFix the driver behind crashes, sound loss and screen glitchesFind Drivers →Build the five-project Playwright configuration
Install Playwright and its matching browsers
Pin Playwright in your project, then install the browser binaries that match that version. Updating the package without installing its matching browsers can leave the test runner and browser revisions out of sync.
#1 Best Overall
npm install -D @playwright/test
npx playwright installBranded channels depend on Chrome or Edge being available in the execution image. A cloud provider must expose those channels explicitly; installing Playwright’s bundled browsers alone does not install branded Chrome or Edge.
Define projects for all five targets
import { defineConfig, devices } from '@playwright/test';
export default defineConfig({
testDir: './tests',
fullyParallel: true,
retries: process.env.CI ? 2 : 0,
reporter: [['html', { open: 'never' }]],
projects: [
{
name: 'setup',
testMatch: /.*\.setup\.ts/,
},
{
name: 'chromium',
use: { ...devices['Desktop Chrome'] },
dependencies: ['setup'],
},
{
name: 'firefox',
use: { ...devices['Desktop Firefox'] },
dependencies: ['setup'],
},
{
name: 'webkit',
use: { ...devices['Desktop Safari'] },
dependencies: ['setup'],
},
{
name: 'chrome',
use: { ...devices['Desktop Chrome'], channel: 'chrome' },
dependencies: ['setup'],
},
{
name: 'edge',
use: { ...devices['Desktop Chrome'], channel: 'msedge' },
dependencies: ['setup'],
},
],
});The device presets set a consistent desktop viewport and related defaults. You can replace them with your own viewport, device descriptor, locale, timezone or user-agent settings. Keep the project names stable so CI reports and artifact paths remain easy to compare.
Run the complete matrix or one target
# Run every project, including setup first
npx playwright test
# Focused reruns
npx playwright test --project=webkit
npx playwright test --project=edgePlaywright runs projects that do not depend on one another in parallel when workers are available. The setup project runs first because the other projects declare it as a dependency. This is useful for authentication or other one-time preparation: the setup test can create a storage-state file, and dependent projects can reuse it without repeating the login flow.
Do these 3 things before closing this tab:
1Clear out junk files and repair common Windows errors2Fix the driver behind crashes, sound loss and screen glitches3Repair Windows errors before they cause bigger problemsShare authentication and environment safely
A setup project is a cleaner alternative to logging in independently in all five projects. Store credentials in CI secrets, not in the repository, and write the resulting storage state to a CI workspace that is not published as an artifact. Each browser project can then use the same state or a project-specific state when the application behaves differently by browser.
- Use environment variables for base URLs, credentials and feature flags.
- Give each project a clear artifact prefix, such as
artifacts/chromium/orartifacts/edge/. - Keep retries and timeouts deliberate; retries improve signal for transient cloud failures but increase execution time and provider usage.
- Use traces, screenshots, video and network logs on failure rather than collecting large artifacts for every passing test.
Move the matrix to a cloud browser provider
There are two common meanings of “Playwright in the cloud.” A CI runner can execute Playwright with browsers installed in the runner image, or a hosted browser service can execute the sessions remotely. The configuration above works as the source of truth in either model; the provider-specific layer supplies the operating system, browser build, credentials and parallel workers.
Sauce Labs
Sauce Labs documents remote Playwright execution through its saucectl CLI. Its documented Chromium, Firefox and WebKit builds are tied to the Playwright release, which helps keep the cloud browser image aligned with the framework version. Map your projects to the provider’s browser capabilities and retain the Playwright version in the provider configuration so upgrades are intentional.
BrowserStack
BrowserStack documents Playwright combinations for operating systems and browsers, including playwright-chromium, playwright-firefox, playwright-webkit, and branded chrome and edge capabilities. Its capability model lets you select browser versions and run combinations in parallel. Treat the provider capability name as a mapping to your local project name; do not assume that a capability called WebKit is branded Safari.
Choose a provider by test risk, not by browser count
| Decision axis | Questions to answer |
|---|---|
| Browser fidelity | Does the service provide the Chromium, Chrome, Edge, Firefox and WebKit targets your application needs, and can it supply the required versions? |
| Operating systems and devices | Do you need desktop OS combinations, real mobile devices or media behavior that a desktop emulator cannot reproduce? |
| Throughput | How many parallel workers are available, what queue time is typical for your plan, and how does that affect CI completion? |
| Debugging | Can you retrieve video, traces, screenshots, console output, network records and test logs for failed sessions? |
| Version control | Can you pin browser and Playwright versions, and how quickly does the service publish new revisions? |
| Security | Can the runner reach private environments through the required network controls, and are secrets isolated from artifacts? |
| Total cost | How do parallel workers, session duration, retries and retained artifacts affect the provider’s bill? |
Provider-specific worker limits, queue times and prices vary by account and are not established here, so measure your own suite’s critical path before choosing a plan.
Understand the browser-fidelity limits
WebKit is not branded Safari
Playwright’s WebKit build comes from recent WebKit main-branch sources. Branded Safari is unsupported by Playwright. Use WebKit to catch many engine-level compatibility issues, but use a macOS WebKit environment when Safari-like behavior or media-codec fidelity is especially important, and document that it remains a proxy rather than Safari itself.
Firefox is a patched Playwright build
The Playwright Firefox target is patched for automation. It is valuable for cross-engine coverage, but it is not identical to a retail Firefox installation. If your release criteria require branded-browser behavior, add an environment that supplies that branded browser and label the result separately.
Keep versions current
Update Playwright and install its matching browsers together. Record the Playwright version, browser revision, operating system and provider image in CI logs. When a failure appears after an upgrade, rerun the same project on the previous pinned version before changing application code; this separates a browser revision change from a product regression.
What’s actually slowing this PC down?
Pick the symptom - the matching free tool is one click away.
Parallelism, reliability and cost controls
Parallelize independent projects
Five projects multiply the potential worker demand. Let the setup dependency run once, then allow the browser projects to execute concurrently when your provider has capacity. If a service queues sessions, a smaller number of workers can finish sooner than launching more sessions than the account can run.
Control flakiness deliberately
- Wait for application state, not arbitrary sleeps, except when reproducing a timing-sensitive defect.
- Capture a trace on the first retry or on failure so transient network issues remain diagnosable.
- Use deterministic test data and isolate tests that mutate shared accounts.
- Keep cloud retries low enough that a genuinely broken browser project cannot hide in noise.
Account for usage
Cloud usage generally grows with project count, parallel sessions, retries and test duration. A five-target run that takes one long session per project has a different cost profile from a heavily sharded suite that launches many short sessions. Compare the provider’s session accounting with your CI schedule, and retain only the artifacts needed for diagnosis.
Troubleshooting the five-target matrix
“Executable doesn’t exist” or browser launch failure
Cause: the matching Playwright browser bundle is missing from the runner image. Fix: run npx playwright install during image creation or CI setup, using the same Playwright version as the project.
Chrome or Edge channel cannot be launched
Cause: the branded browser is not installed or the cloud capability does not expose it. Fix: install the required channel in a self-managed image, or select the provider capability for branded Chrome or Edge rather than the bundled Chromium project.
Safari-only behavior fails in WebKit
Cause: WebKit is a compatibility proxy and branded Safari is unsupported. Fix: reproduce the issue on the closest macOS WebKit environment available and perform final Safari validation in an environment that actually runs Safari.
Authentication runs five times
Cause: projects do not depend on a shared setup project or each test performs its own login. Fix: add the setup project and dependencies: ['setup'], then consume its storage state.
Cloud results have the wrong browser version
Cause: a provider default changed or the capability did not pin a version. Fix: specify the browser version where the provider permits it, record the resolved version, and upgrade it as a planned change.
Runs are slow despite parallel workers
Cause: provider queueing, worker limits, setup serialization or excessive retries. Fix: inspect queue and session timings, keep setup work minimal, reduce redundant retries, and adjust the worker count to the capacity you actually have.
Or skip the browser setup
If you need rendered page images rather than interactive Playwright assertions, ScreenshotNeo provides a website screenshot API and MCP server. It is complementary to Playwright: use Playwright for functional and interaction tests, and ScreenshotNeo for repeatable page or PDF captures.
One GET request returns PNG, JPEG, WebP or PDF. The service accepts the consent banner like a visitor, then removes more than 60 known consent platforms, newsletter popups and chat widgets before capture; each cleanup step can be disabled. Bot checks and CAPTCHAs, blank pages, timeouts, failed loads and cache hits cost nothing, and response headers identify the result with X-Page-Verdict and X-Billed.
See the ScreenshotNeo documentation for all options, including full-page lazy-image loading, CSS-selector element capture, dark mode, 12 device presets, arbitrary viewports, retina scale, PDF paper sizes and page ranges, custom CSS and JavaScript, clicks, selector or network-idle waits, ad and tracker blocking, custom headers and cookies, timezone and geolocation, transparent backgrounds, resizing, TTL-based caching, signed image links, asynchronous jobs with signed webhooks, 100-URL bulk capture, a usage API and an OpenAPI specification. Existing parameter names used by other screenshot APIs also work.
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webpimport requests
r = requests.get("https://api.screenshotneo.com/v1/shot", params={"access_key": "YOUR_API_KEY", "url": "https://stripe.com"}, timeout=90)
open("shot.webp", "wb").write(r.content)const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://stripe.com' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);ScreenshotNeo includes an MCP server with take_screenshot, get_page_info and capture_pdf tools for Claude, Cursor and other MCP clients. The Free plan includes 1,000 shots per month with no card; paid plans start at $5 for 3,000 shots. Other listed plans are Starter $5/3,000, Growth $15/15,000, Pro $39/60,000, Scale $99/250,000 and Business $249/1,000,000; yearly billing gives two months free, and every feature is available on every plan. Sign up for the free ScreenshotNeo plan.
Recommended Free Tools
FAQ
Should the project name match the cloud provider’s browser name?
No. Keep stable internal names such as webkit and edge, then map them to the provider’s capability syntax. Stable names make local reruns and historical CI comparisons easier.
What is the safest way to publish failure artifacts?
Publish traces, screenshots and logs under a project-specific path, exclude storage-state files and credentials, and apply your CI system’s retention policy. Authentication state should be treated as a secret even when the test itself is non-production.
Frequently Asked Questions
Should the project name match the cloud provider’s browser name?
No. Keep stable internal names such as webkit and edge, then map them to the provider’s capability syntax. Stable names make local reruns and historical CI comparisons easier.
What is the safest way to publish failure artifacts?
Publish traces, screenshots and logs under a project-specific path, exclude storage-state files and credentials, and apply your CI system’s retention policy. Authentication state should be treated as a secret even when the test itself is non-production.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
