Fill the form, submit it, wait for the result the application actually produces, and only then call page.screenshot(). For an in-page confirmation, wait for that message; if submission navigates, wait for the expected URL with page.waitForURL(). A successful click alone does not prove the form has finished processing.
Install Playwright and prepare the browser
This example uses Playwright’s Node.js library and the Playwright Test assertion package. In a new project, install both and install the Chromium browser:
As an Amazon Associate I earn from qualifying purchases.
npm install playwright @playwright/test
npx playwright install chromiumReplace the example URL and form details below with the target page’s actual URL, labels, button name, and completion signal. The interaction is an illustrative pattern, not a tested submission against a specific website.
Submit the form and wait for its result
Use accessible, user-facing locators such as a field label and button role when the page exposes them. Playwright locator actions wait for actionability, so a fixed sleep is usually not the right way to synchronize a normal fill or click. The important additional wait is for the application’s post-submit outcome.
#1 Best Overall
In-page confirmation
If the application stays on the same document, assert that its success message appears. Web-first assertions retry until the condition is met or the assertion times out.
const { chromium } = require('playwright');
const { expect } = require('@playwright/test');
(async () => {
const browser = await chromium.launch();
const page = await browser.newPage();
try {
await page.goto('https://example.com/form');
await page.getByLabel('Email').fill('[email protected]');
await page.getByRole('button', { name: /submit/i }).click();
// Match this text to the confirmation shown by the real application.
await expect(page.getByText('Submitted')).toBeVisible();
await page.screenshot({ path: 'submitted.png' });
} finally {
await browser.close();
}
})();Here, the screenshot is taken after the confirmation becomes visible. If the actual application uses a different message or a changed element rather than text, assert that real state instead. Do not treat a click as proof that server-side processing is complete.
Navigation to a known destination
If submitting the form changes the URL, wait for the expected destination rather than relying on the deprecated, inherently racy waitForNavigation() API. Start waiting before clicking so a fast navigation cannot occur before the wait is registered:
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 →Repair Windows errors before they cause bigger problemsFix Now →const { chromium } = require('playwright');
(async () => {
const browser = await chromium.launch();
const page = await browser.newPage();
try {
await page.goto('https://example.com/form');
await page.getByLabel('Email').fill('[email protected]');
const destination = page.waitForURL('https://example.com/thank-you');
await page.getByRole('button', { name: /submit/i }).click();
await destination;
await page.screenshot({ path: 'submitted.png' });
} finally {
await browser.close();
}
})();Use the destination the application really navigates to; if it adds variable query parameters or uses a route pattern, choose a URL pattern that matches the expected result. If the form updates in place, use a state assertion instead of waiting for a URL change.
Choose the screenshot output
Save a file or keep the image in memory
await page.screenshot({ path: 'submitted.png' }) writes the screenshot to a file. If you omit path, Playwright returns an image buffer, which you can pass to another part of your Node.js program or write yourself.
const imageBuffer = await page.screenshot();Capture the viewport or the full page
By default, the screenshot covers the current viewport. To capture the full scrollable document, pass fullPage: true:
await page.screenshot({ path: 'submitted-full.png', fullPage: true });Full-page capture changes the artifact from the visible screen to the document’s full height. Choose it when the content below the fold matters; otherwise the default viewport image is usually the closer record of what was visible after submission.
Free tools Windows power users keep installed
One-click scans. No signup required.
Common problems and fixes
- The screenshot shows the form, not the result: the click may have completed before the application finished. Wait for a visible success state or the expected destination URL before capturing.
- The success-text assertion times out: confirm that the text and locator match the actual page and that the form really produces an in-place confirmation. If it navigates, wait for the destination instead.
- The URL wait never completes: verify the expected URL against the application’s real post-submit behavior. Some forms update the current page without navigation; in that case wait for the resulting page state.
- A locator cannot find a field or submit button: check the accessible label, role, and button name in the target page. Replace the example locators with locators matching its actual controls.
- The screenshot file is not where expected: check the path relative to the Node.js process’s working directory, or provide an explicit output path.
Or skip the browser setup
If you need a screenshot API rather than a browser automation script, ScreenshotNeo takes a screenshot from one GET request. For example, with cURL:
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. Its clean-shot flow accepts cookie or consent banners like a visitor and removes more than 60 known consent platforms, newsletter popups, and chat widgets before capture; those steps can be turned off. Bot checks, blank pages, timeouts, failed loads, and cache hits are not billed, and the response identifies page verdict and billing status in headers. An MCP server gives AI agents tools for screenshots, page information, and PDF capture. 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: 1,000 screenshots a month, no card required.
Frequently Asked Questions
Can I take the screenshot without saving a file?
Yes. Call page.screenshot() without a path; it returns an image buffer.
Do these 3 things before closing this tab:
1Scan for outdated or missing drivers - takes under a minute2Clear out junk files and repair common Windows errors3Fix the driver behind crashes, sound loss and screen glitchesDoes submitting the form always navigate to another page?
No. Some forms update the current page in place. Wait for the outcome that matches the target application’s behavior.
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.
