DriversRecommendedOutdated drivers can make a good PC feel brokenScan driver issues before chasing fixes manually.Scan NowOctober DealsAmazon USOctober deal check: compare before you payAmazon US: current deals, useful picks and tech finds.Check DealsWindows FixRecommendedWindows errors stealing your time? Find the fix fastScan stability, cleanup and performance issues.Fix Now×
Skip to content
World desk5 min

How to Capture Screenshots of Authenticated Pages with Playwright

Authenticate once, save Playwright’s context state, restore it for the protected route, verify the signed-in view, and capture the page safely.
Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Authenticate in a Playwright setup step, wait until the signed-in state is observable, save the browser context’s storage state, then load that state in the context that visits the protected page and call page.screenshot(). The destination page still needs an app-specific check to confirm it rendered as signed in; restoring a file alone does not guarantee an active session.

Capture a protected page by reusing saved authentication state

Playwright separates the browser session from an individual page: a Page belongs to a BrowserContext. Save and restore authentication at the context level, then capture the page inside that context. The steps below follow Playwright’s documented authentication pattern; adapt the login URL, selectors, and success signal to your application. See the Playwright authentication guide and the Page API.

As an Amazon Associate I earn from qualifying purchases.

  1. Log in in a setup step. Navigate to the application’s login page, fill in credentials, and submit the form. Login details and selectors are application-specific; do not assume a sample selector will work on your site.
  2. Wait for proof of successful login. Wait for the final URL after redirects or for a visible signed-in element. Cookies may be set over multiple redirects, so do not save state immediately after clicking submit.
  3. Save state from the page’s context. Once the success signal appears, run await page.context().storageState({ path: 'playwright/.auth/user.json' });.
  4. Restore the state for the screenshot run. Configure the consuming project or test with that file using storageState, then navigate to the protected route.
  5. Verify the destination and capture it. Check for a destination-specific signed-in signal, then call await page.screenshot({ path: 'authenticated-account.png' });.

A minimal test-side shape, once login and project configuration are in place, looks like this:

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.
// Setup step, after application-specific login and a verified signed-in signal:
await page.context().storageState({ path: 'playwright/.auth/user.json' });

// In a consuming test configured with that storageState:
await page.goto('/account');
// Assert an app-specific signed-in element or other success signal here.
await page.screenshot({ path: 'authenticated-account.png' });

This is an adaptation of Playwright’s documented pattern, not a tested example for a particular application. The URL, login interaction, and signed-in checks must match your app. The authentication guide recommends keeping the state directory in .gitignore.

#1 Best Overall

Choose a setup strategy for parallel tests

Whether to share an account or use separate accounts depends on server-side effects and how tests run, not on screenshot capture itself.

Situation Approach Reason
Tests can safely run at the same time and do not conflict through server-side changes Authenticate once in a setup project and reuse the saved state This is the shared-account pattern recommended by Playwright’s authentication guide.
Parallel tests modify shared server-side data Use separate accounts and saved state per parallel worker Distinct accounts help prevent concurrent tests from interfering with one another.
Authentication is browser-specific Do not assume one shared state file will work across browsers Playwright lists browser-specific authentication as a case where the shared-account method should not be used.

In Playwright UI mode, the setup project does not run by default. Run the authentication setup manually when the saved state expires. If state should not survive test runs, the authentication guide suggests storing it in the test project’s output directory, which is automatically cleaned before a run.

Know what storageState saves—and what it does not

Playwright’s current BrowserContext API describes storage state as including cookies, a local-storage snapshot, IndexedDB, and virtual WebAuthn credentials. Some applications store authentication material outside the defaults you rely on, so check the API options against the Playwright version installed in your project.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.
Rank #2
Dell Latitude 5420 14" FHD Business Laptop Computer, Intel Quad-Core i5-1145G7, 16GB DDR4 RAM, 256GB SSD, Camera, HDMI, Windows 11 Pro (Renewed)
  • 256 GB SSD of storage.
  • Multitasking is easy with 16GB of RAM
  • Equipped with a blazing fast Core i5 2.00 GHz processor.
  • IndexedDB: If your application stores auth tokens there, use the documented indexedDB option when saving state.
  • Virtual WebAuthn credentials: The API documents a credentials option for virtual WebAuthn passkeys.
  • Origin-private file system: The API documents an opfs option. OPFS is not supported in ephemeral WebKit contexts.
  • Session storage: Playwright’s authentication guide says sessionStorage is not persisted across page loads and is not built into storageState. If your app depends on it, read the relevant domain-specific values, save them separately, and seed them with an initialization script before application scripts run.

Do not add custom storage handling pre-emptively. First establish which storage mechanism your application actually uses for sign-in.

Protect and refresh authentication files

Playwright warns: “The browser state file may contain sensitive cookies and headers that could be used to impersonate you or your test account.” Treat the file as a credential: exclude it from version control, limit access where appropriate, and delete or regenerate it when it expires. A screenshot from a signed-in route can also show private account information, so decide what may be retained or shared before saving or distributing the image.

