<titledata-rh="true">Page class | Puppeteer</title><metadata-rh="true"name="viewport"content="width=device-width,initial-scale=1"><metadata-rh="true"name="twitter:card"content="summary_large_image"><metadata-rh="true"property="og:url"content="https://pptr.dev/next/api/puppeteer.page"><metadata-rh="true"property="og:locale"content="en"><metadata-rh="true"name="docsearch:language"content="en"><metadata-rh="true"name="docsearch:counter"content="3"><metadata-rh="true"property="og:title"content="Page class | Puppeteer"><metadata-rh="true"name="description"content="Page provides methods to interact with a single tab or extension background page in the browser."><metadata-rh="true"property="og:description"content="Page provides methods to interact with a single tab or extension background page in the browser."><linkdata-rh="true"rel="icon"href="/img/favicon.ico"><linkdata-rh="true"rel="canonical"href="https://pptr.dev/next/api/puppeteer.page"><linkdata-rh="true"rel="alternate"href="https://pptr.dev/next/api/puppeteer.page"hreflang="en"><linkdata-rh="true"rel="alternate"href="https://pptr.dev/next/api/puppeteer.page"hreflang="x-default"><linkdata-rh="true"rel="preconnect"href="https://DVKY664LG7-dsn.algolia.net"crossorigin="anonymous"><linkrel="search"type="application/opensearchdescription+xml"title="Puppeteer"href="/opensearch.xml">
<p>Page provides methods to interact with a single tab or <ahref="https://developer.chrome.com/extensions/background_pages"target="_blank"rel="noopener noreferrer">extension background page</a> in the browser.</p>
<h4class="anchor anchorWithStickyNavbar_LWe7"id="signature">Signature:<ahref="#signature"class="hash-link"aria-label="Direct link to Signature:"title="Direct link to Signature:"></a></h4>
<h2class="anchor anchorWithStickyNavbar_LWe7"id="remarks">Remarks<ahref="#remarks"class="hash-link"aria-label="Direct link to Remarks"title="Direct link to Remarks"></a></h2>
<p>The constructor for this class is marked as internal. Third-party code should not call the constructor directly or create subclasses that extend the <code>Page</code> class.</p>
<h2class="anchor anchorWithStickyNavbar_LWe7"id="example-1">Example 1<ahref="#example-1"class="hash-link"aria-label="Direct link to Example 1"title="Direct link to Example 1"></a></h2>
<p>This example creates a page, navigates it to a URL, and then saves a screenshot:</p>
<p>The Page class extends from Puppeteer's <ahref="/next/api/puppeteer.eventemitter">EventEmitter</a> class and will emit various events which are documented in the <ahref="/next/api/puppeteer.pageevent">PageEvent</a> enum.</p>
<h2class="anchor anchorWithStickyNavbar_LWe7"id="example-2">Example 2<ahref="#example-2"class="hash-link"aria-label="Direct link to Example 2"title="Direct link to Example 2"></a></h2>
<p>This example logs a message for a single page <code>load</code> event:</p>
<h2class="anchor anchorWithStickyNavbar_LWe7"id="properties">Properties<ahref="#properties"class="hash-link"aria-label="Direct link to Properties"title="Direct link to Properties"></a></h2>
<table><thead><tr><th><p>Property</p></th><th><p>Modifiers</p></th><th><p>Type</p></th><th><p>Description</p></th></tr></thead><tbody><tr><td><spanid="accessibility">accessibility</span></td><td><p><code>readonly</code></p></td><td><p><ahref="/next/api/puppeteer.accessibility">Accessibility</a></p></td><td><p>The Accessibility class provides methods for inspecting the browser's accessibility tree. The accessibility tree is used by assistive technology such as <ahref="https://en.wikipedia.org/wiki/Screen_reader"target="_blank"rel="noopener noreferrer">screen readers</a> or <ahref="https://en.wikipedia.org/wiki/Switch_access"target="_blank"rel="noopener noreferrer">switches</a>.</p></td></tr><tr><td><spanid="coverage">coverage</span></td><td><p><code>readonly</code></p></td><td><p><ahref="/next/api/puppeteer.coverage">Coverage</a></p></td><td><p>The Coverage class provides methods to gather information about parts of JavaScript and CSS that were used by the page.</p></td></tr><tr><td><spanid="keyboard">keyboard</span></td><td><p><code>readonly</code></p></td><td><p><ahref="/next/api/puppeteer.keyboard">Keyboard</a></p></td><td><p>Keyboard provides an api for managing a virtual keyboard. The high level api is <ahref="/next/api/puppeteer.keyboard.type">Keyboard.type()</a>, which takes raw characters and generates proper keydown, keypress/input, and keyup events on your page.</p></td></tr><tr><td><spanid="mouse">mouse</span></td><td><p><code>readonly</code></p></td><td><p><ahref="/next/api/puppeteer.mouse">Mouse</a></p></td><td><p>The Mouse class operates in main-frame CSS pixels relative to the top-left corner of the viewport.</p></td></tr><tr><td><spanid="touchscreen">touchscreen</span></td><td><p><code>readonly</code></p></td><td><p><ahref="/next/api/puppeteer.touchscreen">Touchscreen</a></p></td><td><p>The Touchscreen class exposes touchscreen events.</p></td></tr><tr><td><spanid="tracing">tracing</span></td><td><p><code>readonly</code></p></td><td><p><ahref="/next/api/puppeteer.tracing">Tracing</a></p></td><td><p>The Tracing class exposes the tracing audit interface.</p></td></tr></tbody></table>
<h2class="anchor anchorWithStickyNavbar_LWe7"id="methods">Methods<ahref="#methods"class="hash-link"aria-label="Direct link to Methods"title="Direct link to Methods"></a></h2>
<table><thead><tr><th><p>Method</p></th><th><p>Modifiers</p></th><th><p>Description</p></th></tr></thead><tbody><tr><td><spanid="_"><ahref="/next/api/puppeteer.page._">$(selector)</a></span></td><td></td><td><p>Runs <code>document.querySelector</code> within the page. If no element matches the selector, the return value resolves to <code>null</code>.</p></td></tr><tr><td><spanid="__"><ahref="/next/api/puppeteer.page.__">$$(selector)</a></span></td><td></td><td><p>The method runs <code>document.querySelectorAll</code> within the page. If no elements match the selector, the return value resolves to <code>[]</code>.</p></td></tr><tr><td><spanid="__eval"><ahref="/next/api/puppeteer.page.__eval">$$eval(selector, pageFunction, args)</a></span></td><td></td><td><p>This method runs <code>Array.from(document.querySelectorAll(selector))</code> within the page and passes the result as the first argument to the <code>pageFunction</code>.</p></td></tr><tr><td><spanid="_eval"><ahref="/next/api/puppeteer.page._eval">$eval(selector, pageFunction, args)</a></span></td><td></td><td><p>This method runs <code>document.querySelector</code> within the page and passes the result as the first argument to the <code>pageFunction</code>.</p></td></tr><tr><td><spanid="addscripttag"><ahref="/next/api/puppeteer.page.addscripttag">addScriptTag(options)</a></span></td><td></td><td><p>Adds a <code><script></code> tag into the page with the desired URL or content.</p></td></tr><tr><td><spanid="addstyletag"><ahref="/next/api/puppeteer.page.addstyletag">addStyleTag(options)</a></span></td><td></td><td><p>Adds a <code><link rel="stylesheet"></code> tag into the page with the desired URL or a <code><style type="text/css"></code> tag with the content.</p><p>Shortcut for <ahref="/next/api/puppeteer.frame.addstyletag_1">page.mainFrame().addStyleTag(options)</a>.</p></td></tr><tr><td><spanid="addstyletag"><ahref="/next/api/puppeteer.page.addstyletag_1">addStyleTag(options)</a></span></td><td></td><td></td></tr><tr><td><spanid="authenticate"><ahref="/next/api/puppeteer.page.authenticate">authenticate(credentials)</a></span></td><td></td><td><p>Provide credentials for <code>HTTP authentication</code>.</p></td></tr><tr><td><spanid="bringtofront"><ahref="/next/api/puppeteer.page.bringtofront">bringToFront()</a></span></td><td></td><td><p>Brings page to front (activates tab).</p></td></tr><tr><td><spanid="browser"><ahref="/next/api/puppeteer.page.browser">browser()</a></span></td><td></td><td><p>Get the browser the page belongs to.</p></td></tr><tr><td><spanid="browsercontext"><ahref="/next/api/puppeteer.page.browsercontext">browserContext()</a></span></td><td></td><td><p>Get the browser context that the page belongs to.</p></td></tr><tr><td><spanid="click"><ahref="/next/api/puppeteer.page.click">click(selector, options)</a></span></td><td></td><td><p>This method fetches an element with <code>selector</code>, scrolls it into view if needed, and then uses <ahref="/next/api/puppeteer.page#mouse">Page.mouse</a> to click in the center of the element. If there's no element matching <code>selector</code>, the method throws an error.</p></td></tr><tr><td><spanid="close"><ahref="/next/api/puppeteer.page.close">close(options)</a></span></td><td></td><td></td></tr><tr><td><spanid="content"><ahref="/next/api/puppeteer.page.content">content()</a></span></td><td></td><td><p>The full HTML contents of the page, including the DOCTYPE.</p></td></tr><tr><td><spanid="cookies"><ahref="/next/api/puppeteer.page.cookies">cookies(urls)</a></span></td><td></td><td><p>If no URLs are specified, this method returns cookies for the current page URL. If URLs are specified, only cookies for those URLs are returned.</p></td></tr><tr><td><spanid="createcdpsession"><ahref="/next/api/puppeteer.page.createcdpsession">createCDPSession()</a></span></td><td></td><td><p>Creates a Chrome Devtools Protocol session attached to the page.</p></td></tr><tr><td><spanid="createpdfstream"><ahref="/next/api/puppeteer.page.createpdfstream
</ul><p>The function is invoked after the document was created but before any of its scripts were run. This is useful to amend the JavaScript environment, e.g. to seed <code>Math.random</code>.</p></td></tr><tr><td><spanid="exposefunction"><ahref="/next/api/puppeteer.page.exposefunction">exposeFunction(name, pptrFunction)</a></span></td><td></td><td><p>The method adds a function called <code>name</code> on the page's <code>window</code> object. When called, the function executes <code>puppeteerFunction</code> in node.js and returns a <code>Promise</code> which resolves to the return value of <code>puppeteerFunction</code>.</p><p>If the puppeteerFunction returns a <code>Promise</code>, it will be awaited.</p><divclass="theme-admonition theme-admonition-note admonition_xJq3 alert alert--secondary"><divclass="admonitionHeading_Gvgb"><spanclass="admonitionIcon_Rf37"><svgviewBox="0 0 14 16"><pathfill-rule="evenodd"d="M6.3 5.69a.942.942 0 0 1-.28-.7c0-.28.09-.52.28-.7.19-.18.42-.28.7-.28.28 0 .52.09.7.28.18.19.28.42.28.7 0 .28-.09.52-.28.7a1 1 0 0 1-.7.3c-.28 0-.52-.11-.7-.3zM8 7.99c-.02-.25-.11-.48-.31-.69-.2-.19-.42-.3-.69-.31H6c-.27.02-.48.13-.69.31-.2.2-.3.44-.31.69h1v3c.02.27.11.5.31.69.2.2.42.31.69.31h1c.27 0 .48-.11.69-.31.2-.19.3-.42.31-.69H8V7.98v.01zM7 2.3c-3.14 0-5.7 2.54-5.7 5.68 0 3.14 2.56 5.7 5.7 5.7s5.7-2.55 5.7-5.7c0-3.15-2.56-5.69-5.7-5.69v.01zM7 .98c3.86 0 7 3.14 7 7s-3.14 7-7 7-7-3.12-7-7 3.14-7 7-7z"></path></svg></span>note</div><divclass="admonitionContent_BuS1"><p>Functions installed via <code>page.exposeFunction</code> survive navigations.</p></div></div></td></tr><tr><td><spanid="focus"><ahref="/next/api/puppeteer.page.focus">focus(selector)</a></span></td><td></td><td><p>This method fetches an element with <code>selector</code> and focuses it. If there's no element matching <code>selector</code>, the method throws an error.</p></td></tr><tr><td><spanid="frames"><ahref="/next/api/puppeteer.page.frames">frames()</a></span></td><td></td><td><p>An array of all frames attached to the page.</p></td></tr><tr><td><spanid="getdefaulttimeout"><ahref="/next/api/puppeteer.page.getdefaulttimeout">getDefaultTimeout()</a></span></td><td></td><td><p>Maximum time in milliseconds.</p></td></tr><tr><td><spanid="goback"><ahref="/next/api/puppeteer.page.goback">goBack(options)</a></span></td><td></td><td><p>This method navigate to the previous page in history.</p></td></tr><tr><td><spanid="goforward"><ahref="/next/api/puppeteer.page.goforward">goForward(options)</a></span></td><td></td><td><p>This method navigate to the next page in history.</p></td></tr><tr><td><spanid="goto"><ahref="/next/api/puppeteer.page.goto">goto(url, options)</a></span></td><td></td><td><p>Navigates the page to the given <code>url</code>.</p></td></tr><tr><td><spanid="hover"><ahref="/next/api/puppeteer.page.hover">hover(selector)</a></span></td><td></td><td><p>This method fetches an element with <code>selector</code>, scrolls it into view if needed, and then uses <ahref="/next/api/puppeteer.page#mouse">Page.mouse</a> to hover over the center of the element. If there's no element matching <code>selector</code>, the method throws an error.</p></td></tr><tr><td><spanid="isclosed"><ahref="/next/api/puppeteer.page.isclosed">isClosed()</a></span></td><td></td><td><p>Indicates that the page has been closed.</p></td></tr><tr><td><spanid="isdraginterceptionenabled"><ahref="/next/api/puppeteer.page.isdraginterceptionenabled">isDragInterceptionEnabled()</a></span></td><td><p><code>deprecated</code></p></td><td><p><code>true</code> if drag events are being intercepted, <code>false</code> otherwise.</p><p><strong>Deprecated:</strong></p><p>We no longer support intercepting drag payloads. Use the new drag APIs found on <ahref="/next/api/puppeteer.elementhandle">ElementHandle</a> to drag (or just use the <ahref="/next/api/puppeteer.page#mouse">Page.mouse</a>).</p></td></tr><tr><td><spanid="isjavascriptenabled"><ahref="/next/api/puppeteer.page.isjavascriptenabled">isJavaScriptEnabled()</a></span></td><td></td><td><
</ul></td></tr><tr><td><spanid="setdefaulttimeout"><ahref="/next/api/puppeteer.page.setdefaulttimeout">setDefaultTimeout(timeout)</a></span></td><td></td><td></td></tr><tr><td><spanid="setdraginterception"><ahref="/next/api/puppeteer.page.setdraginterception">setDragInterception(enabled)</a></span></td><td><p><code>deprecated</code></p></td><td><p><strong>Deprecated:</strong></p><p>We no longer support intercepting drag payloads. Use the new drag APIs found on <ahref="/next/api/puppeteer.elementhandle">ElementHandle</a> to drag (or just use the <ahref="/next/api/puppeteer.page#mouse">Page.mouse</a>).</p></td></tr><tr><td><spanid="setextrahttpheaders"><ahref="/next/api/puppeteer.page.setextrahttpheaders">setExtraHTTPHeaders(headers)</a></span></td><td></td><td><p>The extra HTTP headers will be sent with every request the page initiates.</p><divclass="theme-admonition theme-admonition-tip admonition_xJq3 alert alert--success"><divclass="admonitionHeading_Gvgb"><spanclass="admonitionIcon_Rf37"><svgviewBox="0 0 12 16"><pathfill-rule="evenodd"d="M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"></path></svg></span>tip</div><divclass="admonitionContent_BuS1"><p>All HTTP header names are lowercased. (HTTP headers are case-insensitive, so this shouldn’t impact your server code.)</p></div></div><divclass="theme-admonition theme-admonition-note admonition_xJq3 alert alert--secondary"><divclass="admonitionHeading_Gvgb"><spanclass="admonitionIcon_Rf37"><svgviewBox="0 0 14 16"><pathfill-rule="evenodd"d="M6.3 5.69a.942.942 0 0 1-.28-.7c0-.28.09-.52.28-.7.19-.18.42-.28.7-.28.28 0 .52.09.7.28.18.19.28.42.28.7 0 .28-.09.52-.28.7a1 1 0 0 1-.7.3c-.28 0-.52-.11-.7-.3zM8 7.99c-.02-.25-.11-.48-.31-.69-.2-.19-.42-.3-.69-.31H6c-.27.02-.48.13-.69.31-.2.2-.3.44-.31.69h1v3c.02.27.11.5.31.69.2.2.42.31.69.31h1c.27 0 .48-.11.69-.31.2-.19.3-.42.31-.69H8V7.98v.01zM7 2.3c-3.14 0-5.7 2.54-5.7 5.68 0 3.14 2.56 5.7 5.7 5.7s5.7-2.55 5.7-5.7c0-3.15-2.56-5.69-5.7-5.69v.01zM7 .98c3.86 0 7 3.14 7 7s-3.14 7-7 7-7-3.12-7-7 3.14-7 7-7z"></path></svg></span>note</div><divclass="admonitionContent_BuS1"><p>page.setExtraHTTPHeaders does not guarantee the order of headers in the outgoing requests.</p></div></div></td></tr><tr><td><spanid="setgeolocation"><ahref="/next/api/puppeteer.page.setgeolocation">setGeolocation(options)</a></span></td><td></td><td><p>Sets the page's geolocation.</p></td></tr><tr><td><spanid="setjavascriptenabled"><ahref="/next/api/puppeteer.page.setjavascriptenabled">setJavaScriptEnabled(enabled)</a></span></td><td></td><td></td></tr><tr><td><spanid="setofflinemode"><ahref="/next/api/puppeteer.page.setofflinemode">setOfflineMode(enabled)</a></span></td><td></td><td><p>Sets the network connection to offline.</p><p>It does not change the parameters used in <ahref="/next/api/puppeteer.page.emulatenetworkconditions">Page.emulateNetworkConditions()</a></p></td></tr><tr><td><spanid="setrequestinterception"><ahref="/next/api/puppeteer.page.setrequestinterception">setRequestInterception(value)</a></span></td><td></td><td><p>Activating request interception enables <ahref="/next/api/puppeteer.httprequest.abort">HTTPRequest.abort()</a>, <ahref="/next/api/puppeteer.httprequest.continue">HTTPRequest.continue()</a> and <ahref="/next/api/puppeteer.httprequest.respond">HTTPRequest.respond()</a> methods. This provides the capability to modify network requests that are made by a page.</p><p>Once request interception is enabled, every request will stall unless it's continued, responded or aborted; or completed using the browser cache.</p><p>See the <ahref="https://pptr.dev/guides/network-interception"target="_blank"rel="n