How to Capture Website Screenshots in India with a Local Browser Timezone
Set Playwright’s browser timezone to Asia/Kolkata for India-local page behavior, then capture the viewport, full page, or a specific element.
To capture a website as it behaves in India, set the Playwright browser context’s timezoneId to Asia/Kolkata before navigating to the page. Set locale separately if you also want language and locale-sensitive formatting to reflect India. Then capture the visible viewport, the full scrollable page, or a specific element.
These settings emulate the browser’s timezone and locale; they do not automatically change the timezone of the Node.js process running your script. Playwright’s locale and timezone guide describes these as separate emulation settings.
1. Set up a runnable Playwright script
Use a fresh browser context for the emulated settings. This complete Node.js example captures the viewport, full page, and a selected element in separate files. It uses Chromium, but Playwright’s context-based workflow also applies to its other supported browser engines.
const { chromium } = require('playwright');
(async () => {
const browser = await chromium.launch({ headless: true });
try {
const context = await browser.newContext({
locale: 'en-IN',
timezoneId: 'Asia/Kolkata',
viewport: { width: 1440, height: 900 }
});
const page = await context.newPage();
await page.goto('https://example.com', { waitUntil: 'load' });
// The visible viewport
await page.screenshot({ path: 'india-time-viewport.png' });
// The entire scrollable page
await page.screenshot({
path: 'india-time-full.png',
fullPage: true
});
// A focused component, if it exists on the page
const main = page.locator('main');
if (await main.count()) {
await main.screenshot({ path: 'india-time-main.png' });
}
await context.close();
} finally {
await browser.close();
}
})();Install Playwright and its Chromium browser if they are not already installed:
npm install playwright
npx playwright install chromiumSave the script as screenshot-india.js and run it with node screenshot-india.js. Replace the example URL and element selector with your target page and content.
2. Choose the right timezone and locale
Browser timezone: Asia/Kolkata
The timezoneId context option controls the timezone behavior exposed to the page. For India, set it to Asia/Kolkata. Apply the context setting before creating or navigating the page so page scripts run under the intended browser configuration.
Locale: en-IN
The locale option controls locale-related browser behavior, including navigator.language, the Accept-Language request header, and formatting conventions. It is independent of timezone emulation. For example, use en-IN to request English with Indian locale conventions; choose another supported locale if the page should display a different language.
Set both when the screenshot should reflect India’s timezone and locale-sensitive presentation. Set only timezoneId if the page should use India time but keep its existing locale behavior.
3. Choose viewport, full-page, or element capture
| Capture | Playwright call | Use it for |
|---|---|---|
| Viewport | page.screenshot({ path: 'shot.png' }) |
The content currently visible within the configured viewport. |
| Full page | page.screenshot({ path: 'shot.png', fullPage: true }) |
The page’s full scrollable content in one tall image. |
| Element | page.locator('main').screenshot({ path: 'shot.png' }) |
A focused component or region selected by CSS. |
Playwright documents these screenshot approaches in its screenshots guide. Use the same viewport dimensions and capture scope when comparing results. Full-page capture can produce a tall image; use viewport or locator capture when only a particular region is needed.
4. Verify that the page sees India time
When a screenshot looks unchanged, first check the timezone from inside the browser page. This evaluates the browser’s JavaScript environment, rather than the Node.js runner:
const browserTime = await page.evaluate(() => ({
timeZone: Intl.DateTimeFormat().resolvedOptions().timeZone,
language: navigator.language,
localTime: new Date().toString()
}));
console.log(browserTime);Confirm that timeZone is Asia/Kolkata. The page may still display a fixed timestamp, a server-rendered time, or a time explicitly formatted for another timezone; browser emulation cannot rewrite application logic or data supplied by the server.
5. Keep the capture repeatable
- Set the timezone and locale on the context before navigation.
- Keep the browser engine, viewport, capture scope, and relevant browser settings consistent for screenshot comparisons.
- Wait for the specific page content you need, rather than assuming navigation alone means a dynamic page is ready. For example:
await page.locator('main').waitFor(). - Use a stable URL and test data when the page’s visible dates depend on live content.
- Expect rendering differences across operating systems, browser versions, settings, hardware, power sources, and headless mode. Playwright’s visual comparisons guide describes these sources of variation.
For a page that loads its relevant content asynchronously, wait for a meaningful selector before capturing:
await page.goto('https://example.com', { waitUntil: 'load' });
await page.locator('[data-testid="report-ready"]').waitFor();
await page.screenshot({ path: 'report.png', fullPage: true });Replace the selector with one that indicates the content is ready. A fixed delay can work for a known animation, but it is less reliable than waiting for the actual element or state the screenshot requires.
6. Use Chrome DevTools for manual inspection
For one-off interactive debugging, Chrome DevTools offers timezone emulation paths. The Chrome DevTools Protocol method Emulation.setTimezoneOverride overrides the host timezone for the page. DevTools also documents location presets with timezone and locale settings in its Locations settings guide.
Playwright is usually more convenient when the capture needs to be scripted or repeated. DevTools is useful when inspecting a page interactively. These are practical differences based on their documented capabilities, not a measured performance comparison.
7. Understand browser time versus runner time
Playwright’s timezoneId applies to browser pages in the context. It does not change Node.js date calculations performed by the test runner. If the script itself computes dates that must use a particular timezone, format those dates with an explicit timezone, or configure the runner environment separately where appropriate. Playwright notes that TZ can set the test runner timezone; keep that separate from browser-context emulation.
For example, explicitly format a runner-side date for India like this:
const indiaDate = new Intl.DateTimeFormat('en-IN', {
timeZone: 'Asia/Kolkata',
dateStyle: 'medium',
timeStyle: 'long'
}).format(new Date());
console.log(indiaDate);8. Troubleshooting
| Symptom | Likely cause | Fix |
|---|---|---|
| The page still shows the machine’s timezone. | The context timezone was not set, or the page was opened outside that context. | Create the page from a context configured with timezoneId: 'Asia/Kolkata', then navigate and verify with Intl.DateTimeFormat().resolvedOptions().timeZone. |
| Dates use India time but the language or number formatting is unexpected. | Timezone and locale are separate settings. | Set locale: 'en-IN' (or the desired locale) in the same context. |
| The screenshot has no visible time change. | The page may use fixed text, server-rendered content, or explicit timezone formatting. | Inspect how the page produces that value. Browser timezone emulation affects browser timezone behavior; it does not change server data or application code that explicitly selects a timezone. |
| The screenshot is blank or missing late-loading content. | Capture happened before the needed content was ready. | Wait for a meaningful selector or application-ready state before taking the screenshot. |
| A full-page image is too tall or differs from the expected viewport. | fullPage: true captures the scrollable page, not just the visible screen. |
Remove fullPage for a viewport shot, or capture a specific locator. |
| Runner logs show a different time from the page. | Node.js runner timezone and browser-context timezone are independent. | Use explicit timezone formatting for runner calculations or configure the runner timezone separately. |
| Visual snapshots differ across machines. | Browser and rendering environments can vary across operating systems, versions, settings, hardware, and headless mode. | Use a consistent environment and browser configuration for the baseline and subsequent captures. |
9. Performance, reliability, and cost
For a single capture, the main practical choices are how much page content to render and when to declare it ready. A viewport image captures less page area than a full-page image; full-page captures can require rendering a tall document and may expose lazy-loaded content. Wait for the specific content needed, and avoid unnecessary page interactions or waits in a capture workflow.
Repeatability depends on controlling the context and keeping the surrounding browser environment consistent. Timezone emulation makes the page’s browser timezone explicit, while consistent locale, viewport, browser version, and capture scope help make comparisons easier to interpret. It cannot make dynamic server content or unrelated rendering differences deterministic.
Playwright is browser automation software; this workflow does not establish a hosted screenshot service price. If you need a managed screenshot API instead of running a browser, ScreenshotNeo accepts one GET request with a URL and can return PNG, JPEG, WebP, or PDF. Its options include timezone and geolocation, viewport and device presets, full-page and element capture, and custom waits. See the ScreenshotNeo website and API documentation for its API details.
Or skip the browser setup
ScreenshotNeo is a hosted website screenshot API. Its timezone option can be used to request India local browser behavior; check the API documentation for the request parameter names and supported options.
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://example.com -o shot.webpimport requests
r = requests.get(
"https://api.screenshotneo.com/v1/shot",
params={"access_key": "YOUR_API_KEY", "url": "https://example.com"},
timeout=90
)
open("shot.webp", "wb").write(r.content)const q = new URLSearchParams({
access_key: 'YOUR_API_KEY',
url: 'https://example.com'
});
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);
if (!res.ok) throw new Error(`Screenshot request failed: ${res.status}`);
await require('node:fs/promises').writeFile('shot.webp', Buffer.from(await res.arrayBuffer()));Use the documented timezone parameter when you want the browser to use India time. ScreenshotNeo removes cookie and consent banners, newsletter popups, and chat widgets before capture; each cleanup step can be turned off. Bot checks, blank pages, timeouts, failed loads, and cache hits are not billed, and the response identifies the page verdict and billing status. Its MCP server lets AI agents use take_screenshot, get_page_info, and capture_pdf. The free plan includes 1,000 screenshots a month with no card; paid plans start at $5 for 3,000 screenshots. Every feature is on every plan. See the ScreenshotNeo docs for request configuration, and sign up free for 1,000 screenshots a month, no card required.
FAQ
What timezone should I use for India?
Set Playwright’s browser-context timezoneId to Asia/Kolkata.
Does setting en-IN set the browser timezone?
No. Locale and timezone are separate. Set timezoneId for timezone behavior and locale for language and locale-sensitive formatting.
Can I change the timezone of an already running page?
Configure the browser context before navigating to the page. For manual Chrome inspection, DevTools Protocol provides a timezone override method.
Will this make a site’s server use India time?
No. It emulates the browser timezone. Server-side date generation and application logic that explicitly chooses a timezone remain controlled by the site.