Troubleshoot failed or misleading captures

  • The protected route redirects to login. The state may have been saved before authentication completed, may have expired, or may not include the storage mechanism the app uses. Wait for the final login URL or a signed-in UI before saving; refresh the state and verify whether IndexedDB or custom sessionStorage handling is needed.
  • The login appears successful, but state does not work in another browser. Authentication may be browser-specific. Avoid assuming a state file is portable across browser engines; use the setup appropriate to the consuming browser.
  • Parallel screenshots show inconsistent account data. Tests may be changing shared server-side state. Use distinct accounts and state per worker when concurrent tests modify shared data.
  • The setup does not run in UI mode. Playwright UI mode does not run the setup project by default. Run the authentication setup manually to create or refresh the state file.
  • The screenshot is taken before the page is ready. Navigation completion alone may not prove the app has rendered its authenticated view. Wait for an app-specific signed-in element or other observable destination signal before calling page.screenshot().
Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Support on Ko-Fi

Or skip the browser setup: use ScreenshotNeo

If you need a hosted screenshot rather than a Playwright-controlled authenticated session, ScreenshotNeo offers a one-request screenshot API and an MCP server. A basic GET request is:

Rank #3
15.6 Inch Win 11 Laptop Computer, N4020, 4GB DDR4 RAM, 128GB Storage
  • WINDOWS 11 | STABLE PERFORMANCE: Powered by Intel Celeron N4020 processor and Windows 11 system, this laptop delivers stable performance for everyday computing tasks. It supports web browsing, online learning, document editing, email communication, and basic office work with optimized power efficiency, providing a practical and reliable experience for essential daily use for daily use.
  • 15.6” FHD IPS DISPLAY: Features a 15.6-inch Full HD IPS display with narrow bezels, offering wider viewing angles and clearer image details compared to standard panels. The improved screen-to-body ratio enhances visual experience for study, reading, document work, and video playback, making it suitable for both productivity and entertainment use.
  • 4GB DDR4 + 128GB eMMC STORAGE: Equipped with 4GB DDR4 memory and 128GB eMMC storage for everyday basics such as browsing, documents, email, and online learning platforms. The built-in TF card slot supports storage expansion up to 1TB, giving you more flexibility for files, photos, videos, and daily documents. TF card not included.
  • CONNECTIVITY & PORTS: Includes 1× TF card slot, 2× USB 3.2 Gen1 ports, and 2× full-featured Type-C ports (USB 3.2 Gen1). The Type-C ports support data transfer, charging, and video output, enabling flexible connection with external devices such as monitors, storage, and peripherals for daily work and study use.
  • LIGHTWEIGHT DESIGN | ONLINE COMMUNICATION: Designed with a slim, portable profile, this laptop is easy to carry for school, commuting, and travel. A built-in 1MP front camera supports online classes, video meetings, remote communication, and everyday conferencing. The 3300mAh battery works with the low-power system design to support practical daily use, while thermal optimization helps maintain quieter operation during extended tasks.
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webp

See the ScreenshotNeo API documentation for request options. Cookie/consent banners, newsletter popups, and chat widgets are removed before the shot; 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. Sign up for ScreenshotNeo’s free plan.

What’s actually slowing this PC down?

Pick the symptom - the matching free tool is one click away.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Frequently Asked Questions

Does Playwright save sessionStorage in storageState?

No. Playwright’s authentication guide says sessionStorage is not persisted by storageState; apps that depend on it need a separate save-and-initialize approach.

Can I use one saved login state for all parallel tests?

Only when concurrent tests are safe to share an account and do not conflict through server-side changes. Playwright recommends separate accounts and state per worker when tests mutate shared data.

Quick Recap

Bestseller No. 1
HP 14' HD Laptop, Windows 11, Intel Celeron Dual-Core Processor Up to 2.60GHz, 4GB RAM, 64GB SSD, Webcam, Dale Pink (Renewed)
HP 14" HD Laptop, Windows 11, Intel Celeron Dual-Core Processor Up to 2.60GHz, 4GB RAM, 64GB SSD, Webcam, Dale Pink (Renewed)
14" diagonal, 1366x768 resolution, HD BrightView LED, Glossy NON-TOUCH Display
$245.99
Bestseller No. 2
Dell Latitude 5420 14' FHD Business Laptop Computer, Intel Quad-Core i5-1145G7, 16GB DDR4 RAM, 256GB SSD, Camera, HDMI, Windows 11 Pro (Renewed)
Dell Latitude 5420 14" FHD Business Laptop Computer, Intel Quad-Core i5-1145G7, 16GB DDR4 RAM, 256GB SSD, Camera, HDMI, Windows 11 Pro (Renewed)
256 GB SSD of storage.; Multitasking is easy with 16GB of RAM; Equipped with a blazing fast Core i5 2.00 GHz processor.
$285.00

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.

Leave a Reply

Your email address will not be published. Required fields are marked *

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

More from the Wire

  1. World desk4 min
    How to Spot an AI Voice Scam Before Sending MoneyDon’t rely on how a caller sounds. Pause, call back through a known number, and verify the emergency with another trusted person before sending money.
  2. Mountain View desk4 min
    Google’s SynthID Detector: How to Check AI-Generated Images, Video and AudioGoogle’s SynthID Detector looks for an embedded watermark in supported images, video and audio. Here is what its results do—and do not—show.
  3. Redmond desk20 min
    How to create a link to File or Folder in Windows 11Windows 11 gives you several ways to point to a file or folder without moving or duplicating it. You can create a desktop shortcut,…
Recommended PC Tool
Recommended PC Tool
PC Slower Than It Used to Be?Free scan - under a minute
Crashes, No Sound, or Screen Glitches?Free driver scan

Two free Windows tools

One Free Minute Could Fix That PC

Before you go - each of these free tools takes about a minute and tackles what quietly slows a Windows PC down.

Special offer. View Outbyte info, uninstall instructions, EULA, and Privacy Policy.