Hardware FixRecommendedDevice not working? Your driver may be the problemCheck updates for common hardware issues.Fix DriversOctober DealsAmazon USOctober deal check: compare before you payAmazon US: current deals, useful picks and tech finds.Check DealsSlow PC?RecommendedPC slow today? Run a repair scan before it gets worseResolve common Windows issues and optimize system performance.Scan Now×
Skip to content
Chrome Translator API

How to Translate a Page With Headless Chrome Before Taking a Screenshot

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

Short answer: Headless Chrome can take the screenshot, but Chrome’s built-in Translate button is documented as a browser UI action—not as a supported Headless automation API. For a scriptable workflow, use Puppeteer to open the page, translate the text with a translation method your code controls, wait for the translated page to settle, and then capture it. Chrome’s built-in Translator API can translate text; your code must choose which text to translate and apply the results to the page.

Why the built-in Translate button is not the automation step

Chrome Help describes translating a page by selecting Translate from the address bar or choosing a target language from the right-click menu. Those instructions describe a person operating Chrome’s interface. They do not document a supported API for asking Headless Chrome to activate that same page-translation UI.

That distinction matters: a browser window can run without a visible UI, but that does not make every visible browser control callable from automation. Avoid basing a production screenshot pipeline on simulated clicks into Chrome’s Translate menu unless you have independently verified that approach for the exact Chrome build and environment you deploy. The documented, controllable alternative is to translate text in your own script and update the page before capture.

Choose the translation and capture path

Approach Best fit Important limit
Chrome Translator API plus Puppeteer You need programmatic navigation, translation and capture in one Node.js workflow. The API translates text, not an entire web page automatically. Your code selects and replaces text. Its support table begins at Chrome 138; check the actual browser you run.
Chrome Headless CLI You already have translated HTML or a page whose translation has been applied another way, and need a simple capture command. The CLI documentation covers capture flags, not a whole-page translation operation.

The Translator API documentation was last updated May 20, 2025 and lists support beginning with Chrome 138. Browser availability can change; test the exact Chrome binary and deployment environment rather than assuming the API exists. The examples below show the workflow components, not a claim that a single end-to-end recipe has been tested against every site.

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

Translate text and capture with Puppeteer

This example launches Chrome through Puppeteer, visits a page, asks the browser’s Translator API to translate eligible text nodes, waits for fonts and a short layout-stability interval, and saves a PNG. Replace the URL and language codes for your case. For example, en is English and es is Spanish.

1. Install Puppeteer

Use a current Puppeteer release and its compatible Chrome for Testing installation. In a new project, install Puppeteer with:

npm install puppeteer

Puppeteer’s API documentation currently reports version 25.12.0; use the documentation and launch behavior matching the version installed in your project. This example uses the bundled browser, rather than assuming that a system Chrome is installed.

2. Save and run the script

Create translate-shot.js with the following code:

const puppeteer = require('puppeteer');

(async () => {
  const url = 'https://example.com/';
  const sourceLanguage = 'en';
  const targetLanguage = 'es';

  const browser = await puppeteer.launch({ headless: true });
  try {
    const page = await browser.newPage();
    await page.setViewport({ width: 1440, height: 1000, deviceScaleFactor: 1 });
    await page.goto(url, { waitUntil: 'domcontentloaded', timeout: 60000 });

    // Replace this with a page-specific readiness condition for dynamic sites.
    await page.waitForSelector('body');

    const result = await page.evaluate(async ({ sourceLanguage, targetLanguage }) => {
      if (!('Translator' in window)) {
        return { ok: false, reason: 'Translator API is unavailable in this browser' };
      }

      try {
        const translator = await Translator.create({ sourceLanguage, targetLanguage });
        const walker = document.createTreeWalker(
          document.body,
          NodeFilter.SHOW_TEXT
        );
        const nodes = [];
        let node;
        while ((node = walker.nextNode())) {
          if (node.nodeValue.trim()) nodes.push(node);
        }

        for (const textNode of nodes) {
          const original = textNode.nodeValue;
          const translated = await translator.translate(original);
          textNode.nodeValue = translated;
        }
        translator.destroy();
        return { ok: true, translatedTextNodes: nodes.length };
      } catch (error) {
        return { ok: false, reason: String(error) };
      }
    }, { sourceLanguage, targetLanguage });

    if (!result.ok) {
      throw new Error(`Translation failed: ${result.reason}`);
    }

    await page.evaluate(async () => {
      if (document.fonts && document.fonts.ready) await document.fonts.ready;
    });
    // A short settling pause is not a universal readiness guarantee.
    await new Promise(resolve => setTimeout(resolve, 500));

    await page.screenshot({ path: 'translated-page.png', fullPage: true });
    console.log(`Saved screenshot; translated ${result.translatedTextNodes} text nodes.`);
  } finally {
    await browser.close();
  }
})().catch(error => {
  console.error(error);
  process.exitCode = 1;
});

Run it with node translate-shot.js. Puppeteer’s documented screenshot method is page.screenshot(); the example uses fullPage: true to capture the full page height. Set it to false if you need only the visible viewport.

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

What this example does—and does not—translate

  • It replaces nonempty DOM text nodes in the body, leaving their containing elements and basic page structure in place.
  • It does not translate text embedded in images, canvas drawings, CSS pseudo-elements, form values, accessible labels, metadata, or attributes such as title and aria-label.
  • It does not preserve the original wording in the DOM. If you need a reversible transformation, retain each original value and restore it after capture or work on a cloned page.
  • Translating each text node independently can produce awkward context or split phrases. For quality-sensitive output, identify meaningful content regions and translate larger coherent strings, while preserving markup deliberately.

