Quick wins for a faster PC:
Scan for outdated or missing drivers - takes under a minuteDriver Scan →Repair Windows errors before they cause bigger problemsFix Now →Puppeteer’s page.pdf() uses the print CSS media type by default. If your PDF does not reflect an @media print rule, check whether your code switched the page to screen media with page.emulateMediaType('screen'). Then verify the active media state, the stylesheet and selector, and the separate PDF settings that control backgrounds and page geometry.
Does Puppeteer ignore @media print?
Not by default. The official Puppeteer Page.pdf() reference says it generates a PDF using the print CSS media type. Print rules should therefore be active when the PDF is created unless the page’s media state or the page-specific CSS and rendering conditions change the result.
The most direct configuration issue to rule out is an earlier call to page.emulateMediaType('screen'). That explicitly selects screen media; Puppeteer documents it as the way to generate a PDF with screen styling. The exact cause in a particular application cannot be determined without its code, stylesheets, page state, Puppeteer version and resulting PDF, so treat the checks below as diagnostics rather than assumptions about every failure.
Check and explicitly select print media
Although print is already the page.pdf() default, explicitly selecting it is a useful diagnostic: it makes the intended state clear and can expose a prior override. The following is a minimal runnable example for a Node.js project with Puppeteer installed:
#1 Best Overall
- HTML CSS Design and Build Web Sites
- Comes with secure packaging
- It can be a gift option
const puppeteer = require('puppeteer');
async function main() {
const browser = await puppeteer.launch();
try {
const page = await browser.newPage();
await page.goto('https://example.com', { waitUntil: 'networkidle2' });
// Select print media explicitly. page.pdf() uses it by default,
// but an earlier screen-media override would change the page state.
await page.emulateMediaType('print');
const mediaState = await page.evaluate(() => ({
print: matchMedia('print').matches,
screen: matchMedia('screen').matches,
}));
console.log(mediaState);
const pdf = await page.pdf({
path: 'page.pdf',
printBackground: true,
});
console.log(`Wrote ${pdf.length} bytes to page.pdf`);
} finally {
await browser.close();
}
}
main().catch((error) => {
console.error(error);
process.exitCode = 1;
});For print media, the expected state is { print: true, screen: false }. The official emulateMediaType() reference shows this kind of matchMedia() check and documents the accepted values: 'screen', 'print' and null. A value of null disables CSS media emulation; it is not an instruction to use print. The state check confirms which media query matches, but it does not establish that a stylesheet loaded, a selector matched or a declaration won the CSS cascade.
Remove a screen override if you want print styling
Search the code path that produces the PDF for emulateMediaType('screen'). If screen layout is intentional, keep it. If the PDF should use print rules, remove that override or call await page.emulateMediaType('print') after it and before page.pdf(). Check the state on the same page (and, if relevant, frame) that is being printed.
Separate media-query problems from PDF output options
Several PDF options change what the output looks like without turning print media on or off. The documented defaults and behaviors are in Puppeteer’s PDFOptions reference.
| What looks wrong | Setting to inspect | Effect |
|---|---|---|
| Background colors, fills or images are missing | printBackground |
Defaults to false. Set it to true if the PDF should include CSS backgrounds. This does not activate @media print. |
| Colors differ from the page’s screen appearance | -webkit-print-color-adjust |
Puppeteer documents that PDF rendering modifies colors for printing by default and points to this CSS property when exact colors are needed. It is a color-rendering control, not a media-query switch. |
Paper size or page layout does not match CSS @page |
preferCSSPageSize, format, width, height, scale and margins |
By default, preferCSSPageSize is false, so CSS page sizing does not take precedence over PDF size options. Set it to true when CSS @page sizing should take priority, and review any explicit size, scale or margin settings. |
For example, a print rule can be active while its background remains absent because printBackground is false. Likewise, an active rule does not guarantee that the intended paper size or page breaks will result if PDF sizing options conflict with the stylesheet.
Do these 3 things before closing this tab:
1Repair Windows errors before they cause bigger problems2Scan for outdated or missing drivers - takes under a minute3Clear out junk files and repair common Windows errorsTrace a print rule that still appears inactive
Once matchMedia('print').matches is true on the page you print, inspect the CSS itself. These are ordinary browser-debugging possibilities, not Puppeteer-specific causes established by the API documentation:
- Confirm the stylesheet loaded. Check the page’s network results and inspect the stylesheet or computed styles in DevTools. A media query cannot apply if its stylesheet was not available to the page.
- Confirm the selector matches the intended element. Inspect the element and test the selector. A correct media state does not make a mismatched selector apply.
- Check the cascade. Another declaration may override the print declaration because of specificity, source order, importance or an inline style. Inspect the computed value and the declarations that supplied it.
- Check the page and frame. Verify the media state and element on the same page or frame that contributes the content being printed. Do not infer the printed frame’s state from a different page.
- Check when the PDF is generated. If application code changes the DOM or styles asynchronously, wait for the application’s own ready condition before calling
page.pdf().
The official PDF generation guide demonstrates navigation with waitUntil: 'networkidle2'. That can be useful, but network idleness is not a universal guarantee that every application-specific render, image, data request or asynchronous task is complete.
Rank #3
- Brand: Wiley
- Set of 2 Volumes
- A handy two-book set that uniquely combines related technologies Highly visual format and accessible language makes these books highly effective learning tools Perfect for beginning web designers and front-end developers
Wait for the page’s actual print-ready state
Puppeteer documents that it waits for fonts by default during PDF generation. That is helpful for font loading, but it does not prove that a framework finished rendering data or that every image and app-specific operation is complete. If the page exposes a readiness signal, wait for that signal before printing:
await page.goto(url, { waitUntil: 'networkidle2' });
await page.waitForFunction(() => window.appReady === true);
await page.emulateMediaType('print');
const pdf = await page.pdf({
path: 'report.pdf',
printBackground: true,
});Replace window.appReady with a condition your application actually sets; it is an example, not a built-in Puppeteer property. If the app has no single ready flag, wait for a meaningful selector or another observable completion condition. Avoid treating a fixed delay as proof of readiness: it may be too short on a slow run and unnecessarily long on a fast one.
Free tools Windows power users keep installed
One-click scans. No signup required.
Choose print styling or screen styling deliberately
The choice depends on the desired document. For a document intended for paper or a print-oriented PDF, use print media and define print-specific layout in @media print and, where appropriate, page dimensions and margins in @page. For a PDF that should preserve the screen layout, select screen media explicitly before generating it:
await page.emulateMediaType('screen');
const pdf = await page.pdf({ path: 'screen-layout.pdf' });That is an intentional alternative, not a fix for print rules. If the output is unexpectedly screen-styled, look for the override; if it is intentionally screen-styled, do not expect @media print declarations to control it.
Or skip the browser setup
For a screenshot or PDF capture workflow where you do not need to manage Puppeteer and a browser yourself, ScreenshotNeo is a website screenshot API and MCP server. It accepts a URL in one GET request and can return a screenshot or PDF. Its cleanup options can accept a cookie or consent banner like a visitor and remove more than 60 known consent platforms, newsletter popups and chat widgets; each of those steps can be turned off. Bot checks or CAPTCHAs, blank pages, timeouts, failed loads and cache hits are not billed, and each response includes X-Page-Verdict and X-Billed headers. AI agents can use its MCP tools: take_screenshot, get_page_info and capture_pdf. See the ScreenshotNeo API documentation for request options.
This cURL example requests a screenshot of the target URL, following the documented API pattern:
What’s actually slowing this PC down?
Pick the symptom - the matching free tool is one click away.
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://example.com -o shot.webpEquivalent Python and Node.js requests are:
import 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}`);ScreenshotNeo offers 1,000 screenshots a month free with no card; paid plans start at $5 for 3,000. Sign up for free.
Best Value
Troubleshooting by symptom
- Print layout is replaced by screen layout: inspect for
emulateMediaType('screen'), select print after any override, and checkmatchMedia('print').matcheson the page being printed. - Print colors or backgrounds are missing: distinguish absent background graphics from inactive CSS. Try
printBackground: truefor backgrounds; investigate-webkit-print-color-adjustseparately if print color adjustment changes colors. - Paper size, scaling or page breaks look wrong: inspect
format,width,height,scale, margins andpreferCSSPageSizetogether with the page’s@pagerules. - Content or fonts appear incomplete: Puppeteer waits for fonts by default, but application rendering may need a separate readiness wait. Verify the content is present before creating the PDF.
matchMedia('print').matchesis false: explicitly callawait page.emulateMediaType('print'), then evaluate the check again on the same page.- The media check is true but the style is not visible: inspect stylesheet loading, selector matching, cascade and frame/page identity; the media check alone does not validate those.
Puppeteer’s documentation is versioned and can change. The API pages cited here were accessed on September 29, 2026; the emulateMediaType() reference displayed version 25.12.0. Check the documentation corresponding to the Puppeteer version installed in your project if behavior or option defaults differ.
Frequently Asked Questions
What does page.emulateMediaType(null) do?
It disables CSS media emulation. It does not explicitly select print media; use 'print' when you want to make that state explicit.
Does printBackground: true make @media print apply?
No. It includes CSS backgrounds in the PDF; media selection and background inclusion are separate controls.
The Tool Desk
Outbyte PC Repair FREEClear out junk files and repair common Windows errorsFree Scan →Outbyte Driver Updater FREEScan for outdated or missing drivers - takes under a minuteDriver Scan →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.
