<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_FNw8"id="signature">Signature:<ahref="#signature"class="hash-link"aria-label="Direct link to Signature:"title="Direct link to Signature:"></a></h4>
<h2class="anchor anchorWithStickyNavbar_FNw8"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_FNw8"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>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_FNw8"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>
<h2class="anchor anchorWithStickyNavbar_FNw8"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><p><strong>Remarks:</strong></p><p>Accessibility is a very platform-specific thing. On different platforms, there are different screen readers that might have wildly different output.</p><p>Blink - Chrome's rendering engine - has a concept of "accessibility tree", which is then translated into different platform-specific APIs. Accessibility namespace gives users access to the Blink Accessibility Tree.</p><p>Most of the accessibility tree gets filtered out when converting from Blink AX Tree to Platform-specific AX-Tree or by assistive technologies themselves. By default, Puppeteer tries to approximate this filtering, exposing only the "interesting" nodes of the tree.</p><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>Accessibility</code> class.</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><p><strong>Remarks:</strong></p><p>To output coverage in a form consumable by <ahref="https://github.com/istanbuljs"target="_blank"rel="noopener noreferrer">Istanbul</a>, see <ahref="https://github.com/istanbuljs/puppeteer-to-istanbul"target="_blank"rel="noopener noreferrer">puppeteer-to-istanbul</a>.</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><p><strong>Remarks:</strong></p><p>For finer control, you can use <ahref="/next/api/puppeteer.keyboard.down">Keyboard.down()</a>, <ahref="/next/api/puppeteer.keyboard.up">Keyboard.up()</a>, and <ahref="/next/api/puppeteer.keyboard.sendcharacter">Keyboard.sendCharacter()</a> to manually fire events as if they were generated from a real keyboard.</p><p>On macOS, keyboard shortcuts like <code>⌘ A</code> -> Select All do not work. See <ahref="https://github.com/puppeteer/puppeteer/issues/1313"target="_blank"rel="noopener noreferrer">#1313</a>.</p><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>Keyboard</code> class.</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><p><strong>Remarks:</strong></p><p>Every <code>page</code> object has its own Mouse, accessible with [<code>page.mouse</code>](#pagemouse).</p><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>Mouse</code> class.</p></td></tr><tr><td><spanid="touchscreen">touchscreen</span></td><td><p><code>readonly</code></p></td><td><p><ahref="/next/api/puppeteer.touchscreen"
<h2class="anchor anchorWithStickyNavbar_FNw8"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>Finds the first element that matches the selector. If no element matches the selector, the return value resolves to <code>null</code>.</p><p><strong>Remarks:</strong></p><p>Shortcut for <ahref="/next/api/puppeteer.frame._">Page.mainFrame().$(selector)</a>.</p></td></tr><tr><td><spanid="__"><ahref="/next/api/puppeteer.page.__">$$(selector)</a></span></td><td></td><td><p>Finds elements on the page that match the selector. If no elements match the selector, the return value resolves to <code>[]</code>.</p><p><strong>Remarks:</strong></p><p>Shortcut for <ahref="/next/api/puppeteer.frame.__">Page.mainFrame().$$(selector)</a>.</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 returns all elements matching the selector and passes the resulting array as the first argument to the <code>pageFunction</code>.</p><p><strong>Remarks:</strong></p><p>If <code>pageFunction</code> returns a promise <code>$$eval</code> will wait for the promise to resolve and then return its value.</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 finds the first element within the page that matches the selector and passes the result as the first argument to the <code>pageFunction</code>.</p><p><strong>Remarks:</strong></p><p>If no element is found matching <code>selector</code>, the method will throw an error.</p><p>If <code>pageFunction</code> returns a promise <code>$eval</code> will wait for the promise to resolve and then return its value.</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><p><strong>Remarks:</strong></p><p>Shortcut for <ahref="/next/api/puppeteer.frame.addscripttag">page.mainFrame().addScriptTag(options)</a>.</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><divclass="theme-admonition theme-admonition-note admonition_LMjb alert alert--secondary"><divclass="admonitionHeading_GGQ4"><spanclass="admonitionIcon_ifdW"><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_pGk6"><p>Request interception will be turned on behind the scenes to implement authentication. This might affect performance.</p></div></div><p><strong>Remarks:</strong></p><p>To disable authentication, pass <code>null</code>.</p></td></tr><tr><td><spanid="bringtofront"><ahre
</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_LMjb alert alert--secondary"><divclass="admonitionHeading_GGQ4"><spanclass="admonitionIcon_ifdW"><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_pGk6"><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><p><strong>Remarks:</strong></p><p>Shortcut for <ahref="/next/api/puppeteer.frame.focus">page.mainFrame().focus(selector)</a>.</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 frame or page to the given <code>url</code>.</p><p><strong>Remarks:</strong></p><p>Navigation to <code>about:blank</code> or navigation to the same URL with a different hash will succeed and return <code>null</code>.</p><divclass="theme-admonition theme-admonition-warning admonition_LMjb alert alert--warning"><divclass="admonitionHeading_GGQ4"><spanclass="admonitionIcon_ifdW"><svgviewBox="0 0 16 16"><pathfill-rule="evenodd"d="M8.893 1.5c-.183-.31-.52-.5-.887-.5s-.703.19-.886.5L.138 13.499a.98.98 0 0 0 0 1.001c.193.31.53.501.886.501h13.964c.367 0 .704-.19.877-.5a1.03 1.03 0 0 0 .01-1.002L8.893 1.5zm.133 11.497H6.987v-2.003h2.039v2.003zm0-3.004H6.987V5.987h2.039v4.006z"></path></svg></span>warning</div><divclass="admonitionContent_pGk6"><p>Headless shell mode doesn't support navigation to a PDF document. See the <ahref="https://crbug.com/761295"target="_blank"rel="noopener noreferrer">upstream issue</a>.</p></div></div><p>In headless shell, this method will not throw an error when any valid HTTP status code is returned by the remote server, including 404 "Not Found" and 500 "Internal Server Error". The status code for such responses can be retrieved by ca
</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_LMjb alert alert--success"><divclass="admonitionHeading_GGQ4"><spanclass="admonitionIcon_ifdW"><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_pGk6"><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_LMjb alert alert--secondary"><divclass="admonitionHeading_GGQ4"><spanclass="admonitionIcon_ifdW"><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_pGk6"><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><p><strong>Remarks:</strong></p><p>Consider using <ahref="/next/api/puppeteer.browsercontext.overridepermissions">BrowserContext.overridePermissions()</a> to grant permissions for the page to read its geolocation.</p></td></tr><tr><td><spanid="setjavascriptenabled"><ahref="/next/api/puppeteer.page.setjavascriptenabled">setJavaScriptEnabled(enabled)</a></span></td><td></td><td><p><strong>Remarks:</strong></p><p>NOTE: changing this value won't affect scripts that have already been run. It will take full effect on the next navigation.</p></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.
<li><code>timeout</code>: Maximum wait time in milliseconds, defaults to <code>30</code> seconds, pass <code>0</code> to disable the timeout. The default value can be changed by using the <ahref="/next/api/puppeteer.page.setdefaulttimeout">Page.setDefaultTimeout()</a> method.</li>
<li><code>timeout</code>: Maximum wait time in milliseconds, defaults to <code>30</code> seconds, pass <code>0</code> to disable the timeout. The default value can be changed by using the <ahref="/next/api/puppeteer.page.setdefaulttimeout">Page.setDefaultTimeout()</a> method.</li>
</ul></td></tr><tr><td><spanid="waitforselector"><ahref="/next/api/puppeteer.page.waitforselector">waitForSelector(selector, options)</a></span></td><td></td><td><p>Wait for the <code>selector</code> to appear in page. If at the moment of calling the method the <code>selector</code> already exists, the method will return immediately. If the <code>selector</code> doesn't appear after the <code>timeout</code> milliseconds of waiting, the function will throw.</p><p><strong>Remarks:</strong></p><p>The optional Parameter in Arguments <code>options</code> are:</p><ul>
<li>
<p><code>visible</code>: A boolean wait for element to be present in DOM and to be visible, i.e. to not have <code>display: none</code> or <code>visibility: hidden</code> CSS properties. Defaults to <code>false</code>.</p>
</li>
<li>
<p><code>hidden</code>: Wait for element to not be found in the DOM or to be hidden, i.e. have <code>display: none</code> or <code>visibility: hidden</code> CSS properties. Defaults to <code>false</code>.</p>
</li>
<li>
<p><code>timeout</code>: maximum time to wait for in milliseconds. Defaults to <code>30000</code> (30 seconds). Pass <code>0</code> to disable timeout. The default value can be changed by using the <ahref="/next/api/puppeteer.page.setdefaulttimeout">Page.setDefaultTimeout()</a> method.</p>