Make page readiness explicit

Navigation completing does not mean that a modern site has finished rendering. Puppeteer’s navigation workflow and screenshot API provide the capture primitives, but the correct readiness condition depends on the site. A page may fetch content after initial HTML, lazy-load images on scroll, or continue changing after scripts run.

  • Wait for a known content selector. Replace the generic body wait in the example with a selector that appears only when the main content is ready, such as a page-specific article container.
  • Trigger lazy content if needed. For a full-page image, scroll through the page before capture so lazy-loaded content has a chance to appear. The scroll method is site-dependent; do not treat one fixed delay as proof that every image loaded.
  • Wait for fonts and layout. The script awaits document.fonts.ready and pauses briefly, but translation can alter line wrapping and page height. For repeatable capture, check a page-specific completion condition or compare layout dimensions until they stop changing.
  • Account for translated regions. If your page renders client-side content after the translation pass, that new content will remain untranslated. Wait for the site’s rendering to finish before translating, or repeat translation for content inserted later.

Translation can change the length of headings, buttons and paragraphs. That may change line breaks, move content below the fold, or reveal overflow that was not present in the source language. Choose a viewport and capture mode based on the output you need, not just the browser default.

Use Chrome Headless CLI for capture-only jobs

Chrome’s Headless CLI supports --screenshot for saving a screenshot and --window-size for controlling capture dimensions. It is a simpler option when translation has already been applied—for example, when your automation has produced a translated page or the target URL itself serves the target language.

chrome --headless --window-size=1440,1000 --screenshot=page.png https://example.com/

Use the executable name and flags appropriate to your operating system and Chrome installation. The command captures the page Chrome loads; it does not invoke the human-facing Translate menu or translate page content by itself. Chrome Developers documented the newer Headless implementation as sharing the regular Chrome implementation, with --headless=new available from Chrome 112. Since Chrome behavior and flags evolve, check the documentation for the version you deploy.

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.

Or skip the browser setup

If you need the screenshot rather than a custom translation pipeline, ScreenshotNeo offers a one-request capture API. This request captures the supplied URL; it does not translate the page. Translate or otherwise prepare the target-language page first if the screenshot must show translated content.

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. ScreenshotNeo removes cookie banners, newsletter popups and chat widgets before capture; bot checks, blank pages and failed loads are not billed; an MCP server lets AI agents take screenshots; and the free plan includes 1,000 screenshots a month with no card, with paid plans starting at $5 for 3,000. Learn more at ScreenshotNeo, then sign up free for 1,000 screenshots a month with no card.

Troubleshooting

“Translator API is unavailable”

The browser build may not support the API, or the API may not be available in that execution context. The documented support table starts at Chrome 138. Confirm the actual binary launched by Puppeteer, test the API in that browser, and implement a fallback—such as a translation service you control or a pretranslated page—instead of silently taking an untranslated screenshot.

Translation creation or translation fails

The browser may be unable to create the requested language pair, or the text translation call may reject. Log the returned error and treat translation failure as a failed job; otherwise the saved image can look successful while containing source-language content. Check the language pair and feature availability in the target Chrome release.

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

The screenshot is blank or incomplete

A completed navigation event is not necessarily the site’s content-ready event. Wait for a page-specific selector or state, inspect whether the page requires authentication or client-side data, and confirm the screenshot path and output file. For content below the fold, consider lazy loading and the selected full-page mode.

Text remains untranslated

Check whether the text is inside the body as a text node. Canvas, images, form values and attributes are outside the simple example’s scope. For content injected after the script runs, translate after that content appears or observe the page for later insertions.

The translated page layout is clipped or shifted

Translated strings can take more or less space than the originals. Increase the viewport if that matches the intended output, use full-page capture where appropriate, and wait until the page’s fonts and layout settle before capturing. If the page uses fixed-height containers, translation may expose a site layout constraint that a screenshot command cannot fix.

Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Support on Ko-Fi

Reliability, performance and cost considerations

The example translates nodes sequentially to keep the control flow simple. A page with many text nodes can take longer than a page with a few large content blocks, and browser translation may require model availability or preparation. Grouping text into larger coherent units can improve context, but requires careful reconstruction if markup separates meaningful content. Do not promise a fixed completion time based on a delay alone.

Free tools Windows power users keep installed

One-click scans. No signup required.

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

For dependable batch work, record the source URL, language pair, Chrome version, translation outcome, and whether the page-specific readiness check passed. Set navigation and job timeouts, close the browser in a finally block as shown, and write output only after translation succeeds. Keep a fallback path explicit: a screenshot of untranslated content should not be confused with a successfully translated result.

Frequently asked questions

Can I use Chrome’s Translate menu with --headless?

Chrome’s user instructions cover the visible Translate control and context menu. The reviewed official documentation does not describe a supported Headless API for triggering that UI, so use a controllable translation step instead.

Does the Translator API translate an entire website automatically?

No. It is a text translation API. Your application chooses text, applies translations to the page and handles content outside ordinary text nodes.

Is a Chrome CLI screenshot equivalent to Puppeteer?

Both can capture a page, but Puppeteer exposes programmable navigation and page interaction, while the CLI is suited to fixed targets and flag-based capture. Choose based on whether your workflow needs code-controlled page readiness and translation.

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

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.

Read next

Recommended PC Tool
Recommended PC Tool
Outdated Drivers Are Slowing You DownFree scan - exact matches
Windows Errors? Fix Them Before They SpreadFree repair 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.