How to Screenshot a Website That Requires a CAPTCHA Before Login

To screenshot a website that requires a CAPTCHA before login, open it in a normal browser, complete the challenge using the site’s instructions, sign in normally, and capture the page that appears. A screenshot API or browser automation cannot legitimately stand in for solving another site’s anti-abuse challenge. If you need to document the CAPTCHA itself, capture it before submitting it; if you need the post-login page, capture after successful verification and sign-in.

For your own CAPTCHA integration, use the provider’s test keys or mock its verification service in a test environment. Keep test credentials out of production.

1. Choose what you need to capture

Decide whether you need the challenge, the visible screen after login, one particular region, or the whole page. A screenshot records what was rendered at capture time; it does not establish that a CAPTCHA was solved or that verification succeeded.

Goal	When to capture	Scope
Document how the CAPTCHA is displayed	Before submitting the challenge	Visible viewport, or the challenge element if your tool supports it
Document a page behind the CAPTCHA	After completing the challenge and signing in normally	Viewport, selected element, or full page
Record a long page	After it has loaded and you have access	Full page; check that lazy-loaded content has appeared
Report a broken or inaccessible challenge	While the problem is visible	Capture the widget and enough surrounding page to show context

Browser screenshot tools commonly distinguish a viewport screenshot, a screenshot of a selected element, and a full-page screenshot. Playwright documents all three. Screenshots are useful for visual layout, canvas or chart output, and bug reports, and complement rather than replace accessibility checks. Playwright screenshot documentation.

2. Take a screenshot in a regular browser

Open the page in a current browser and wait for it to finish loading.
Follow the instructions shown by the CAPTCHA provider. Some challenges require an additional step before continuing. Google’s reCAPTCHA FAQ describes its user guidance; other providers may behave differently.
After the site grants access, sign in through its normal flow.
Navigate to the page or state you want to record. Wait for visible content, images, and any loading indicators to settle.
Use the browser’s screenshot command or your operating system’s screen-capture shortcut. Select the visible screen for a quick record, or use a full-page capture facility if you need content below the fold.
Check the saved image for clipped content, dialogs, personal information, or tokens before sharing it.

To document the challenge, take the screenshot before submitting it. To document the protected page, complete the challenge and login first. That order follows what the screen shows at the time of capture; it does not imply that a challenge state is preserved after submission.

3. Capture an authorized page with Playwright

Use browser automation only where you are authorized to access the page. For a CAPTCHA-protected site you do not control, do not try to automate, evade, or defeat its challenge. Complete it manually in a normal browser, then use the browser or operating system screenshot feature. For your own application, a practical workflow is to authenticate through your approved test setup and capture the resulting page.

Install Playwright and its Chromium browser:

npm init -y
npm install --save-dev playwright
npx playwright install chromium

Save this as screenshot.mjs. Set TARGET_URL to a page your test account is authorized to access. The script opens a visible browser so you can complete your own test flow manually, then saves a full-page PNG. It does not automate CAPTCHA solving.

import { chromium } from 'playwright';

const url = process.env.TARGET_URL;
if (!url) throw new Error('Set TARGET_URL to an authorized page URL');

const browser = await chromium.launch({ headless: false });
const context = await browser.newContext({ viewport: { width: 1440, height: 900 } });
const page = await context.newPage();

try {
  await page.goto(url, { waitUntil: 'domcontentloaded', timeout: 60_000 });
  console.log('Complete your authorized test flow in the browser.');
  console.log('When the page is ready, return here and press Enter.');
  await new Promise((resolve) => process.stdin.once('data', resolve));
  await page.screenshot({ path: 'page.png', fullPage: true, animations: 'disabled' });
  console.log('Saved page.png');
} finally {
  await browser.close();
}

Run it with TARGET_URL set to your test URL, for example TARGET_URL=https://example.test/account node screenshot.mjs. On Windows PowerShell, set the variable with $env:TARGET_URL="https://example.test/account"; node screenshot.mjs.

Choose a screenshot scope

// Current visible viewport
await page.screenshot({ path: 'viewport.png' });

// One element, such as a result panel
await page.locator('#results').screenshot({ path: 'results.png' });

// Entire scrollable page
await page.screenshot({ path: 'full-page.png', fullPage: true });

Use the viewport for reproducing what a user saw without changing scroll position. Use an element screenshot when the surrounding page is irrelevant. Use full-page mode for a long document; it may produce a tall image and can interact differently with fixed-position elements. For pages that load content as you scroll, scroll through the page first and wait for lazy-loaded images before capturing.

Playwright’s page.screenshot accepts options such as path, fullPage, type (png or jpeg), quality for JPEG, omitBackground, animations, scale, and clipping. Element screenshots use a locator’s screenshot method. See the official screenshot guide for the current option set and examples. PNG is lossless and useful for UI details; JPEG can reduce file size where slight compression is acceptable.

