Quick wins for a faster PC:
Clear out junk files and repair common Windows errorsFree Scan →Scan for outdated or missing drivers - takes under a minuteDriver Scan →Use snapshotPathTemplate in Playwright Test to control snapshot locations globally, or set expect.toHaveScreenshot.pathTemplate when only screenshot assertions should use a different layout. For one assertion, pass a filename or path segments to toHaveScreenshot(). Relative templates resolve from the Playwright configuration directory.
Choose the setting that matches your scope
| Scope | Use | What it controls |
|---|---|---|
| All snapshot assertions | snapshotPathTemplate |
toHaveScreenshot(), toMatchAriaSnapshot(), and toMatchSnapshot(). |
| Screenshot assertions only | expect.toHaveScreenshot.pathTemplate |
The path template used by toHaveScreenshot(). |
| One screenshot assertion | A filename or path segments passed to toHaveScreenshot() |
The name and relative location for that assertion, within the test file’s snapshot directory. |
snapshotPathTemplate was added in Playwright v1.28. Confirm the option against the API documentation for the version installed in your project; the official documentation evolves.
As an Amazon Associate I earn from qualifying purchases.
Set a global snapshot path template
Add snapshotPathTemplate to the Playwright Test configuration. This example groups snapshots under __screenshots__, then by test file and assertion name:
import { defineConfig } from '@playwright/test';
export default defineConfig({
testDir: './tests',
snapshotPathTemplate: '{testDir}/__screenshots__/{testFilePath}/{arg}{ext}',
});Template paths can use forward slashes on any platform. A relative template path is resolved from the configuration directory (configDir), not from the shell’s current working directory.
#1 Best Overall
Use a separate template for screenshot assertions
If other snapshot types should keep their existing locations, configure the path under expect.toHaveScreenshot instead:
import { defineConfig } from '@playwright/test';
export default defineConfig({
expect: {
toHaveScreenshot: {
pathTemplate: '{testDir}/__screenshots__{/projectName}/{testFilePath}/{arg}{ext}',
},
},
});This template adds a project-name directory when the project has a name. The optional slash syntax, {/projectName}, prevents an empty path component when the project is unnamed.
Build a template from supported tokens
Tokens let the template reflect test files, test names, projects, platforms, and assertion arguments. Use {arg} and {ext} together when you want assertion-supplied names and file extensions to determine the final filename.
What’s actually slowing this PC down?
Pick the symptom - the matching free tool is one click away.
| Token | Meaning |
|---|---|
{arg} |
Relative snapshot path without its extension, derived from the assertion argument. If no argument is given, Playwright generates a snapshot name. |
{ext} |
Snapshot extension, including the leading dot. |
{platform} |
The value of process.platform. |
{projectName} |
Filesystem-sanitized project name, or an empty value if the project is unnamed. |
{snapshotDir}, {testDir} |
The project snapshot directory and test directory. |
{testFileDir} |
Test file directory information relative to testDir. |
{testFileBaseName}, {testFileName}, {testFilePath} |
Test-file basename, filename, and path information relative to testDir. |
{testName} |
Sanitized test title, including parent describe titles but excluding the file name. |
One character immediately before a token can be made conditional on that token having a non-empty value. For example, {/projectName} avoids an unwanted directory component when the project name is empty.
Separate baselines or share them deliberately
Include {projectName} when different named projects should have separate baseline paths. If projects should share image baselines, omit that token only after considering whether their browser and platform rendering differences are acceptable. Playwright’s visual-comparison guide discusses why rendering can differ across browsers and platforms.
Name a screenshot in an individual assertion
For a one-off name, pass a filename:
await expect(page).toHaveScreenshot('landing.png');You can also pass path segments:
await expect(page).toHaveScreenshot(['relative', 'path', 'to', 'snapshot.png']);The supplied path must remain inside that test file’s snapshot directory. An attempt to go outside it throws an error. Playwright Test screenshot assertions use PNG by default; a .webp filename selects WebP, which the documentation describes as lossless.
Find the resolved path when troubleshooting
Use test.info().snapshotPath() to report the path Playwright resolves. Pass { kind: 'screenshot' } when you want the screenshot-specific template; this kind option was added in v1.53.
import { test } from '@playwright/test';
test('reports screenshot path', async ({ page }, testInfo) => {
const path = testInfo.snapshotPath('landing.png', { kind: 'screenshot' });
console.log(path);
});Check the exact method signature in the API documentation matching your installed Playwright version, especially if the kind option is not recognized.
Update and review screenshot baselines
When a screenshot change is intentional, regenerate baselines with:
npx playwright test --update-snapshotsReview the resulting image differences as test artifacts and commit the expected snapshots to version control. Do not treat a regenerated image as correct merely because the update command completed.
Troubleshoot unexpected snapshot paths
- Snapshots are still in the old location: confirm the changed setting is in the config file actually used for the run. Use
test.info().snapshotPath()to inspect the resolved path. - A relative path starts somewhere unexpected: resolve it from the configuration directory, not the current terminal directory; inspect the configured
configDir. - Other snapshots moved too:
snapshotPathTemplateapplies to screenshot, aria, and regular snapshots. Move the setting toexpect.toHaveScreenshot.pathTemplateif only screenshots should use the new template. - An assertion throws while using path segments: keep the supplied path within the test file’s snapshot directory.
- The project directory is missing or has an empty component: the project may be unnamed. Use the optional-prefix form
{/projectName}or omit the project token. - A template option is rejected: check your installed Playwright version and its matching API docs. The global template was added in v1.28, and screenshot-path
kindsupport insnapshotPath()was added in v1.53.
Or skip the browser setup
If you need a rendered website screenshot rather than Playwright-managed visual baselines, ScreenshotNeo returns an image or PDF from one GET request. It handles cookie and consent banners, newsletter popups, and chat widgets before capture; bot checks, blank pages, and failed loads are never billed. Its MCP server lets AI agents take screenshots, and the free plan includes 1,000 screenshots a month with no card; paid plans start at $5 for 3,000.
Example request (replace YOUR_API_KEY with your key):
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webpSee the ScreenshotNeo API documentation for request options, or sign up free for 1,000 screenshots a month with no card.
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.
