--- sidebar_label: Page --- # Page class Page provides methods to interact with a single tab or [extension background page](https://developer.chrome.com/extensions/background_pages) in the browser. :::note One Browser instance might have multiple Page instances. ::: #### Signature: ```typescript export declare abstract class Page extends EventEmitter ``` **Extends:** [EventEmitter](./puppeteer.eventemitter.md)<[PageEvents](./puppeteer.pageevents.md)> ## Remarks The constructor for this class is marked as internal. Third-party code should not call the constructor directly or create subclasses that extend the `Page` class. ## Example 1 This example creates a page, navigates it to a URL, and then saves a screenshot: ```ts import puppeteer from 'puppeteer'; (async () => { const browser = await puppeteer.launch(); const page = await browser.newPage(); await page.goto('https://example.com'); await page.screenshot({path: 'screenshot.png'}); await browser.close(); })(); ``` The Page class extends from Puppeteer's [EventEmitter](./puppeteer.eventemitter.md) class and will emit various events which are documented in the [PageEvent](./puppeteer.pageevent.md) enum. ## Example 2 This example logs a message for a single page `load` event: ```ts page.once('load', () => console.log('Page loaded!')); ``` To unsubscribe from events use the [EventEmitter.off()](./puppeteer.eventemitter.off.md) method: ```ts function logRequest(interceptedRequest) { console.log('A request was made:', interceptedRequest.url()); } page.on('request', logRequest); // Sometime later... page.off('request', logRequest); ``` ## Properties
Property Modifiers Type Description
accessibility `readonly` [Accessibility](./puppeteer.accessibility.md) The Accessibility class provides methods for inspecting the browser's accessibility tree. The accessibility tree is used by assistive technology such as [screen readers](https://en.wikipedia.org/wiki/Screen_reader) or [switches](https://en.wikipedia.org/wiki/Switch_access). **Remarks:** Accessibility is a very platform-specific thing. On different platforms, there are different screen readers that might have wildly different output. 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. 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. The constructor for this class is marked as internal. Third-party code should not call the constructor directly or create subclasses that extend the `Accessibility` class.
coverage `readonly` [Coverage](./puppeteer.coverage.md) The Coverage class provides methods to gather information about parts of JavaScript and CSS that were used by the page. **Remarks:** To output coverage in a form consumable by [Istanbul](https://github.com/istanbuljs), see [puppeteer-to-istanbul](https://github.com/istanbuljs/puppeteer-to-istanbul).
keyboard `readonly` [Keyboard](./puppeteer.keyboard.md) Keyboard provides an api for managing a virtual keyboard. The high level api is [Keyboard.type()](./puppeteer.keyboard.type.md), which takes raw characters and generates proper keydown, keypress/input, and keyup events on your page. **Remarks:** For finer control, you can use [Keyboard.down()](./puppeteer.keyboard.down.md), [Keyboard.up()](./puppeteer.keyboard.up.md), and [Keyboard.sendCharacter()](./puppeteer.keyboard.sendcharacter.md) to manually fire events as if they were generated from a real keyboard. On macOS, keyboard shortcuts like `⌘ A` -> Select All do not work. See [\#1313](https://github.com/puppeteer/puppeteer/issues/1313). The constructor for this class is marked as internal. Third-party code should not call the constructor directly or create subclasses that extend the `Keyboard` class.
mouse `readonly` [Mouse](./puppeteer.mouse.md) The Mouse class operates in main-frame CSS pixels relative to the top-left corner of the viewport. **Remarks:** Every `page` object has its own Mouse, accessible with \[`page.mouse`\](\#pagemouse). The constructor for this class is marked as internal. Third-party code should not call the constructor directly or create subclasses that extend the `Mouse` class.
touchscreen `readonly` [Touchscreen](./puppeteer.touchscreen.md) The Touchscreen class exposes touchscreen events.
tracing `readonly` [Tracing](./puppeteer.tracing.md) The Tracing class exposes the tracing audit interface. **Remarks:** You can use `tracing.start` and `tracing.stop` to create a trace file which can be opened in Chrome DevTools or [timeline viewer](https://chromedevtools.github.io/timeline-viewer/). The constructor for this class is marked as internal. Third-party code should not call the constructor directly or create subclasses that extend the `Tracing` class.
## Methods
Method Modifiers Description
[$(selector)](./puppeteer.page._.md) Finds the first element that matches the selector. If no element matches the selector, the return value resolves to `null`. **Remarks:** Shortcut for [Page.mainFrame().$(selector)](./puppeteer.frame._.md).
[$$(selector)](./puppeteer.page.__.md) Finds elements on the page that match the selector. If no elements match the selector, the return value resolves to `[]`. **Remarks:** Shortcut for [Page.mainFrame().$$(selector)](./puppeteer.frame.__.md).
[$$eval(selector, pageFunction, args)](./puppeteer.page.__eval.md) This method returns all elements matching the selector and passes the resulting array as the first argument to the `pageFunction`. **Remarks:** If `pageFunction` returns a promise `$$eval` will wait for the promise to resolve and then return its value.
[$eval(selector, pageFunction, args)](./puppeteer.page._eval.md) This method finds the first element within the page that matches the selector and passes the result as the first argument to the `pageFunction`. **Remarks:** If no element is found matching `selector`, the method will throw an error. If `pageFunction` returns a promise `$eval` will wait for the promise to resolve and then return its value.
[addScriptTag(options)](./puppeteer.page.addscripttag.md) Adds a `