4. Test a CAPTCHA integration you own

Do not use test credentials to access a third-party production site. For a CAPTCHA integration in your own application, separate test behavior from production behavior and make the verification outcome controllable in your test environment.

Google reCAPTCHA: Google recommends separate v3 test keys. Its documented v2 test keys always pass verification and show a warning so they are not used for production traffic. Follow Google’s current reCAPTCHA FAQ and test-key guidance.
Backend tests: Friendly Captcha recommends mocking the verification API for backend tests. Its documentation also describes controlled test-runner access for authorized end-to-end tests. See Friendly Captcha testing guidance.

Keep provider test keys and mock behavior confined to test configuration. Add a check in your deployment configuration so a test key cannot be shipped to production accidentally. A screenshot can document the test result, but it does not replace tests that verify your server accepts and rejects the expected verification responses.

5. Troubleshoot a CAPTCHA that will not load

Symptom	Likely cause	What to try
Widget is blank or keeps loading	JavaScript is disabled, the browser is outdated, or a plugin blocks required scripts	Update the browser, enable JavaScript, and temporarily disable conflicting extensions. Google lists these among its reCAPTCHA troubleshooting suggestions; other providers can differ. Google FAQ
Challenge completes but access is not granted	The site may require another step, or its integration may not be handling verification correctly	Follow any displayed instructions and retry through the site’s normal flow. If the problem persists, contact the site’s webmaster or support. Do not try to bypass the check.
Playwright times out on navigation	The page is slow, blocked, or never reaches the selected load state	Use a suitable navigation milestone such as `domcontentloaded`, increase the timeout for a slow authorized test environment, and wait explicitly for the page element you need. Do not treat a longer timeout as a CAPTCHA bypass.
Screenshot is blank or missing late-loading content	Capture happened before client-side rendering, images, or fonts finished loading	Wait for a meaningful selector and the required content. For lazy images, scroll them into view before a full-page capture.
Full-page image is unexpectedly large	The page is very long or contains oversized content	Capture the relevant element or viewport, or split the page into sections. Choose JPEG where its compression is acceptable.
Screenshot contains private data	The page includes account details, session information, or personal content	Restrict access to the file, redact sensitive regions before sharing, and review whether the capture tool uploads it.

CAPTCHAs can create accessibility barriers for people with visual, hearing, or cognitive disabilities. The W3C’s historical accessibility note describes these barriers and explicitly warns that its 2005 material may not reflect current best practices. If a challenge blocks access, use the site’s offered accessibility or support route. W3C: Introduction to CAPTCHA inaccessibility.

6. Protect screenshot privacy

Before choosing a browser extension, desktop app, or cloud screenshot service, check where the image is processed and stored, who can access a shared link, and how long data is retained. For example, Screencap’s policy says its local capture and offline OCR stay in the browser or extension, while optional upload sends image bytes to its service and makes the resulting link accessible to anyone who has it. Review the current Screencap privacy policy and the policy of any tool you use.

For sensitive pages, capture locally when possible. Avoid sharing screenshots that include login identifiers, account information, private messages, or recovery details. A screenshot of a challenge may also reveal information about the site or account, so treat it as potentially sensitive.

7. Or skip the browser setup

If you need a screenshot API for a page you are authorized to access, ScreenshotNeo takes a screenshot with one GET request. For example, this cURL command saves a WebP image:

curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webp

Python:

import 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)

Node.js:

const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://stripe.com' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);
if (!res.ok) throw new Error(`Screenshot request failed: ${res.status}`);
await import('node:fs/promises').then(({ writeFile }) => writeFile('shot.webp', Buffer.from(await res.arrayBuffer())));

See the ScreenshotNeo API documentation for request parameters and configuration. A screenshot API does not grant access to a page behind a CAPTCHA; complete the site’s challenge and sign in normally where required.

Cookie banners are accepted and removed before capture; newsletter popups and chat widgets are also removed.
Bot checks, blank pages, failed loads, timeouts, and cache hits are never billed, and response headers identify the page verdict and billing status.
An MCP server gives AI agents tools to take screenshots, get page information, and capture PDFs.
The free plan includes 1,000 screenshots a month with no card. Paid plans start at $5 for 3,000 screenshots.

Frequently asked questions

Can a screenshot prove that I passed a CAPTCHA?

No. It records visible output. It does not verify the site’s server accepted the challenge.

Should I capture before or after the CAPTCHA?

Before submitting it to document the challenge; after successful verification and sign-in to document the protected page.

Only if the service and site support an authorized access method. A screenshot API does not solve the site’s CAPTCHA or replace a legitimate login.

Is a full-page screenshot always better?

No. Use it for long-page context. A viewport or element capture is often clearer for a challenge, a bug, or a specific component.