2021-10-07 15:21:45 +00:00
<!doctype html>
2023-02-13 10:26:19 +00:00
< html lang = "en" dir = "ltr" class = "docs-wrapper docs-doc-page docs-version-19.7.0 plugin-docs plugin-id-default docs-doc-id-index" >
2021-10-07 15:21:45 +00:00
< head >
< meta charset = "UTF-8" >
2022-12-16 13:59:40 +00:00
< meta name = "generator" content = "Docusaurus v2.2.0" >
2023-01-11 15:09:01 +00:00
< title data-rh = "true" > Puppeteer | Puppeteer< / title > < meta data-rh = "true" name = "viewport" content = "width=device-width,initial-scale=1" > < meta data-rh = "true" name = "twitter:card" content = "summary_large_image" > < meta data-rh = "true" property = "og:url" content = "https://pptr.dev/" > < meta data-rh = "true" name = "docsearch:language" content = "en" > < meta data-rh = "true" name = "docsearch:counter" content = "2" > < meta data-rh = "true" property = "og:title" content = "Puppeteer | Puppeteer" > < meta data-rh = "true" name = "description" content = "Build status" > < meta data-rh = "true" property = "og:description" content = "Build status" > < link data-rh = "true" rel = "icon" href = "/img/favicon.ico" > < link data-rh = "true" rel = "canonical" href = "https://pptr.dev/" > < link data-rh = "true" rel = "alternate" href = "https://pptr.dev/" hreflang = "en" > < link data-rh = "true" rel = "alternate" href = "https://pptr.dev/" hreflang = "x-default" > < link data-rh = "true" rel = "preconnect" href = "https://DVKY664LG7-dsn.algolia.net" crossorigin = "anonymous" > < script data-rh = "true" > function maybeInsertBanner ( ) { window . _ _DOCUSAURUS _INSERT _BASEURL _BANNER && insertBanner ( ) } function insertBanner ( ) { var n = document . getElementById ( "docusaurus-base-url-issue-banner-container" ) ; if ( n ) { n . innerHTML = '\n<div id="docusaurus-base-url-issue-banner" style="border: thick solid red; background-color: rgb(255, 230, 179); margin: 20px; padding: 20px; font-size: 20px;">\n <p style="font-weight: bold; font-size: 30px;">Your Docusaurus site did not load properly.</p>\n <p>A very common reason is a wrong site <a href="https://docusaurus.io/docs/docusaurus.config.js/#baseurl" style="font-weight: bold;">baseUrl configuration</a>.</p>\n <p>Current configured baseUrl = <span style="font-weight: bold; color: red;">/</span> (default value)</p>\n <p>We suggest trying baseUrl = <span id="docusaurus-base-url-issue-banner-suggestion-container" style="font-weight: bold; color: green;"></span></p>\n</div>\n' ; var e = document . getElementById ( "docusaurus-base-url-issue-banner-suggestion-container" ) , s = window . location . pathname , r = "/" === s . substr ( - 1 ) ? s : s + "/" ; e . innerHTML = r } } window . _ _DOCUSAURUS _INSERT _BASEURL _BANNER = ! 0 , document . addEventListener ( "DOMContentLoaded" , maybeInsertBanner ) < / script > < link rel = "search" type = "application/opensearchdescription+xml" title = "Puppeteer" href = "/opensearch.xml" >
< script src = "/fix-location.js" > < / script > < link rel = "stylesheet" href = "/assets/css/styles.79ad2638.css" >
2023-02-15 10:38:59 +00:00
< link rel = "preload" href = "/assets/js/runtime~main.410700f8.js" as = "script" >
2023-02-14 21:42:45 +00:00
< link rel = "preload" href = "/assets/js/main.583110df.js" as = "script" >
2021-10-07 15:21:45 +00:00
< / head >
2022-06-28 11:21:17 +00:00
< body class = "navigation-with-keyboard" >
2021-10-07 15:21:45 +00:00
< script > ! function ( ) { function t ( t ) { document . documentElement . setAttribute ( "data-theme" , t ) } var e = function ( ) { var t = null ; try { t = localStorage . getItem ( "theme" ) } catch ( t ) { } return t } ( ) ; t ( null !== e ? e : "light" ) } ( ) < / script > < div id = "__docusaurus" >
2023-02-13 10:26:19 +00:00
< div id = "docusaurus-base-url-issue-banner-container" > < / div > < div role = "region" aria-label = "Skip to main content" > < a class = "skipToContent_fXgn" href = "#docusaurus_skipToContent_fallback" > Skip to main content< / a > < / div > < nav class = "navbar navbar--fixed-top" > < div class = "navbar__inner" > < div class = "navbar__items" > < button aria-label = "Toggle navigation bar" aria-expanded = "false" class = "navbar__toggle clean-btn" type = "button" > < svg width = "30" height = "30" viewBox = "0 0 30 30" aria-hidden = "true" > < path stroke = "currentColor" stroke-linecap = "round" stroke-miterlimit = "10" stroke-width = "2" d = "M4 7h22M4 15h22M4 23h22" > < / path > < / svg > < / button > < a class = "navbar__brand" href = "/" > < div class = "navbar__logo" > < img src = "https://user-images.githubusercontent.com/10379601/29446482-04f7036a-841f-11e7-9872-91d1fc2ea683.png" alt = "Puppeteer Logo" class = "themedImage_ToTc themedImage--light_HNdA" > < img src = "https://user-images.githubusercontent.com/10379601/29446482-04f7036a-841f-11e7-9872-91d1fc2ea683.png" alt = "Puppeteer Logo" class = "themedImage_ToTc themedImage--dark_i4oU" > < / div > < b class = "navbar__title text--truncate" > Puppeteer< / b > < / a > < a aria-current = "page" class = "navbar__item navbar__link navbar__link--active" href = "/" > Docs< / a > < a class = "navbar__item navbar__link" href = "/api/puppeteer.puppeteernode" > API< / a > < / div > < div class = "navbar__items navbar__items--right" > < div class = "navbar__item dropdown dropdown--hoverable dropdown--right" > < a class = "navbar__link" aria-haspopup = "true" aria-expanded = "false" role = "button" href = "/" > 19.7.0< / a > < ul class = "dropdown__menu" > < li > < a class = "dropdown__link" href = "/next/" > Next< / a > < / li > < li > < a aria-current = "page" class = "dropdown__link dropdown__link--active" href = "/" > 19.7.0< / a > < / li > < li > < hr class = "dropdown-separator" > < / li > < li class = "dropdown-archived-versions" > < b > Archived versions< / b > < / li > < li > < a href = "https://github.com/puppeteer/puppeteer/blob/v19.6.3/docs/api/index.md" target = "_blank" rel = "noopener noreferrer" class = "dropdown__link" > 19.6.3< svg width = "12" height = "12" aria-hidden = "true" viewBox = "0 0 24 24" class = "iconExternalLink_nPIU" > < path fill = "currentColor" d = "M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z" > < / path > < / svg > < / a > < / li > < li > < a href = "https://github.com/puppeteer/puppeteer/blob/v19.6.2/docs/api/index.md" target = "_blank" rel = "noopener noreferrer" class = "dropdown__link" > 19.6.2< svg width = "12" height = "12" aria-hidden = "true" viewBox = "0 0 24 24" class = "iconExternalLink_nPIU" > < path fill = "currentColor" d = "M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z" > < / path > < / svg > < / a > < / li > < li > < a href = "https://github.com/puppeteer/puppeteer/blob/v19.6.1/docs/api/index.md" target = "_blank" rel = "noopener noreferrer" class = "dropdown__link" > 19.6.1< svg width = "12" height = "12" aria-hidden = "true" viewBox = "0 0 24 24" class = "iconExternalLink_nPIU" > < path fill = "currentColor" d = "M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z" > < / path > < / svg > < / a > < / li > < li > < a href = "https://github.com/puppeteer/puppeteer/blob/v19.6.0/docs/api/index.md" target = "_blank" rel = "noopener noreferrer" class = "dropdown__link" > 19.6.0< svg width = "12" height = "12" aria-hidden = "true" viewBox = "0 0 24 24" class = "iconExternalLink_nPIU" > < path fill = "currentColor" d = "M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z" > < / path > < / svg > < / a > < / li > < li > < a href = "https://github.com/puppeteer/puppeteer/blob/v19.5.2/docs/api/index.md" target = "_blank" rel = "noopener noreferrer" class = "dropdown__link" > 19.5.2< svg width = "12" height = "12" aria-hidden = "true" viewBox = "0 0 24 24" class = "iconExternalLink_nPIU" > < path fill = "currentColor" d = "M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z" > < / path > < / svg > < / a > < / li > < li > < a href = "https://github.com/puppeteer/puppeteer/blob/v19.5.1/docs/api/index.md" target = "_blank" rel = "noopener noreferrer" class = "dropdown__link" > 19.5.1< svg width = "12" height = "12" aria-hidden = "true" viewBox = "0 0 24 2
2022-10-28 07:23:25 +00:00
< a href = "https://npmjs.org/package/puppeteer" target = "_blank" rel = "noopener noreferrer" > < img loading = "lazy" src = "https://img.shields.io/npm/v/puppeteer.svg" alt = "npm puppeteer package" class = "img_ev3q" > < / a > < / p > < img loading = "lazy" src = "https://user-images.githubusercontent.com/10379601/29446482-04f7036a-841f-11e7-9872-91d1fc2ea683.png" height = "200" align = "right" class = "img_ev3q" > < h4 class = "anchor anchorWithStickyNavbar_LWe7" id = "guides--api--faq--contributing--troubleshooting" > < a href = "https://pptr.dev/category/guides" target = "_blank" rel = "noopener noreferrer" > Guides< / a > | < a href = "https://pptr.dev/api" target = "_blank" rel = "noopener noreferrer" > API< / a > | < a href = "https://pptr.dev/faq" target = "_blank" rel = "noopener noreferrer" > FAQ< / a > | < a href = "https://pptr.dev/contributing" target = "_blank" rel = "noopener noreferrer" > Contributing< / a > | < a href = "https://pptr.dev/troubleshooting" target = "_blank" rel = "noopener noreferrer" > Troubleshooting< / a > < a class = "hash-link" href = "#guides--api--faq--contributing--troubleshooting" title = "Direct link to heading" > < / a > < / h4 > < blockquote > < p > Puppeteer is a Node.js library which provides a high-level API to control
2022-10-21 14:20:31 +00:00
Chrome/Chromium over the
< a href = "https://chromedevtools.github.io/devtools-protocol/" target = "_blank" rel = "noopener noreferrer" > DevTools Protocol< / a > .
Puppeteer runs in
< a href = "https://developers.google.com/web/updates/2017/04/headless-chrome" target = "_blank" rel = "noopener noreferrer" > headless< / a >
mode by default, but can be configured to run in full (non-headless)
Chrome/Chromium.< / p > < / blockquote > < h4 class = "anchor anchorWithStickyNavbar_LWe7" id = "what-can-i-do" > What can I do?< a class = "hash-link" href = "#what-can-i-do" title = "Direct link to heading" > < / a > < / h4 > < p > Most things that you can do manually in the browser can be done using Puppeteer!
Here are a few examples to get you started:< / p > < ul > < li > Generate screenshots and PDFs of pages.< / li > < li > Crawl a SPA (Single-Page Application) and generate pre-rendered content (i.e.
" SSR" (Server-Side Rendering)).< / li > < li > Automate form submission, UI testing, keyboard input, etc.< / li > < li > Create an automated testing environment using the latest JavaScript and
browser features.< / li > < li > Capture a
< a href = "https://developers.google.com/web/tools/chrome-devtools/evaluate-performance/reference" target = "_blank" rel = "noopener noreferrer" > timeline trace< / a >
of your site to help diagnose performance issues.< / li > < li > Test Chrome Extensions.< / li > < / ul > < h2 class = "anchor anchorWithStickyNavbar_LWe7" id = "getting-started" > Getting Started< a class = "hash-link" href = "#getting-started" title = "Direct link to heading" > < / a > < / h2 > < h3 class = "anchor anchorWithStickyNavbar_LWe7" id = "installation" > Installation< a class = "hash-link" href = "#installation" title = "Direct link to heading" > < / a > < / h3 > < p > To use Puppeteer in your project, run:< / p > < div class = "language-bash codeBlockContainer_Ckt0 theme-code-block" style = "--prism-color:#393A34;--prism-background-color:#f6f8fa" > < div class = "codeBlockContent_biex" > < pre tabindex = "0" class = "prism-code language-bash codeBlock_bY9V thin-scrollbar" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token function" style = "color:#d73a49" > npm< / span > < span class = "token plain" > i puppeteer< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > < / span > < span class = "token comment" style = "color:#999988;font-style:italic" > # or `yarn add puppeteer`< / span > < span class = "token plain" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > < / span > < span class = "token comment" style = "color:#999988;font-style:italic" > # or `pnpm i puppeteer`< / span > < br > < / span > < / code > < / pre > < div class = "buttonGroup__atx" > < button type = "button" aria-label = "Copy code to clipboard" title = "Copy" class = "clean-btn" > < span class = "copyButtonIcons_eSgA" aria-hidden = "true" > < svg class = "copyButtonIcon_y97N" viewBox = "0 0 24 24" > < path d = "M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z" > < / path > < / svg > < svg class = "copyButtonSuccessIcon_LjdS" viewBox = "0 0 24 24" > < path d = "M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" > < / path > < / svg > < / span > < / button > < / div > < / div > < / div > < p > When you install Puppeteer, it automatically downloads a recent version of
Chromium (~170MB macOS, ~282MB Linux, ~280MB Windows) that is
< a href = "https://pptr.dev/faq#q-why-doesnt-puppeteer-vxxx-work-with-chromium-vyyy" target = "_blank" rel = "noopener noreferrer" > guaranteed to work< / a >
with Puppeteer. For a version of Puppeteer without installation, see
2022-10-28 07:23:25 +00:00
< a href = "#puppeteer-core" > < code > puppeteer-core< / code > < / a > .< / p > < h4 class = "anchor anchorWithStickyNavbar_LWe7" id = "configuration" > Configuration< a class = "hash-link" href = "#configuration" title = "Direct link to heading" > < / a > < / h4 > < p > Puppeteer uses several defaults that can be customized through configuration
2022-10-24 12:22:18 +00:00
files.< / p > < p > For example, to change the default cache directory Puppeteer uses to install
browsers, you can add a < code > .puppeteerrc.cjs< / code > (or < code > puppeteer.config.cjs< / code > ) at the
root of your application with the contents< / p > < div class = "language-js codeBlockContainer_Ckt0 theme-code-block" style = "--prism-color:#393A34;--prism-background-color:#f6f8fa" > < div class = "codeBlockContent_biex" > < pre tabindex = "0" class = "prism-code language-js codeBlock_bY9V thin-scrollbar" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token keyword" style = "color:#00009f" > const< / span > < span class = "token plain" > < / span > < span class = "token punctuation" style = "color:#393A34" > {< / span > < span class = "token plain" > join< / span > < span class = "token punctuation" style = "color:#393A34" > }< / span > < span class = "token plain" > < / span > < span class = "token operator" style = "color:#393A34" > =< / span > < span class = "token plain" > < / span > < span class = "token function" style = "color:#d73a49" > require< / span > < span class = "token punctuation" style = "color:#393A34" > (< / span > < span class = "token string" style = "color:#e3116c" > ' path' < / span > < span class = "token punctuation" style = "color:#393A34" > )< / span > < span class = "token punctuation" style = "color:#393A34" > ;< / span > < span class = "token plain" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" style = "display:inline-block" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > < / span > < span class = "token comment" style = "color:#999988;font-style:italic" > /**< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token comment" style = "color:#999988;font-style:italic" > * @type {import(" puppeteer" ).Configuration}< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token comment" style = "color:#999988;font-style:italic" > */< / span > < span class = "token plain" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > module< / span > < span class = "token punctuation" style = "color:#393A34" > .< / span > < span class = "token property-access" > exports< / span > < span class = "token plain" > < / span > < span class = "token operator" style = "color:#393A34" > =< / span > < span class = "token plain" > < / span > < span class = "token punctuation" style = "color:#393A34" > {< / span > < span class = "token plain" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > < / span > < span class = "token comment" style = "color:#999988;font-style:italic" > // Changes the cache location for Puppeteer.< / span > < span class = "token plain" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > < / span > < span class = "token literal-property property" style = "color:#36acaa" > cacheDirectory< / span > < span class = "token operator" style = "color:#393A34" > :< / span > < span class = "token plain" > < / span > < span class = "token function" style = "color:#d73a49" > join< / span > < span class = "token punctuation" style = "color:#393A34" > (< / span > < span class = "token plain" > __dirname< / span > < span class = "token punctuation" style = "color:#393A34" > ,< / span > < span class = "token plain" > < / span > < span class = "token string" style = "color:#e3116c" > ' .cache' < / span > < span class = "token punctuation" style = "color:#393A34" > ,< / span > < span class = "token plain" > < / span > < span class = "token string" style = "color:#e3116c" > ' puppeteer' < / span > < span class = "token punctuation" style = "color:#393A34" > )< / span > < span class = "token punctuation" style = "color:#393A34" > ,< / span > < span class = "token plain" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > < / span > < span class = "token punctuation" style = "color:#393A34" > }< / span > < span class = "token punctuation" style = "color:#393A34" > ;< / span > < br > < / span > < / code > < / pre > < div class = "buttonGroup__atx" > < button type = "button" aria-label = "Copy code to clipboard" title = "Copy" class = "clean-btn" > < span class = "copyButtonIcons_eSgA" aria-hidden = "true" > < svg class = "copyButtonIcon_y97N" viewBox = "0 0 24 24" > < path d = "M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z" > < / path > < / svg > < svg class = "copyButtonSuccessIcon_LjdS" viewBox = "0 0 24 24" > < path d = "M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.5
2022-11-23 13:43:06 +00:00
< code > puppeteer< / code > for it to take effect.< / p > < p > See the < a href = "https://pptr.dev/guides/configuration" target = "_blank" rel = "noopener noreferrer" > configuration guide< / a > for more
2022-10-28 07:23:25 +00:00
information.< / p > < h4 class = "anchor anchorWithStickyNavbar_LWe7" id = "puppeteer-core" > < code > puppeteer-core< / code > < a class = "hash-link" href = "#puppeteer-core" title = "Direct link to heading" > < / a > < / h4 > < p > Every release since v1.7.0 we publish two packages:< / p > < ul > < li > < a href = "https://www.npmjs.com/package/puppeteer" target = "_blank" rel = "noopener noreferrer" > < code > puppeteer< / code > < / a > < / li > < li > < a href = "https://www.npmjs.com/package/puppeteer-core" target = "_blank" rel = "noopener noreferrer" > < code > puppeteer-core< / code > < / a > < / li > < / ul > < p > < code > puppeteer< / code > is a < em > product< / em > for browser automation. When installed, it downloads
2022-10-21 14:20:31 +00:00
a version of Chromium, which it then drives using < code > puppeteer-core< / code > . Being an
2022-10-28 07:23:25 +00:00
end-user product, < code > puppeteer< / code > automates several workflows using reasonable
defaults < a href = "https://pptr.dev/guides/configuration" target = "_blank" rel = "noopener noreferrer" > that can be customized< / a > .< / p > < p > < code > puppeteer-core< / code > is a < em > library< / em > to help drive anything that supports DevTools
2022-10-24 12:22:18 +00:00
protocol. Being a library, < code > puppeteer-core< / code > is fully driven through its
programmatic interface implying no defaults are assumed and < code > puppeteer-core< / code >
2022-10-28 07:23:25 +00:00
will not download Chromium when installed.< / p > < p > You should use < code > puppeteer-core< / code > if you are
< a href = "https://pptr.dev/api/puppeteer.puppeteer.connect" target = "_blank" rel = "noopener noreferrer" > connecting to a remote browser< / a >
or < a href = "https://pptr.dev/api/puppeteer.browserfetcher" target = "_blank" rel = "noopener noreferrer" > managing browsers yourself< / a > .
If you are managing browsers yourself, you will need to call
2022-10-21 14:20:31 +00:00
< a href = "https://pptr.dev/api/puppeteer.puppeteernode.launch" target = "_blank" rel = "noopener noreferrer" > < code > puppeteer.launch< / code > < / a > with
2022-10-24 12:22:18 +00:00
an an explicit
2022-10-21 14:20:31 +00:00
< a href = "https://pptr.dev/api/puppeteer.launchoptions.executablepath" target = "_blank" rel = "noopener noreferrer" > < code > executablePath< / code > < / a >
2022-10-28 07:23:25 +00:00
(or < a href = "https://pptr.dev/api/puppeteer.launchoptions.channel" target = "_blank" rel = "noopener noreferrer" > < code > channel< / code > < / a > if it' s
installed in a standard location).< / p > < p > When using < code > puppeteer-core< / code > , remember to change the import:< / p > < div class = "language-ts codeBlockContainer_Ckt0 theme-code-block" style = "--prism-color:#393A34;--prism-background-color:#f6f8fa" > < div class = "codeBlockContent_biex" > < pre tabindex = "0" class = "prism-code language-ts codeBlock_bY9V thin-scrollbar" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token keyword" style = "color:#00009f" > import< / span > < span class = "token plain" > puppeteer < / span > < span class = "token keyword" style = "color:#00009f" > from< / span > < span class = "token plain" > < / span > < span class = "token string" style = "color:#e3116c" > ' puppeteer-core' < / span > < span class = "token punctuation" style = "color:#393A34" > ;< / span > < br > < / span > < / code > < / pre > < div class = "buttonGroup__atx" > < button type = "button" aria-label = "Copy code to clipboard" title = "Copy" class = "clean-btn" > < span class = "copyButtonIcons_eSgA" aria-hidden = "true" > < svg class = "copyButtonIcon_y97N" viewBox = "0 0 24 24" > < path d = "M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z" > < / path > < / svg > < svg class = "copyButtonSuccessIcon_LjdS" viewBox = "0 0 24 24" > < path d = "M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" > < / path > < / svg > < / span > < / button > < / div > < / div > < / div > < h3 class = "anchor anchorWithStickyNavbar_LWe7" id = "usage" > Usage< a class = "hash-link" href = "#usage" title = "Direct link to heading" > < / a > < / h3 > < p > Puppeteer follows the latest
2022-10-21 14:20:31 +00:00
< a href = "https://github.com/nodejs/Release#release-schedule" target = "_blank" rel = "noopener noreferrer" > maintenance LTS< / a > version of
Node.< / p > < p > Puppeteer will be familiar to people using other browser testing frameworks. You
< a href = "https://pptr.dev/api/puppeteer.puppeteernode.launch" target = "_blank" rel = "noopener noreferrer" > launch< / a > /< a href = "https://pptr.dev/api/puppeteer.puppeteernode.connect" target = "_blank" rel = "noopener noreferrer" > connect< / a >
a < a href = "https://pptr.dev/api/puppeteer.browser" target = "_blank" rel = "noopener noreferrer" > browser< / a > ,
< a href = "https://pptr.dev/api/puppeteer.browser.newpage" target = "_blank" rel = "noopener noreferrer" > create< / a > some
< a href = "https://pptr.dev/api/puppeteer.page" target = "_blank" rel = "noopener noreferrer" > pages< / a > , and then manipulate them with
2022-10-28 07:23:25 +00:00
< a href = "https://pptr.dev/api" target = "_blank" rel = "noopener noreferrer" > Puppeteer' s API< / a > .< / p > < p > For more in-depth usage, check our < a href = "https://pptr.dev/category/guides" target = "_blank" rel = "noopener noreferrer" > guides< / a >
2023-02-01 15:01:01 +00:00
and < a href = "https://github.com/puppeteer/puppeteer/tree/main/examples" target = "_blank" rel = "noopener noreferrer" > examples< / a > .< / p > < h4 class = "anchor anchorWithStickyNavbar_LWe7" id = "example" > Example< a class = "hash-link" href = "#example" title = "Direct link to heading" > < / a > < / h4 > < p > The following example searches < a href = "https://developer.chrome.com/" target = "_blank" rel = "noopener noreferrer" > developer.chrome.com< / a > for blog posts with text " automate beyond recorder" , click on the first result and print the full title of the blog post.< / p > < div class = "language-ts codeBlockContainer_Ckt0 theme-code-block" style = "--prism-color:#393A34;--prism-background-color:#f6f8fa" > < div class = "codeBlockContent_biex" > < pre tabindex = "0" class = "prism-code language-ts codeBlock_bY9V thin-scrollbar" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token keyword" style = "color:#00009f" > import< / span > < span class = "token plain" > puppeteer < / span > < span class = "token keyword" style = "color:#00009f" > from< / span > < span class = "token plain" > < / span > < span class = "token string" style = "color:#e3116c" > ' puppeteer' < / span > < span class = "token punctuation" style = "color:#393A34" > ;< / span > < span class = "token plain" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" style = "display:inline-block" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > < / span > < span class = "token punctuation" style = "color:#393A34" > (< / span > < span class = "token keyword" style = "color:#00009f" > async< / span > < span class = "token plain" > < / span > < span class = "token punctuation" style = "color:#393A34" > (< / span > < span class = "token punctuation" style = "color:#393A34" > )< / span > < span class = "token plain" > < / span > < span class = "token operator" style = "color:#393A34" > => < / span > < span class = "token plain" > < / span > < span class = "token punctuation" style = "color:#393A34" > {< / span > < span class = "token plain" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > < / span > < span class = "token keyword" style = "color:#00009f" > const< / span > < span class = "token plain" > browser < / span > < span class = "token operator" style = "color:#393A34" > =< / span > < span class = "token plain" > < / span > < span class = "token keyword" style = "color:#00009f" > await< / span > < span class = "token plain" > puppeteer< / span > < span class = "token punctuation" style = "color:#393A34" > .< / span > < span class = "token function" style = "color:#d73a49" > launch< / span > < span class = "token punctuation" style = "color:#393A34" > (< / span > < span class = "token punctuation" style = "color:#393A34" > )< / span > < span class = "token punctuation" style = "color:#393A34" > ;< / span > < span class = "token plain" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > < / span > < span class = "token keyword" style = "color:#00009f" > const< / span > < span class = "token plain" > page < / span > < span class = "token operator" style = "color:#393A34" > =< / span > < span class = "token plain" > < / span > < span class = "token keyword" style = "color:#00009f" > await< / span > < span class = "token plain" > browser< / span > < span class = "token punctuation" style = "color:#393A34" > .< / span > < span class = "token function" style = "color:#d73a49" > newPage< / span > < span class = "token punctuation" style = "color:#393A34" > (< / span > < span class = "token punctuation" style = "color:#393A34" > )< / span > < span class = "token punctuation" style = "color:#393A34" > ;< / span > < span class = "token plain" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" style = "display:inline-block" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > < / span > < span class = "token keyword" style = "color:#00009f" > await< / span > < span class = "token plain" > page< / span > < span class = "token punctuation" style = "color:#393A34" > .< / span > < span class = "token function" style = "color:#d73a49" > goto< / span > < span class = "token punctuation" style = "color:#393A34" > (< / span > < span class = "token string" style = "color:#e3116c" > ' https://developer.chrome.com/' < / span > < span class = "token punctuation" style = "color:#393A34
2022-10-21 14:20:31 +00:00
< a href = "https://developers.google.com/web/updates/2017/04/headless-chrome" target = "_blank" rel = "noopener noreferrer" > headless mode< / a > .
To launch a full version of Chromium, set the
< a href = "https://pptr.dev/api/puppeteer.browserlaunchargumentoptions.headless" target = "_blank" rel = "noopener noreferrer" > < code > headless< / code > < / a >
option when launching a browser:< / p > < div class = "language-ts codeBlockContainer_Ckt0 theme-code-block" style = "--prism-color:#393A34;--prism-background-color:#f6f8fa" > < div class = "codeBlockContent_biex" > < pre tabindex = "0" class = "prism-code language-ts codeBlock_bY9V thin-scrollbar" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token keyword" style = "color:#00009f" > const< / span > < span class = "token plain" > browser < / span > < span class = "token operator" style = "color:#393A34" > =< / span > < span class = "token plain" > < / span > < span class = "token keyword" style = "color:#00009f" > await< / span > < span class = "token plain" > puppeteer< / span > < span class = "token punctuation" style = "color:#393A34" > .< / span > < span class = "token function" style = "color:#d73a49" > launch< / span > < span class = "token punctuation" style = "color:#393A34" > (< / span > < span class = "token punctuation" style = "color:#393A34" > {< / span > < span class = "token plain" > headless< / span > < span class = "token operator" style = "color:#393A34" > :< / span > < span class = "token plain" > < / span > < span class = "token boolean" style = "color:#36acaa" > false< / span > < span class = "token punctuation" style = "color:#393A34" > }< / span > < span class = "token punctuation" style = "color:#393A34" > )< / span > < span class = "token punctuation" style = "color:#393A34" > ;< / span > < span class = "token plain" > < / span > < span class = "token comment" style = "color:#999988;font-style:italic" > // default is true< / span > < br > < / span > < / code > < / pre > < div class = "buttonGroup__atx" > < button type = "button" aria-label = "Copy code to clipboard" title = "Copy" class = "clean-btn" > < span class = "copyButtonIcons_eSgA" aria-hidden = "true" > < svg class = "copyButtonIcon_y97N" viewBox = "0 0 24 24" > < path d = "M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z" > < / path > < / svg > < svg class = "copyButtonSuccessIcon_LjdS" viewBox = "0 0 24 24" > < path d = "M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" > < / path > < / svg > < / span > < / button > < / div > < / div > < / div > < p > < strong > 2. Runs a bundled version of Chromium< / strong > < / p > < p > By default, Puppeteer downloads and uses a specific version of Chromium so its
API is guaranteed to work out of the box. To use Puppeteer with a different
version of Chrome or Chromium, pass in the executable' s path when creating a
< code > Browser< / code > instance:< / p > < div class = "language-ts codeBlockContainer_Ckt0 theme-code-block" style = "--prism-color:#393A34;--prism-background-color:#f6f8fa" > < div class = "codeBlockContent_biex" > < pre tabindex = "0" class = "prism-code language-ts codeBlock_bY9V thin-scrollbar" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token keyword" style = "color:#00009f" > const< / span > < span class = "token plain" > browser < / span > < span class = "token operator" style = "color:#393A34" > =< / span > < span class = "token plain" > < / span > < span class = "token keyword" style = "color:#00009f" > await< / span > < span class = "token plain" > puppeteer< / span > < span class = "token punctuation" style = "color:#393A34" > .< / span > < span class = "token function" style = "color:#d73a49" > launch< / span > < span class = "token punctuation" style = "color:#393A34" > (< / span > < span class = "token punctuation" style = "color:#393A34" > {< / span > < span class = "token plain" > executablePath< / span > < span class = "token operator" style = "color:#393A34" > :< / span > < span class = "token plain" > < / span > < span class = "token string" style = "color:#e3116c" > ' /path/to/Chrome' < / span > < span class = "token punctuation" style = "color:#393A34" > }< / span > < span class = "token punctuation" style = "color:#393A34" > )< / span > < span class = "token punctuation" style = "color:#393A34" > ;< / span > < br > < / span > < / code > < / pre > < div class = "buttonGroup__atx" > < button type = "button" aria-label = "Copy code to clipboard" title = "Copy" class = "clean-btn" > < span class = "copyButtonIcons_eSgA" aria-hidden = "true" > < svg class = "copyButtonIcon_y97N" viewBox = "0 0 24 24" > < path d = "M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z" > < / path > < / svg > < svg class = "copyButtonSuccessIcon_LjdS" viewBox = "0 0 24 24" > < path d = "M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" > < / path > < / svg > < / span > < / button > < / div > < / div > < / div > < p > You can also use Puppeteer with Firefox Nightly (experimental support). See
< a href = "https://pptr.dev/api/puppeteer.puppeteernode.launch" target = "_blank" rel = "noopener noreferrer" > < code > Puppeteer.launch< / code > < / a > for
more information.< / p > < p > See
< a href = "https://www.howtogeek.com/202825/what%E2%80%99s-the-difference-between-chromium-and-chrome/" target = "_blank" rel = "noopener noreferrer" > < code > this article< / code > < / a >
for a description of the differences between Chromium and Chrome.
< a href = "https://chromium.googlesource.com/chromium/src/+/refs/heads/main/docs/chromium_browser_vs_google_chrome.md" target = "_blank" rel = "noopener noreferrer" > < code > This article< / code > < / a >
describes some differences for Linux users.< / p > < p > < strong > 3. Creates a fresh user profile< / strong > < / p > < p > Puppeteer creates its own browser user profile which it < strong > cleans up on every
2022-11-23 13:43:06 +00:00
run< / strong > .< / p > < h4 class = "anchor anchorWithStickyNavbar_LWe7" id = "using-docker" > Using Docker< a class = "hash-link" href = "#using-docker" title = "Direct link to heading" > < / a > < / h4 > < p > See our < a href = "https://pptr.dev/guides/docker" target = "_blank" rel = "noopener noreferrer" > Docker guide< / a > .< / p > < h4 class = "anchor anchorWithStickyNavbar_LWe7" id = "using-chrome-extensions" > Using Chrome Extensions< a class = "hash-link" href = "#using-chrome-extensions" title = "Direct link to heading" > < / a > < / h4 > < p > See our < a href = "https://pptr.dev/guides/chrome-extensions" target = "_blank" rel = "noopener noreferrer" > Chrome extensions guide< / a > .< / p > < h2 class = "anchor anchorWithStickyNavbar_LWe7" id = "resources" > Resources< a class = "hash-link" href = "#resources" title = "Direct link to heading" > < / a > < / h2 > < ul > < li > < a href = "https://pptr.dev/api" target = "_blank" rel = "noopener noreferrer" > API Documentation< / a > < / li > < li > < a href = "https://pptr.dev/category/guides" target = "_blank" rel = "noopener noreferrer" > Guides< / a > < / li > < li > < a href = "https://github.com/puppeteer/puppeteer/tree/main/examples" target = "_blank" rel = "noopener noreferrer" > Examples< / a > < / li > < li > < a href = "https://github.com/transitive-bullshit/awesome-puppeteer" target = "_blank" rel = "noopener noreferrer" > Community list of Puppeteer resources< / a > < / li > < / ul > < h2 class = "anchor anchorWithStickyNavbar_LWe7" id = "contributing" > Contributing< a class = "hash-link" href = "#contributing" title = "Direct link to heading" > < / a > < / h2 > < p > Check out our < a href = "https://pptr.dev/contributing" target = "_blank" rel = "noopener noreferrer" > contributing guide< / a > to get an
2022-10-21 14:20:31 +00:00
overview of Puppeteer development.< / p > < h2 class = "anchor anchorWithStickyNavbar_LWe7" id = "faq" > FAQ< a class = "hash-link" href = "#faq" title = "Direct link to heading" > < / a > < / h2 > < p > Our < a href = "https://pptr.dev/faq" target = "_blank" rel = "noopener noreferrer" > FAQ< / a > has migrated to
2023-01-09 10:29:10 +00:00
< a href = "https://pptr.dev/faq" target = "_blank" rel = "noopener noreferrer" > our site< / a > .< / p > < / div > < / article > < nav class = "pagination-nav docusaurus-mt-lg" aria-label = "Docs pages navigation" > < a class = "pagination-nav__link pagination-nav__link--next" href = "/category/guides" > < div class = "pagination-nav__sublabel" > Next< / div > < div class = "pagination-nav__label" > Guides< / div > < / a > < / nav > < / div > < / div > < div class = "col col--3" > < div class = "tableOfContents_bqdL thin-scrollbar theme-doc-toc-desktop" > < ul class = "table-of-contents table-of-contents__left-border" > < li > < a href = "#getting-started" class = "table-of-contents__link toc-highlight" > Getting Started< / a > < ul > < li > < a href = "#installation" class = "table-of-contents__link toc-highlight" > Installation< / a > < / li > < li > < a href = "#usage" class = "table-of-contents__link toc-highlight" > Usage< / a > < / li > < li > < a href = "#default-runtime-settings" class = "table-of-contents__link toc-highlight" > Default runtime settings< / a > < / li > < / ul > < / li > < li > < a href = "#resources" class = "table-of-contents__link toc-highlight" > Resources< / a > < / li > < li > < a href = "#contributing" class = "table-of-contents__link toc-highlight" > Contributing< / a > < / li > < li > < a href = "#faq" class = "table-of-contents__link toc-highlight" > FAQ< / a > < / li > < / ul > < / div > < / div > < / div > < / div > < / main > < / div > < / div > < footer class = "footer footer--dark" > < div class = "container container-fluid" > < div class = "row footer__links" > < div class = "col footer__col" > < div class = "footer__title" > Community< / div > < ul class = "footer__items clean-list" > < li class = "footer__item" > < a href = "https://stackoverflow.com/questions/tagged/puppeteer" target = "_blank" rel = "noopener noreferrer" class = "footer__link-item" > Stack Overflow< svg width = "13.5" height = "13.5" aria-hidden = "true" viewBox = "0 0 24 24" class = "iconExternalLink_nPIU" > < path fill = "currentColor" d = "M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z" > < / path > < / svg > < / a > < / li > < li class = "footer__item" > < a href = "https://twitter.com/chromedevtools" target = "_blank" rel = "noopener noreferrer" class = "footer__link-item" > Twitter< svg width = "13.5" height = "13.5" aria-hidden = "true" viewBox = "0 0 24 24" class = "iconExternalLink_nPIU" > < path fill = "currentColor" d = "M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z" > < / path > < / svg > < / a > < / li > < li class = "footer__item" > < a href = "https://goo.gle/devtools-youtube" target = "_blank" rel = "noopener noreferrer" class = "footer__link-item" > YouTube< svg width = "13.5" height = "13.5" aria-hidden = "true" viewBox = "0 0 24 24" class = "iconExternalLink_nPIU" > < path fill = "currentColor" d = "M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z" > < / path > < / svg > < / a > < / li > < / ul > < / div > < / div > < div class = "footer__bottom text--center" > < div class = "footer__copyright" > Copyright © 2023 Google, Inc.< / div > < / div > < / div > < / footer > < / div >
2023-02-15 10:38:59 +00:00
< script src = "/assets/js/runtime~main.410700f8.js" > < / script >
2023-02-14 21:42:45 +00:00
< script src = "/assets/js/main.583110df.js" > < / script >
2021-10-07 15:21:45 +00:00
< / body >
< / html >
