2022-07-01 15:15:07 +00:00
<!doctype html>
2023-11-29 13:34:30 +00:00
< html lang = "en" dir = "ltr" class = "docs-wrapper plugin-docs plugin-id-default docs-version-current docs-doc-page docs-doc-id-troubleshooting" data-has-hydrated = "false" >
2022-07-01 15:15:07 +00:00
< head >
< meta charset = "UTF-8" >
2024-03-20 15:05:54 +00:00
< meta name = "generator" content = "Docusaurus v3.1.1" >
2024-03-07 10:27:52 +00:00
< title data-rh = "true" > Troubleshooting | 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/next/troubleshooting" > < meta data-rh = "true" property = "og:locale" content = "en" > < meta data-rh = "true" name = "docsearch:language" content = "en" > < meta data-rh = "true" name = "docsearch:counter" content = "3" > < meta data-rh = "true" property = "og:title" content = "Troubleshooting | Puppeteer" > < meta data-rh = "true" name = "description" content = "To keep this page up-to-date we largely rely on community contributions." > < meta data-rh = "true" property = "og:description" content = "To keep this page up-to-date we largely rely on community contributions." > < link data-rh = "true" rel = "icon" href = "/img/favicon.ico" > < link data-rh = "true" rel = "canonical" href = "https://pptr.dev/next/troubleshooting" > < link data-rh = "true" rel = "alternate" href = "https://pptr.dev/next/troubleshooting" hreflang = "en" > < link data-rh = "true" rel = "alternate" href = "https://pptr.dev/next/troubleshooting" hreflang = "x-default" > < link data-rh = "true" rel = "preconnect" href = "https://DVKY664LG7-dsn.algolia.net" crossorigin = "anonymous" > < link rel = "search" type = "application/opensearchdescription+xml" title = "Puppeteer" href = "/opensearch.xml" >
2023-01-11 15:09:01 +00:00
2024-03-20 15:05:54 +00:00
< script src = "/fix-location.js" > < / script > < link rel = "stylesheet" href = "/assets/css/styles.6fb25b18.css" >
2024-04-05 13:15:22 +00:00
< script src = "/assets/js/runtime~main.3b04cf25.js" defer = "defer" > < / script >
< script src = "/assets/js/main.7e38f939.js" defer = "defer" > < / script >
2022-07-01 15:15:07 +00:00
< / head >
< body class = "navigation-with-keyboard" >
2024-04-05 13:15:22 +00:00
< script > ! function ( ) { function t ( t ) { document . documentElement . setAttribute ( "data-theme" , t ) } var e = function ( ) { try { return new URLSearchParams ( window . location . search ) . get ( "docusaurus-theme" ) } catch ( t ) { } } ( ) || function ( ) { try { return localStorage . getItem ( "theme" ) } catch ( t ) { } } ( ) ; t ( null !== e ? e : "light" ) } ( ) , function ( ) { try { const c = new URLSearchParams ( window . location . search ) . entries ( ) ; for ( var [ t , e ] of c ) if ( t . startsWith ( "docusaurus-data-" ) ) { var a = t . replace ( "docusaurus-data-" , "data-" ) ; document . documentElement . setAttribute ( a , e ) } } catch ( t ) { } } ( ) < / script > < div id = "__docusaurus" > < div role = "region" aria-label = "Skip to main content" > < a class = "skipToContent_fXgn" href = "#__docusaurus_skipToContent_fallback" > Skip to main content< / a > < / div > < nav aria-label = "Main" 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 = "themedComponent_mlkZ themedComponent--light_NVdE" > < img src = "https://user-images.githubusercontent.com/10379601/29446482-04f7036a-841f-11e7-9872-91d1fc2ea683.png" alt = "Puppeteer Logo" class = "themedComponent_mlkZ themedComponent--dark_xIcU" > < / div > < b class = "navbar__title text--truncate" > Puppeteer< / b > < / a > < a aria-current = "page" class = "navbar__item navbar__link navbar__link--active" href = "/next/" > Docs< / a > < a class = "navbar__item navbar__link" href = "/next/api/puppeteer.puppeteernode" > Puppeteer API< / a > < a class = "navbar__item navbar__link" href = "/next/browsers-api/" > @puppeteer/browsers 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 = "/next/" > Next< / a > < ul class = "dropdown__menu" > < li > < a aria-current = "page" class = "dropdown__link dropdown__link--active" href = "/next/troubleshooting" > Next< / a > < / li > < li > < a class = "dropdown__link" href = "/troubleshooting" > 22.6.3< / 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/puppeteer-v22.6.2/docs/api/index.md" target = "_blank" rel = "noopener noreferrer" class = "dropdown__link" > 22.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/puppeteer-v22.6.1/docs/api/index.md" target = "_blank" rel = "noopener noreferrer" class = "dropdown__link" > 22.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/puppeteer-v22.6.0/docs/api/index.md" target = "_blank" rel = "noopener noreferrer" class = "dropdown__link" > 22.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/puppeteer-v22.5.0/docs/api/index.md" target = "_blank" rel = "noopener noreferrer" class = "dropdown__link" > 22.5.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
2024-03-07 10:27:52 +00:00
< div class = "theme-admonition theme-admonition-note admonition_xJq3 alert alert--secondary" > < div class = "admonitionHeading_Gvgb" > < span class = "admonitionIcon_Rf37" > < svg viewBox = "0 0 14 16" > < path fill-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 > < div class = "admonitionContent_BuS1" > < p > To keep this page up-to-date we largely rely on community contributions.
2024-03-13 14:57:13 +00:00
Please send a PR if you notice something is no longer up-to-date.< / p > < / div > < / div >
< h2 class = "anchor anchorWithStickyNavbar_LWe7" id = "cannot-find-module-puppeteer-coreinternal" > < code > Cannot find module ' puppeteer-core/internal/...' < / code > < a href = "#cannot-find-module-puppeteer-coreinternal" class = "hash-link" aria-label = "Direct link to cannot-find-module-puppeteer-coreinternal" title = "Direct link to cannot-find-module-puppeteer-coreinternal" > < / a > < / h2 >
< p > This can occur if your Node.js version is lower than 14 or if you are using a
2022-10-19 08:43:26 +00:00
custom resolver (such as
< a href = "https://www.npmjs.com/package/jest-resolve" target = "_blank" rel = "noopener noreferrer" > < code > jest-resolve< / code > < / a > ). For the former,
we do not support deprecated versions of Node.js. For the latter, usually
upgrading the resolver (or its parent module such as < code > jest< / code > ) will work (e.g.
2024-03-13 14:57:13 +00:00
< a href = "https://github.com/puppeteer/puppeteer/issues/9121" target = "_blank" rel = "noopener noreferrer" > https://github.com/puppeteer/puppeteer/issues/9121< / a > )< / p >
< h2 class = "anchor anchorWithStickyNavbar_LWe7" id = "could-not-find-expected-browser-locally" > < code > Could not find expected browser locally< / code > < a href = "#could-not-find-expected-browser-locally" class = "hash-link" aria-label = "Direct link to could-not-find-expected-browser-locally" title = "Direct link to could-not-find-expected-browser-locally" > < / a > < / h2 >
< p > Starting from v19.0.0, Puppeteer will download browsers into
2022-10-19 08:43:26 +00:00
< code > ~/.cache/puppeteer< / code > using
< a href = "https://nodejs.org/api/os.html#oshomedir" target = "_blank" rel = "noopener noreferrer" > < code > os.homedir< / code > < / a > for better caching
between Puppeteer upgrades. Generally the home directory is well-defined (even
on Windows), but occasionally the home directory may not be available. In this
case, we provide the < code > PUPPETEER_CACHE_DIR< / code > variable which allows you to change
2024-03-13 14:57:13 +00:00
the installation directory.< / p >
< p > For example,< / 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" style = "color:#393A34;background-color:#f6f8fa" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token assign-left variable" style = "color:#36acaa" > PUPPETEER_CACHE_DIR< / span > < span class = "token operator" style = "color:#393A34" > =< / span > < span class = "token variable" style = "color:#36acaa" > $(< / span > < span class = "token variable builtin class-name" style = "color:#36acaa" > pwd< / span > < span class = "token variable" style = "color:#36acaa" > )< / span > < span class = "token plain" > < / span > < span class = "token function" style = "color:#d73a49" > npm< / span > < span class = "token plain" > < / span > < span class = "token function" style = "color:#d73a49" > install< / span > < span class = "token plain" > puppeteer< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > < / span > < span class = "token assign-left variable" style = "color:#36acaa" > PUPPETEER_CACHE_DIR< / span > < span class = "token operator" style = "color:#393A34" > =< / span > < span class = "token variable" style = "color:#36acaa" > $(< / span > < span class = "token variable builtin class-name" style = "color:#36acaa" > pwd< / span > < span class = "token variable" style = "color:#36acaa" > )< / span > < span class = "token plain" > < / span > < span class = "token function" style = "color:#d73a49" > node< / span > < span class = "token plain" > < / span > < span class = "token operator" style = "color:#393A34" > < < / span > < span class = "token plain" > script-path< / span > < span class = "token operator" 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 viewBox = "0 0 24 24" class = "copyButtonIcon_y97N" > < path fill = "currentColor" 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 viewBox = "0 0 24 24" class = "copyButtonSuccessIcon_LjdS" > < path fill = "currentColor" 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 create a configuration file named < 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" style = "color:#393A34;background-color:#f6f8fa" > < 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 doc-comment comment" style = "color:#999988;font-style:italic" > /**< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token doc-comment comment" style = "color:#999988;font-style:italic" > * < / span > < span class = "token doc-comment comment keyword" style = "color:#00009f;font-style:italic" > @type< / span > < span class = "token doc-comment comment" style = "color:#999988;font-style:italic" > < / span > < span class = "token doc-comment comment class-name punctuation" style = "color:#393A34;font-style:italic" > {< / span > < span class = "token doc-comment comment class-name keyword" style = "color:#00009f;font-style:italic" > import< / span > < span class = "token doc-comment comment class-name punctuation" style = "color:#393A34;font-style:italic" > (< / span > < span class = "token doc-comment comment class-name string" style = "color:#e3116c;font-style:italic" > " puppeteer" < / span > < span class = "token doc-comment comment class-name punctuation" style = "color:#393A34;font-style:italic" > )< / span > < span class = "token doc-comment comment class-name punctuation" style = "color:#393A34;font-style:italic" > .< / span > < span class = "token doc-comment comment class-name" style = "color:#999988;font-style:italic" > Configuration< / span > < span class = "token doc-comment comment class-name punctuation" style = "color:#393A34;font-style:italic" > }< / span > < span class = "token doc-comment comment" style = "color:#999988;font-style:italic" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token doc-comment 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 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 = "col
< p > You will need to reinstall < code > puppeteer< / code > in order for the configuration to take
2022-10-28 07:23:25 +00:00
effect. See < a href = "/next/guides/configuration" > Configuring Puppeteer< / a > for more
2024-03-13 14:57:13 +00:00
information.< / p >
< h2 class = "anchor anchorWithStickyNavbar_LWe7" id = "chrome-headless-doesnt-launch-on-windows" > Chrome headless doesn' t launch on Windows< a href = "#chrome-headless-doesnt-launch-on-windows" class = "hash-link" aria-label = "Direct link to Chrome headless doesn't launch on Windows" title = "Direct link to Chrome headless doesn't launch on Windows" > < / a > < / h2 >
< p > Some < a href = "https://support.google.com/chrome/a/answer/7532015" target = "_blank" rel = "noopener noreferrer" > chrome policies< / a > might
enforce running Chrome/Chromium with certain extensions.< / p >
< p > Puppeteer passes < code > --disable-extensions< / code > flag by default and will fail to launch
when such policies are active.< / p >
< p > To work around this, try running without the flag:< / 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" style = "color:#393A34;background-color:#f6f8fa" > < 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" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > ignoreDefaultArgs< / 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 string" style = "color:#e3116c" > ' --disable-extensions' < / 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 > < 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 viewBox = "0 0 24 24" class = "copyButtonIcon_y97N" > < path fill = "currentColor" 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 viewBox = "0 0 24 24" class = "copyButtonSuccessIcon_LjdS" > < path fill = "currentColor" d = "M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" > < / path > < / svg > < / span > < / button > < / div > < / div > < / div >
< blockquote >
2023-11-29 13:34:30 +00:00
< p > Context:
< a href = "https://github.com/puppeteer/puppeteer/issues/3681#issuecomment-447865342" target = "_blank" rel = "noopener noreferrer" > issue 3681< / a > .< / p >
2024-03-13 14:57:13 +00:00
< / blockquote >
< h2 class = "anchor anchorWithStickyNavbar_LWe7" id = "chrome-doesnt-launch-on-linux" > Chrome doesn' t launch on Linux< a href = "#chrome-doesnt-launch-on-linux" class = "hash-link" aria-label = "Direct link to Chrome doesn't launch on Linux" title = "Direct link to Chrome doesn't launch on Linux" > < / a > < / h2 >
< p > Make sure all the necessary dependencies are installed. You can run < code > ldd chrome | grep not< / code > on a Linux machine to check which dependencies are missing. The
2023-04-14 12:25:10 +00:00
common ones are provided below. Also, see
< a href = "https://source.chromium.org/chromium/chromium/src/+/main:chrome/installer/linux/debian/dist_package_versions.json" target = "_blank" rel = "noopener noreferrer" > https://source.chromium.org/chromium/chromium/src/+/main:chrome/installer/linux/debian/dist_package_versions.json< / a >
2024-03-13 14:57:13 +00:00
for the up-to-date list of dependencies declared by the Chrome installer.< / p >
< div class = "theme-admonition theme-admonition-caution admonition_xJq3 alert alert--warning" > < div class = "admonitionHeading_Gvgb" > < span class = "admonitionIcon_Rf37" > < svg viewBox = "0 0 16 16" > < path fill-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 > caution< / div > < div class = "admonitionContent_BuS1" > < p > Chrome currently does not provide arm64 binaries for Linux.
2024-03-07 10:27:52 +00:00
There are only arm64 binaries for Mac ARM.
2024-03-13 14:57:13 +00:00
That means that Linux binaries downloaded by default will not work on Linux arm64.< / p > < / div > < / div >
2023-11-29 13:34:30 +00:00
< details class = "details_lb9f alert alert--info details_b_Ee" data-collapsed = "true" > < summary > Debian (e.g. Ubuntu) Dependencies< / summary > < div > < div class = "collapsibleContent_i85q" > < div class = "codeBlockContainer_Ckt0 theme-code-block" style = "--prism-color:#393A34;--prism-background-color:#f6f8fa" > < div class = "codeBlockContent_biex" > < pre tabindex = "0" class = "prism-code language-text codeBlock_bY9V thin-scrollbar" style = "color:#393A34;background-color:#f6f8fa" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > ca-certificates< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > fonts-liberation< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libasound2< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libatk-bridge2.0-0< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libatk1.0-0< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libc6< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libcairo2< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libcups2< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libdbus-1-3< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libexpat1< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libfontconfig1< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libgbm1< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libgcc1< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libglib2.0-0< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libgtk-3-0< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libnspr4< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libnss3< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libpango-1.0-0< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libpangocairo-1.0-0< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libstdc++6< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libx11-6< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libx11-xcb1< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libxcb1< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libxcomposite1< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libxcursor1< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libxdamage1< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libxext6< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libxfixes3< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libxi6< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libxrandr2< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libxrender1< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libxss1< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libxtst6< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > lsb-release< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > wget< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "to
< details class = "details_lb9f alert alert--info details_b_Ee" data-collapsed = "true" > < summary > CentOS Dependencies< / summary > < div > < div class = "collapsibleContent_i85q" > < div class = "codeBlockContainer_Ckt0 theme-code-block" style = "--prism-color:#393A34;--prism-background-color:#f6f8fa" > < div class = "codeBlockContent_biex" > < pre tabindex = "0" class = "prism-code language-text codeBlock_bY9V thin-scrollbar" style = "color:#393A34;background-color:#f6f8fa" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > alsa-lib.x86_64< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > atk.x86_64< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > cups-libs.x86_64< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > gtk3.x86_64< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > ipa-gothic-fonts< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libXcomposite.x86_64< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libXcursor.x86_64< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libXdamage.x86_64< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libXext.x86_64< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libXi.x86_64< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libXrandr.x86_64< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libXScrnSaver.x86_64< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libXtst.x86_64< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > pango.x86_64< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > xorg-x11-fonts-100dpi< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > xorg-x11-fonts-75dpi< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > xorg-x11-fonts-cyrillic< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > xorg-x11-fonts-misc< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > xorg-x11-fonts-Type1< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > xorg-x11-utils< / 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 viewBox = "0 0 24 24" class = "copyButtonIcon_y97N" > < path fill = "currentColor" 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 viewBox = "0 0 24 24" class = "copyButtonSuccessIcon_LjdS" > < path fill = "currentColor" d = "M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" > < / path > < / svg > < / span > < / button > < / div > < / div > < / div > < p > After installing dependencies you need to update < code > nss< / code > library using this
command< / p > < div class = "codeBlockContainer_Ckt0 theme-code-block" style = "--prism-color:#393A34;--prism-background-color:#f6f8fa" > < div class = "codeBlockContent_biex" > < pre tabindex = "0" class = "prism-code language-text codeBlock_bY9V thin-scrollbar" style = "color:#393A34;background-color:#f6f8fa" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > yum update nss -y< / 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 viewBox = "0 0 24 24" class = "copyButtonIcon_y97N" > < path fill = "currentColor" 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 viewBox = "0 0 24 24" class = "copyButtonSuccessIcon_LjdS" > < path fill = "currentColor" d = "M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" > < / path > < / svg > < / span > < / button > < / div > < / div > < / div > < / div > < / div > < / details >
< details class = "details_lb9f alert alert--info details_b_Ee" data-collapsed = "true" > < summary > Check out discussions< / summary > < div > < div class = "collapsibleContent_i85q" > < ul >
< li > < a href = "https://github.com/puppeteer/puppeteer/issues/290" target = "_blank" rel = "noopener noreferrer" > #290< / a > - Debian
troubleshooting < br > < / li >
< li > < a href = "https://github.com/puppeteer/puppeteer/issues/391" target = "_blank" rel = "noopener noreferrer" > #391< / a > - CentOS
troubleshooting < br > < / li >
< li > < a href = "https://github.com/puppeteer/puppeteer/issues/379" target = "_blank" rel = "noopener noreferrer" > #379< / a > - Alpine
troubleshooting < br > < / li >
< / ul > < / div > < / div > < / details >
2024-03-07 10:27:52 +00:00
< h2 class = "anchor anchorWithStickyNavbar_LWe7" id = "chrome-headless-shell-disables-gpu-compositing" > chrome-headless-shell disables GPU compositing< a href = "#chrome-headless-shell-disables-gpu-compositing" class = "hash-link" aria-label = "Direct link to chrome-headless-shell disables GPU compositing" title = "Direct link to chrome-headless-shell disables GPU compositing" > < / a > < / h2 >
< p > chrome-headless-shell requires < code > --enable-gpu< / code > to
2023-11-29 13:34:30 +00:00
< a href = "https://crbug.com/1416283" target = "_blank" rel = "noopener noreferrer" > enable GPU acceleration in headless mode< / a > .< / p >
2024-03-07 10:27:52 +00:00
< 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" style = "color:#393A34;background-color:#f6f8fa" > < 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" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > headless< / span > < span class = "token operator" style = "color:#393A34" > :< / span > < span class = "token plain" > < / span > < span class = "token string" style = "color:#e3116c" > ' shell' < / 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" > args< / 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 string" style = "color:#e3116c" > ' --enable-gpu' < / 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 > < 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 viewBox = "0 0 24 24" class = "copyButtonIcon_y97N" > < path fill = "currentColor" 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 viewBox = "0 0 24 24" class = "copyButtonSuccessIcon_LjdS" > < path fill = "currentColor" d = "M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" > < / path > < / svg > < / span > < / button > < / div > < / div > < / div >
< h2 class = "anchor anchorWithStickyNavbar_LWe7" id = "setting-up-gpu-with-chrome" > Setting up GPU with Chrome< a href = "#setting-up-gpu-with-chrome" class = "hash-link" aria-label = "Direct link to Setting up GPU with Chrome" title = "Direct link to Setting up GPU with Chrome" > < / a > < / h2 >
< p > Generally, Chrome should be able to detect and enable GPU if the system has appropriate drivers.
For additional tips, see the following blog post < a href = "https://developer.chrome.com/blog/supercharge-web-ai-testing" target = "_blank" rel = "noopener noreferrer" > https://developer.chrome.com/blog/supercharge-web-ai-testing< / a > .< / p >
2023-11-29 13:34:30 +00:00
< h2 class = "anchor anchorWithStickyNavbar_LWe7" id = "setting-up-chrome-linux-sandbox" > Setting Up Chrome Linux Sandbox< a href = "#setting-up-chrome-linux-sandbox" class = "hash-link" aria-label = "Direct link to Setting Up Chrome Linux Sandbox" title = "Direct link to Setting Up Chrome Linux Sandbox" > < / a > < / h2 >
< p > In order to protect the host environment from untrusted web content, Chrome uses
2022-10-19 08:43:26 +00:00
< a href = "https://chromium.googlesource.com/chromium/src/+/HEAD/docs/linux/sandboxing.md" target = "_blank" rel = "noopener noreferrer" > multiple layers of sandboxing< / a > .
For this to work properly, the host should be configured first. If there' s no
good sandbox for Chrome to use, it will crash with the error
2023-11-29 13:34:30 +00:00
< code > No usable sandbox!< / code > .< / p >
< p > If you < strong > absolutely trust< / strong > the content you open in Chrome, you can launch
Chrome with the < code > --no-sandbox< / code > argument:< / 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" style = "color:#393A34;background-color:#f6f8fa" > < 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" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > args< / 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 string" style = "color:#e3116c" > ' --no-sandbox' < / span > < span class = "token punctuation" style = "color:#393A34" > ,< / span > < span class = "token plain" > < / span > < span class = "token string" style = "color:#e3116c" > ' --disable-setuid-sandbox' < / 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 > < 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 viewBox = "0 0 24 24" class = "copyButtonIcon_y97N" > < path fill = "currentColor" 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 viewBox = "0 0 24 24" class = "copyButtonSuccessIcon_LjdS" > < path fill = "currentColor" d = "M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" > < / path > < / svg > < / span > < / button > < / div > < / div > < / div >
< div class = "theme-admonition theme-admonition-caution admonition_xJq3 alert alert--warning" > < div class = "admonitionHeading_Gvgb" > < span class = "admonitionIcon_Rf37" > < svg viewBox = "0 0 16 16" > < path fill-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 > caution< / div > < div class = "admonitionContent_BuS1" > < p > Running without a sandbox is < strong > strongly discouraged< / strong > . Consider configuring a
sandbox instead.< / p > < / div > < / div >
< p > There are 2 ways to configure a sandbox in Chromium.< / p >
< h3 class = "anchor anchorWithStickyNavbar_LWe7" id = "recommended-enable-user-namespace-cloning" > [recommended] Enable < a href = "http://man7.org/linux/man-pages/man7/user_namespaces.7.html" target = "_blank" rel = "noopener noreferrer" > user namespace cloning< / a > < a href = "#recommended-enable-user-namespace-cloning" class = "hash-link" aria-label = "Direct link to recommended-enable-user-namespace-cloning" title = "Direct link to recommended-enable-user-namespace-cloning" > < / a > < / h3 >
< p > User namespace cloning is only supported by modern kernels. Unprivileged user
2022-10-19 08:43:26 +00:00
namespaces are generally fine to enable, but in some cases they open up more
kernel attack surface for (unsandboxed) non-root processes to elevate to kernel
2023-11-29 13:34:30 +00:00
privileges.< / 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" style = "color:#393A34;background-color:#f6f8fa" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token function" style = "color:#d73a49" > sudo< / span > < span class = "token plain" > < / span > < span class = "token function" style = "color:#d73a49" > sysctl< / span > < span class = "token plain" > < / span > < span class = "token parameter variable" style = "color:#36acaa" > -w< / span > < span class = "token plain" > < / span > < span class = "token assign-left variable" style = "color:#36acaa" > kernel.unprivileged_userns_clone< / span > < span class = "token operator" style = "color:#393A34" > =< / span > < span class = "token number" style = "color:#36acaa" > 1< / 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 viewBox = "0 0 24 24" class = "copyButtonIcon_y97N" > < path fill = "currentColor" 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 viewBox = "0 0 24 24" class = "copyButtonSuccessIcon_LjdS" > < path fill = "currentColor" 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 = "alternative-setup-setuid-sandbox" > [alternative] Setup < a href = "https://chromium.googlesource.com/chromium/src/+/HEAD/docs/linux/suid_sandbox_development.md" target = "_blank" rel = "noopener noreferrer" > setuid sandbox< / a > < a href = "#alternative-setup-setuid-sandbox" class = "hash-link" aria-label = "Direct link to alternative-setup-setuid-sandbox" title = "Direct link to alternative-setup-setuid-sandbox" > < / a > < / h3 >
< p > The setuid sandbox comes as a standalone executable and is located next to the
2024-02-12 22:52:16 +00:00
Chrome that Puppeteer downloads. It is fine to re-use the same sandbox
executable for different Chrome versions, so the following could be done only
2023-11-29 13:34:30 +00:00
once per host environment:< / p >
2024-02-12 22:52:16 +00:00
< 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" style = "color:#393A34;background-color:#f6f8fa" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token comment" style = "color:#999988;font-style:italic" > # cd to Puppeteer cache directory (adjust the path if using a different cache directory).< / span > < span class = "token plain" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > < / span > < span class = "token builtin class-name" > cd< / span > < span class = "token plain" > ~/.cache/puppeteer/chrome/linux-< / span > < span class = "token operator" style = "color:#393A34" > < < / span > < span class = "token plain" > version< / span > < span class = "token operator" style = "color:#393A34" > > < / span > < span class = "token plain" > /chrome-linux64/< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > < / span > < span class = "token function" style = "color:#d73a49" > sudo< / span > < span class = "token plain" > < / span > < span class = "token function" style = "color:#d73a49" > chown< / span > < span class = "token plain" > root:root chrome_sandbox< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > < / span > < span class = "token function" style = "color:#d73a49" > sudo< / span > < span class = "token plain" > < / span > < span class = "token function" style = "color:#d73a49" > chmod< / span > < span class = "token plain" > < / span > < span class = "token number" style = "color:#36acaa" > 4755< / span > < span class = "token plain" > chrome_sandbox< / 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" > # copy sandbox executable to a shared location< / span > < span class = "token plain" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > < / span > < span class = "token function" style = "color:#d73a49" > sudo< / span > < span class = "token plain" > < / span > < span class = "token function" style = "color:#d73a49" > cp< / span > < span class = "token plain" > < / span > < span class = "token parameter variable" style = "color:#36acaa" > -p< / span > < span class = "token plain" > chrome_sandbox /usr/local/sbin/chrome-devel-sandbox< / 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" > # export CHROME_DEVEL_SANDBOX env variable< / span > < span class = "token plain" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > < / span > < span class = "token builtin class-name" > export< / span > < span class = "token plain" > < / span > < span class = "token assign-left variable" style = "color:#36acaa" > CHROME_DEVEL_SANDBOX< / span > < span class = "token operator" style = "color:#393A34" > =< / span > < span class = "token plain" > /usr/local/sbin/chrome-devel-sandbox< / 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 viewBox = "0 0 24 24" class = "copyButtonIcon_y97N" > < path fill = "currentColor" 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 viewBox = "0 0 24 24" class = "copyButtonSuccessIcon_LjdS" > < path fill = "currentColor" d = "M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" > < / path > < / svg > < / span > < / button > < / div > < / div > < / div >
2023-11-29 13:34:30 +00:00
< p > You might want to export the < code > CHROME_DEVEL_SANDBOX< / code > env variable by default. In
this case, add the following to the < code > ~/.bashrc< / code > or < code > .zshenv< / code > :< / 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" style = "color:#393A34;background-color:#f6f8fa" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token builtin class-name" > export< / span > < span class = "token plain" > < / span > < span class = "token assign-left variable" style = "color:#36acaa" > CHROME_DEVEL_SANDBOX< / span > < span class = "token operator" style = "color:#393A34" > =< / span > < span class = "token plain" > /usr/local/sbin/chrome-devel-sandbox< / 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 viewBox = "0 0 24 24" class = "copyButtonIcon_y97N" > < path fill = "currentColor" 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 viewBox = "0 0 24 24" class = "copyButtonSuccessIcon_LjdS" > < path fill = "currentColor" d = "M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" > < / path > < / svg > < / span > < / button > < / div > < / div > < / div >
2024-02-12 22:52:16 +00:00
< p > or to your < code > Dockerfile< / code > :< / p >
< div class = "codeBlockContainer_Ckt0 theme-code-block" style = "--prism-color:#393A34;--prism-background-color:#f6f8fa" > < div class = "codeBlockContent_biex" > < pre tabindex = "0" class = "prism-code language-text codeBlock_bY9V thin-scrollbar" style = "color:#393A34;background-color:#f6f8fa" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > ENV CHROME_DEVEL_SANDBOX /usr/local/sbin/chrome-devel-sandbox< / 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 viewBox = "0 0 24 24" class = "copyButtonIcon_y97N" > < path fill = "currentColor" 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 viewBox = "0 0 24 24" class = "copyButtonSuccessIcon_LjdS" > < path fill = "currentColor" d = "M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" > < / path > < / svg > < / span > < / button > < / div > < / div > < / div >
2023-11-29 13:34:30 +00:00
< h2 class = "anchor anchorWithStickyNavbar_LWe7" id = "running-puppeteer-on-travis-ci" > Running Puppeteer on Travis CI< a href = "#running-puppeteer-on-travis-ci" class = "hash-link" aria-label = "Direct link to Running Puppeteer on Travis CI" title = "Direct link to Running Puppeteer on Travis CI" > < / a > < / h2 >
< blockquote >
< p > 👋 We ran our tests for Puppeteer on Travis CI until v6.0.0 (when we' ve
2022-10-19 08:43:26 +00:00
migrated to GitHub Actions) - see our historical
< a href = "https://github.com/puppeteer/puppeteer/blob/v5.5.0/.travis.yml" target = "_blank" rel = "noopener noreferrer" > < code > .travis.yml< / code > (v5.5.0)< / a >
2023-11-29 13:34:30 +00:00
for reference.< / p >
< / blockquote >
< p > Tips-n-tricks:< / p >
< ul >
< li > < a href = "https://en.wikipedia.org/wiki/Xvfb" target = "_blank" rel = "noopener noreferrer" > xvfb< / a > service should be launched in order
to run Chromium in non-headless mode< / li >
< li > Runs on Xenial Linux on Travis by default< / li >
< li > Runs < code > npm install< / code > by default< / li >
< li > < code > node_modules< / code > is cached by default< / li >
< / ul >
< p > < code > .travis.yml< / code > might look like this:< / p >
< div class = "language-yml codeBlockContainer_Ckt0 theme-code-block" style = "--prism-color:#393A34;--prism-background-color:#f6f8fa" > < div class = "codeBlockContent_biex" > < pre tabindex = "0" class = "prism-code language-yml codeBlock_bY9V thin-scrollbar" style = "color:#393A34;background-color:#f6f8fa" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token key atrule" style = "color:#00a4db" > language< / span > < span class = "token punctuation" style = "color:#393A34" > :< / span > < span class = "token plain" > node_js< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > < / span > < span class = "token key atrule" style = "color:#00a4db" > node_js< / span > < span class = "token punctuation" style = "color:#393A34" > :< / span > < span class = "token plain" > node< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > < / span > < span class = "token key atrule" style = "color:#00a4db" > services< / span > < span class = "token punctuation" style = "color:#393A34" > :< / span > < span class = "token plain" > xvfb< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > < / span > < span class = "token key atrule" style = "color:#00a4db" > script< / 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 plain" > npm test< / 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 viewBox = "0 0 24 24" class = "copyButtonIcon_y97N" > < path fill = "currentColor" 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 viewBox = "0 0 24 24" class = "copyButtonSuccessIcon_LjdS" > < path fill = "currentColor" d = "M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" > < / path > < / svg > < / span > < / button > < / div > < / div > < / div >
< h2 class = "anchor anchorWithStickyNavbar_LWe7" id = "running-puppeteer-on-wsl-windows-subsystem-for-linux" > Running Puppeteer on WSL (Windows subsystem for Linux)< a href = "#running-puppeteer-on-wsl-windows-subsystem-for-linux" class = "hash-link" aria-label = "Direct link to Running Puppeteer on WSL (Windows subsystem for Linux)" title = "Direct link to Running Puppeteer on WSL (Windows subsystem for Linux)" > < / a > < / h2 >
< p > See < a href = "https://github.com/puppeteer/puppeteer/issues/1837" target = "_blank" rel = "noopener noreferrer" > this thread< / a > with some
2023-01-24 13:12:33 +00:00
tips specific to WSL. In a nutshell, you need to install missing dependencies by
2023-11-29 13:34:30 +00:00
either:< / p >
< ol >
< li > < a href = "https://learn.microsoft.com/en-us/windows/wsl/tutorials/gui-apps#install-google-chrome-for-linux" target = "_blank" rel = "noopener noreferrer" > Installing Chrome on WSL to install all dependencies< / a > < / li >
< li > Installing required dependencies manually:
< code > sudo apt install libgtk-3-dev libnotify-dev libgconf-2-4 libnss3 libxss1 libasound2< / code > .< / li >
< / ol >
< div class = "theme-admonition theme-admonition-caution admonition_xJq3 alert alert--warning" > < div class = "admonitionHeading_Gvgb" > < span class = "admonitionIcon_Rf37" > < svg viewBox = "0 0 16 16" > < path fill-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 > caution< / div > < div class = "admonitionContent_BuS1" > < p > The list of required dependencies might get outdated and depend on what you
already have installed.< / p > < / div > < / div >
< h2 class = "anchor anchorWithStickyNavbar_LWe7" id = "running-puppeteer-on-circleci" > Running Puppeteer on CircleCI< a href = "#running-puppeteer-on-circleci" class = "hash-link" aria-label = "Direct link to Running Puppeteer on CircleCI" title = "Direct link to Running Puppeteer on CircleCI" > < / a > < / h2 >
< p > Running Puppeteer smoothly on CircleCI requires the following steps:< / p >
< ol >
< li > Start with a
2022-10-19 08:43:26 +00:00
< a href = "https://circleci.com/docs/2.0/circleci-images/#nodejs" target = "_blank" rel = "noopener noreferrer" > NodeJS image< / a > in your
2023-11-29 13:34:30 +00:00
config like so:<!-- -->
< div class = "language-yaml codeBlockContainer_Ckt0 theme-code-block" style = "--prism-color:#393A34;--prism-background-color:#f6f8fa" > < div class = "codeBlockContent_biex" > < pre tabindex = "0" class = "prism-code language-yaml codeBlock_bY9V thin-scrollbar" style = "color:#393A34;background-color:#f6f8fa" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token key atrule" style = "color:#00a4db" > docker< / 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 plain" > < / span > < span class = "token key atrule" style = "color:#00a4db" > image< / span > < span class = "token punctuation" style = "color:#393A34" > :< / span > < span class = "token plain" > circleci/node< / span > < span class = "token punctuation" style = "color:#393A34" > :< / span > < span class = "token number" style = "color:#36acaa" > 14< / span > < span class = "token plain" > < / span > < span class = "token comment" style = "color:#999988;font-style:italic" > # Use your desired version< / span > < span class = "token plain" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > < / span > < span class = "token key atrule" style = "color:#00a4db" > environment< / 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 key atrule" style = "color:#00a4db" > NODE_ENV< / span > < span class = "token punctuation" style = "color:#393A34" > :< / span > < span class = "token plain" > development < / span > < span class = "token comment" style = "color:#999988;font-style:italic" > # Only needed if puppeteer is in `devDependencies`< / 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 viewBox = "0 0 24 24" class = "copyButtonIcon_y97N" > < path fill = "currentColor" 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 viewBox = "0 0 24 24" class = "copyButtonSuccessIcon_LjdS" > < path fill = "currentColor" d = "M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" > < / path > < / svg > < / span > < / button > < / div > < / div > < / div >
< / li >
< li > Dependencies like < code > libXtst6< / code > probably need to be installed via < code > apt-get< / code > , so
2022-10-19 08:43:26 +00:00
use the
2022-07-01 15:15:07 +00:00
< a href = "https://circleci.com/orbs/registry/orb/threetreeslight/puppeteer" target = "_blank" rel = "noopener noreferrer" > threetreeslight/puppeteer< / a >
orb
(< a href = "https://circleci.com/orbs/registry/orb/threetreeslight/puppeteer#quick-start" target = "_blank" rel = "noopener noreferrer" > instructions< / a > ),
or paste parts of its
< a href = "https://circleci.com/orbs/registry/orb/threetreeslight/puppeteer#orb-source" target = "_blank" rel = "noopener noreferrer" > source< / a >
2023-11-29 13:34:30 +00:00
into your own config.< / li >
< li > Lastly, if you’
error spawning child processes:<!-- -->
< div class = "codeBlockContainer_Ckt0 theme-code-block" style = "--prism-color:#393A34;--prism-background-color:#f6f8fa" > < div class = "codeBlockContent_biex" > < pre tabindex = "0" class = "prism-code language-text codeBlock_bY9V thin-scrollbar" style = "color:#393A34;background-color:#f6f8fa" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > [00:00.0] jest args: --e2e --spec --max-workers=36< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > Error: spawn ENOMEM< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > at ChildProcess.spawn (internal/child_process.js:394:11)< / 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 viewBox = "0 0 24 24" class = "copyButtonIcon_y97N" > < path fill = "currentColor" 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 viewBox = "0 0 24 24" class = "copyButtonSuccessIcon_LjdS" > < path fill = "currentColor" d = "M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" > < / path > < / svg > < / span > < / button > < / div > < / div > < / div >
<!-- --> This is likely caused by Jest autodetecting the number of processes on the
2022-10-19 08:43:26 +00:00
entire machine (< code > 36< / code > ) rather than the number allowed to your container (< code > 2< / code > ).
2023-11-29 13:34:30 +00:00
To fix this, set < code > jest --maxWorkers=2< / code > in your test command.< / li >
< / ol >
< h2 class = "anchor anchorWithStickyNavbar_LWe7" id = "running-puppeteer-in-docker" > Running Puppeteer in Docker< a href = "#running-puppeteer-in-docker" class = "hash-link" aria-label = "Direct link to Running Puppeteer in Docker" title = "Direct link to Running Puppeteer in Docker" > < / a > < / h2 >
< blockquote >
< p > 👋 We used < a href = "https://cirrus-ci.org/" target = "_blank" rel = "noopener noreferrer" > Cirrus Ci< / a > to run our tests for Puppeteer
2022-10-19 08:43:26 +00:00
in a Docker container until v3.0.x - see our historical
< a href = "https://github.com/puppeteer/puppeteer/blob/v3.0.1/.ci/node12/Dockerfile.linux" target = "_blank" rel = "noopener noreferrer" > < code > Dockerfile.linux< / code > (v3.0.1)< / a >
for reference. Starting from v16.0.0 we are shipping a Docker image via the
GitHub registry. The Dockerfile is located
< a href = "https://github.com/puppeteer/puppeteer/blob/main/docker/Dockerfile" target = "_blank" rel = "noopener noreferrer" > here< / a > and
the usage instructions are in the
< a href = "https://github.com/puppeteer/puppeteer#running-in-docker" target = "_blank" rel = "noopener noreferrer" > README.md< / a > . The
2023-11-29 13:34:30 +00:00
instructions below might be still helpful if you are building your own image.< / p >
< / blockquote >
< p > Getting headless Chrome up and running in Docker can be tricky. The bundled
2022-10-19 08:43:26 +00:00
Chromium that Puppeteer installs is missing the necessary shared library
2023-11-29 13:34:30 +00:00
dependencies.< / p >
< p > To fix, you' ll need to install the missing dependencies and the latest Chromium
package in your Dockerfile:< / p >
< div class = "language-Dockerfile language-dockerfile codeBlockContainer_Ckt0 theme-code-block" style = "--prism-color:#393A34;--prism-background-color:#f6f8fa" > < div class = "codeBlockContent_biex" > < pre tabindex = "0" class = "prism-code language-dockerfile codeBlock_bY9V thin-scrollbar" style = "color:#393A34;background-color:#f6f8fa" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > FROM node:14-slim< / 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" > # Install latest chrome dev package and fonts to support major charsets (Chinese, Japanese, Arabic, Hebrew, Thai and a few others)< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > # Note: this installs the necessary libs to make the bundled version of Chromium that Puppeteer< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > # installs, work.< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > RUN apt-get update \< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > & & apt-get install -y wget gnupg \< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > & & wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | apt-key add - \< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > & & sh -c ' echo " deb [arch=amd64] http://dl.google.com/linux/chrome/deb/ stable main" > > /etc/apt/sources.list.d/google.list' \< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > & & apt-get update \< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > & & apt-get install -y google-chrome-stable fonts-ipafont-gothic fonts-wqy-zenhei fonts-thai-tlwg fonts-kacst fonts-freefont-ttf libxss1 \< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > --no-install-recommends \< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > & & rm -rf /var/lib/apt/lists/*< / 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" > # If running Docker > = 1.13.0 use docker run' s --init arg to reap zombie processes, otherwise< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > # uncomment the following lines to have `dumb-init` as PID 1< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > # ADD https://github.com/Yelp/dumb-init/releases/download/v1.2.2/dumb-init_1.2.2_x86_64 /usr/local/bin/dumb-init< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > # RUN chmod +x /usr/local/bin/dumb-init< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > # ENTRYPOINT [" dumb-init" , " --" ]< / 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" > # Uncomment to skip the chromium download when installing puppeteer. If you do,< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > # you' ll need to launch puppeteer with:< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > # browser.launch({executablePath: ' google-chrome-stable' })< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > # ENV PUPPETEER_SKIP_DOWNLOAD true< / span > < br > < / span > < span class = "token-line" style
< p > Build the container:< / 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" style = "color:#393A34;background-color:#f6f8fa" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token function" style = "color:#d73a49" > docker< / span > < span class = "token plain" > build < / span > < span class = "token parameter variable" style = "color:#36acaa" > -t< / span > < span class = "token plain" > puppeteer-chrome-linux < / span > < span class = "token builtin class-name" > .< / 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 viewBox = "0 0 24 24" class = "copyButtonIcon_y97N" > < path fill = "currentColor" 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 viewBox = "0 0 24 24" class = "copyButtonSuccessIcon_LjdS" > < path fill = "currentColor" d = "M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" > < / path > < / svg > < / span > < / button > < / div > < / div > < / div >
< p > Run the container by passing < code > node -e " < yourscript.js content as a string> " < / code > as
the command:< / 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" style = "color:#393A34;background-color:#f6f8fa" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > < / span > < span class = "token function" style = "color:#d73a49" > docker< / span > < span class = "token plain" > run < / span > < span class = "token parameter variable" style = "color:#36acaa" > -i< / span > < span class = "token plain" > < / span > < span class = "token parameter variable" style = "color:#36acaa" > --init< / span > < span class = "token plain" > < / span > < span class = "token parameter variable" style = "color:#36acaa" > --rm< / span > < span class = "token plain" > --cap-add< / span > < span class = "token operator" style = "color:#393A34" > =< / span > < span class = "token plain" > SYS_ADMIN < / 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 parameter variable" style = "color:#36acaa" > --name< / span > < span class = "token plain" > puppeteer-chrome puppeteer-chrome-linux < / 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 function" style = "color:#d73a49" > node< / span > < span class = "token plain" > < / span > < span class = "token parameter variable" style = "color:#36acaa" > -e< / span > < span class = "token plain" > < / span > < span class = "token string" style = "color:#e3116c" > " < / span > < span class = "token string variable" style = "color:#36acaa" > `< / span > < span class = "token string variable function" style = "color:#d73a49" > cat< / span > < span class = "token string variable" style = "color:#36acaa" > yourscript.js< / span > < span class = "token string variable" style = "color:#36acaa" > `< / span > < span class = "token string" style = "color:#e3116c" > " < / 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 viewBox = "0 0 24 24" class = "copyButtonIcon_y97N" > < path fill = "currentColor" 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 viewBox = "0 0 24 24" class = "copyButtonSuccessIcon_LjdS" > < path fill = "currentColor" d = "M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" > < / path > < / svg > < / span > < / button > < / div > < / div > < / div >
< p > There' s a full example at < a href = "https://github.com/ebidel/try-puppeteer" target = "_blank" rel = "noopener noreferrer" > https://github.com/ebidel/try-puppeteer< / a > that shows how
to run this Dockerfile from a webserver running on App Engine Flex (Node).< / p >
< h3 class = "anchor anchorWithStickyNavbar_LWe7" id = "running-on-alpine" > Running on Alpine< a href = "#running-on-alpine" class = "hash-link" aria-label = "Direct link to Running on Alpine" title = "Direct link to Running on Alpine" > < / a > < / h3 >
< p > The
2022-10-19 08:43:26 +00:00
< a href = "https://pkgs.alpinelinux.org/package/edge/community/x86_64/chromium" target = "_blank" rel = "noopener noreferrer" > newest Chromium package< / a >
supported on Alpine is 100, which corresponds to
2023-11-29 13:34:30 +00:00
< a href = "https://github.com/puppeteer/puppeteer/releases/tag/v13.5.0" target = "_blank" rel = "noopener noreferrer" > Puppeteer v13.5.0< / a > .< / p >
< p > Example Dockerfile:< / p >
< div class = "language-Dockerfile language-dockerfile codeBlockContainer_Ckt0 theme-code-block" style = "--prism-color:#393A34;--prism-background-color:#f6f8fa" > < div class = "codeBlockContent_biex" > < pre tabindex = "0" class = "prism-code language-dockerfile codeBlock_bY9V thin-scrollbar" style = "color:#393A34;background-color:#f6f8fa" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > FROM alpine< / 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" > # Installs latest Chromium (100) package.< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > RUN apk add --no-cache \< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > chromium \< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > nss \< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > freetype \< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > harfbuzz \< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > ca-certificates \< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > ttf-freefont \< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > nodejs \< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > yarn< / 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 > < 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" > # Tell Puppeteer to skip installing Chrome. We' ll be using the installed package.< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > ENV PUPPETEER_EXECUTABLE_PATH=/usr/bin/chromium-browser< / 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" > # Puppeteer v13.5.0 works with Chromium 100.< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > RUN yarn add puppeteer@13.5.0< / 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" > # Add user so we don' t need --no-sandbox.< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > RUN addgroup -S pptruser & & adduser -S -G pptruser pptruser \< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > & & mkdir -p /home/pptruser/Downloads /app \< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > & & chown -R pptruser:pptruser /home/pptruser \< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > & & chown -R pptruser:pptruser /app< / 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" > # Run everything after as non-privileged user.< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > USER pptruser< / 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" > < sp
< h2 class = "anchor anchorWithStickyNavbar_LWe7" id = "running-puppeteer-on-gitlabci" > Running Puppeteer on GitlabCI< a href = "#running-puppeteer-on-gitlabci" class = "hash-link" aria-label = "Direct link to Running Puppeteer on GitlabCI" title = "Direct link to Running Puppeteer on GitlabCI" > < / a > < / h2 >
< p > This is very similar to some of the instructions above, but require a bit
different configuration to finally achieve success.< / p >
< p > Usually the issue looks like this:< / 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" style = "color:#393A34;background-color:#f6f8fa" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > Error: Failed to launch chrome< / span > < span class = "token operator" style = "color:#393A34" > !< / span > < span class = "token plain" > spawn /usr/bin/chromium-browser ENOENT< / 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 viewBox = "0 0 24 24" class = "copyButtonIcon_y97N" > < path fill = "currentColor" 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 viewBox = "0 0 24 24" class = "copyButtonSuccessIcon_LjdS" > < path fill = "currentColor" 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 need to patch two places:< / p >
< ol >
< li > Your < code > gitlab-ci.yml< / code > config< / li >
< li > Arguments' list when launching puppeteer< / li >
< / ol >
< p > In < code > gitlab-ci.yml< / code > we need to install some packages to make it possible to
launch headless Chrome in your docker env:< / p >
< div class = "language-yml codeBlockContainer_Ckt0 theme-code-block" style = "--prism-color:#393A34;--prism-background-color:#f6f8fa" > < div class = "codeBlockContent_biex" > < pre tabindex = "0" class = "prism-code language-yml codeBlock_bY9V thin-scrollbar" style = "color:#393A34;background-color:#f6f8fa" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token key atrule" style = "color:#00a4db" > before_script< / 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 plain" > apt< / span > < span class = "token punctuation" style = "color:#393A34" > -< / span > < span class = "token plain" > get update< / 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 plain" > apt< / span > < span class = "token punctuation" style = "color:#393A34" > -< / span > < span class = "token plain" > get install < / span > < span class = "token punctuation" style = "color:#393A34" > -< / span > < span class = "token plain" > yq gconf< / span > < span class = "token punctuation" style = "color:#393A34" > -< / span > < span class = "token plain" > service libasound2 libatk1.0< / span > < span class = "token punctuation" style = "color:#393A34" > -< / span > < span class = "token plain" > 0 libc6 libcairo2< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libcups2 libdbus< / span > < span class = "token punctuation" style = "color:#393A34" > -< / span > < span class = "token plain" > 1< / span > < span class = "token punctuation" style = "color:#393A34" > -< / span > < span class = "token plain" > 3 libexpat1 libfontconfig1 libgcc1 libgconf< / span > < span class = "token punctuation" style = "color:#393A34" > -< / span > < span class = "token plain" > 2< / span > < span class = "token punctuation" style = "color:#393A34" > -< / span > < span class = "token number" style = "color:#36acaa" > 4< / span > < span class = "token plain" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libgdk< / span > < span class = "token punctuation" style = "color:#393A34" > -< / span > < span class = "token plain" > pixbuf2.0< / span > < span class = "token punctuation" style = "color:#393A34" > -< / span > < span class = "token plain" > 0 libglib2.0< / span > < span class = "token punctuation" style = "color:#393A34" > -< / span > < span class = "token plain" > 0 libgtk< / span > < span class = "token punctuation" style = "color:#393A34" > -< / span > < span class = "token plain" > 3< / span > < span class = "token punctuation" style = "color:#393A34" > -< / span > < span class = "token plain" > 0 libnspr4 libpango< / span > < span class = "token punctuation" style = "color:#393A34" > -< / span > < span class = "token plain" > 1.0< / span > < span class = "token punctuation" style = "color:#393A34" > -< / span > < span class = "token number" style = "color:#36acaa" > 0< / span > < span class = "token plain" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libpangocairo< / span > < span class = "token punctuation" style = "color:#393A34" > -< / span > < span class = "token plain" > 1.0< / span > < span class = "token punctuation" style = "color:#393A34" > -< / span > < span class = "token plain" > 0 libstdc++6 libx11< / span > < span class = "token punctuation" style = "color:#393A34" > -< / span > < span class = "token plain" > 6 libx11< / span > < span class = "token punctuation" style = "color:#393A34" > -< / span > < span class = "token plain" > xcb1 libxcb1 libxcomposite1< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libxcursor1 libxdamage1 libxext6 libxfixes3 libxi6 libxrandr2 libxrender1< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > libxss1 libxtst6 ca< / span > < span class = "token punctuation" style = "color:#393A34" > -< / span > < span class = "token plain" > certificates fonts< / span > < span class = "token punctuation" style = "color:#393A34" > -< / span > < span class = "token plain" > liberation libnss3 lsb< / span > < span class = "token punctuation" style = "color:#393A34" > -< / span > < span class = "token plain" > release
< p > Next, you have to use < code > ' --no-sandbox' < / code > mode and also
2022-10-19 08:43:26 +00:00
< code > ' --disable-setuid-sandbox' < / code > when launching Puppeteer. This can be done by
passing them as an arguments to your < code > .launch()< / code > call:
2023-11-29 13:34:30 +00:00
< code > puppeteer.launch({ args: [' --no-sandbox' , ' --disable-setuid-sandbox' ] });< / code > .< / p >
2024-02-21 08:09:50 +00:00
< h2 class = "anchor anchorWithStickyNavbar_LWe7" id = "running-puppeteer-on-google-cloud-run" > Running Puppeteer on Google Cloud Run< a href = "#running-puppeteer-on-google-cloud-run" class = "hash-link" aria-label = "Direct link to Running Puppeteer on Google Cloud Run" title = "Direct link to Running Puppeteer on Google Cloud Run" > < / a > < / h2 >
< p > Google Cloud Run disables the CPU by default, after an HTTP response is written to the client. This means that puppeteer will appear extremely slow (taking 1-5 minutes to launch), if you " run puppeteer in the background" after your response has been written.< / p >
< p > So this simple express app will be percievably slow:< / 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" style = "color:#393A34;background-color:#f6f8fa" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token keyword module" style = "color:#00009f" > import< / span > < span class = "token plain" > < / span > < span class = "token imports" > express< / span > < span class = "token plain" > < / span > < span class = "token keyword module" style = "color:#00009f" > from< / span > < span class = "token plain" > < / span > < span class = "token string" style = "color:#e3116c" > ' express' < / 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" > const< / span > < span class = "token plain" > app < / span > < span class = "token operator" style = "color:#393A34" > =< / span > < span class = "token plain" > < / span > < span class = "token function" style = "color:#d73a49" > express< / 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" > app< / span > < span class = "token punctuation" style = "color:#393A34" > .< / span > < span class = "token method function property-access" style = "color:#d73a49" > post< / span > < span class = "token punctuation" style = "color:#393A34" > (< / span > < span class = "token string" style = "color:#e3116c" > ' /test-puppeteer' < / span > < span class = "token punctuation" style = "color:#393A34" > ,< / span > < span class = "token plain" > < / span > < span class = "token punctuation" style = "color:#393A34" > (< / span > < span class = "token parameter" > req< / span > < span class = "token parameter punctuation" style = "color:#393A34" > ,< / span > < span class = "token parameter" > res< / span > < span class = "token punctuation" style = "color:#393A34" > )< / span > < span class = "token plain" > < / span > < span class = "token arrow 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" > res< / span > < span class = "token punctuation" style = "color:#393A34" > .< / span > < span class = "token method function property-access" style = "color:#d73a49" > json< / 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 literal-property property" style = "color:#36acaa" > jobId< / span > < span class = "token operator" style = "color:#393A34" > :< / span > < span class = "token plain" > < / span > < span class = "token number" style = "color:#36acaa" > 123< / 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 literal-property property" style = "color:#36acaa" > acknowledged< / span > < span class = "token operator" style = "color:#393A34" > :< / span > < span class = "token plain" > < / span > < span class = "token boolean" style = "color:#36acaa" > true< / 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 > < sp
< p > It is slow because CPU is disabled on GCR because puppeteer is launched after the response is sent. What you want to do is this:< / 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" style = "color:#393A34;background-color:#f6f8fa" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > app< / span > < span class = "token punctuation" style = "color:#393A34" > .< / span > < span class = "token method function property-access" style = "color:#d73a49" > post< / span > < span class = "token punctuation" style = "color:#393A34" > (< / span > < span class = "token string" style = "color:#e3116c" > ' /test-puppeteer' < / span > < span class = "token punctuation" style = "color:#393A34" > ,< / span > < span class = "token plain" > < / span > < span class = "token punctuation" style = "color:#393A34" > (< / span > < span class = "token parameter" > req< / span > < span class = "token parameter punctuation" style = "color:#393A34" > ,< / span > < span class = "token parameter" > res< / span > < span class = "token punctuation" style = "color:#393A34" > )< / span > < span class = "token plain" > < / span > < span class = "token arrow 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" > puppeteer< / span > < span class = "token punctuation" style = "color:#393A34" > .< / span > < span class = "token method function property-access" 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 method function property-access" style = "color:#d73a49" > then< / span > < span class = "token punctuation" style = "color:#393A34" > (< / span > < span class = "token parameter" > browser< / span > < span class = "token plain" > < / span > < span class = "token arrow 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" > // A second later...< / span > < span class = "token plain" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > res< / span > < span class = "token punctuation" style = "color:#393A34" > .< / span > < span class = "token method function property-access" style = "color:#d73a49" > json< / 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 literal-property property" style = "color:#36acaa" > jobId< / span > < span class = "token operator" style = "color:#393A34" > :< / span > < span class = "token plain" > < / span > < span class = "token number" style = "color:#36acaa" > 123< / 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 literal-property property" style = "color:#36acaa" > acknowledged< / span > < span class = "token operator" style = "color:#393A34" > :< / span > < span class = "token plain" > < / span > < span class = "token boolean" style = "color:#36acaa" > true< / 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 > < 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 = "col
< p > If you want to run the stuff in the background, you need to " enable CPU always" even after responses are sent. That should fix it.< / p >
2023-11-29 13:34:30 +00:00
< h4 class = "anchor anchorWithStickyNavbar_LWe7" id = "tips" > Tips< a href = "#tips" class = "hash-link" aria-label = "Direct link to Tips" title = "Direct link to Tips" > < / a > < / h4 >
< p > By default, Docker runs a container with a < code > /dev/shm< / code > shared memory space 64MB.
2022-10-19 08:43:26 +00:00
This is < a href = "https://github.com/c0b/chrome-in-docker/issues/1" target = "_blank" rel = "noopener noreferrer" > typically too small< / a >
for Chrome and will cause Chrome to crash when rendering large pages. To fix,
run the container with < code > docker run --shm-size=1gb< / code > to increase the size of
< code > /dev/shm< / code > . Since Chrome 65, this is no longer necessary. Instead, launch the
2023-11-29 13:34:30 +00:00
browser with the < code > --disable-dev-shm-usage< / code > flag:< / 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" style = "color:#393A34;background-color:#f6f8fa" > < 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" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token plain" > args< / 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 string" style = "color:#e3116c" > ' --disable-dev-shm-usage' < / 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 > < 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 viewBox = "0 0 24 24" class = "copyButtonIcon_y97N" > < path fill = "currentColor" 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 viewBox = "0 0 24 24" class = "copyButtonSuccessIcon_LjdS" > < path fill = "currentColor" d = "M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" > < / path > < / svg > < / span > < / button > < / div > < / div > < / div >
< p > This will write shared memory files into < code > /tmp< / code > instead of < code > /dev/shm< / code > . See
2022-10-19 08:43:26 +00:00
< a href = "https://bugs.chromium.org/p/chromium/issues/detail?id=736452" target = "_blank" rel = "noopener noreferrer" > crbug.com/736452< / a >
2023-11-29 13:34:30 +00:00
for more details.< / p >
< p > Seeing other weird errors when launching Chrome? Try running your container with
2022-10-19 08:43:26 +00:00
< code > docker run --cap-add=SYS_ADMIN< / code > when developing locally. Since the Dockerfile
adds a < code > pptr< / code > user as a non-privileged user, it may not have all the necessary
2023-11-29 13:34:30 +00:00
privileges.< / p >
< p > < a href = "https://github.com/Yelp/dumb-init" target = "_blank" rel = "noopener noreferrer" > dumb-init< / a > is worth checking out if you' re
2022-07-01 15:15:07 +00:00
experiencing a lot of zombies Chrome processes sticking around. There' s special
treatment for processes with PID=1, which makes it hard to terminate Chrome
2023-11-29 13:34:30 +00:00
properly in some cases (e.g. in Docker).< / p >
< h2 class = "anchor anchorWithStickyNavbar_LWe7" id = "running-puppeteer-in-the-cloud" > Running Puppeteer in the cloud< a href = "#running-puppeteer-in-the-cloud" class = "hash-link" aria-label = "Direct link to Running Puppeteer in the cloud" title = "Direct link to Running Puppeteer in the cloud" > < / a > < / h2 >
< h3 class = "anchor anchorWithStickyNavbar_LWe7" id = "running-puppeteer-on-google-app-engine" > Running Puppeteer on Google App Engine< a href = "#running-puppeteer-on-google-app-engine" class = "hash-link" aria-label = "Direct link to Running Puppeteer on Google App Engine" title = "Direct link to Running Puppeteer on Google App Engine" > < / a > < / h3 >
< p > The Node.js runtime of the
2022-10-19 08:43:26 +00:00
< a href = "https://cloud.google.com/appengine/docs/standard/nodejs/" target = "_blank" rel = "noopener noreferrer" > App Engine standard environment< / a >
2023-11-29 13:34:30 +00:00
comes with all system packages needed to run Headless Chrome.< / p >
< p > To use < code > puppeteer< / code > , specify the module as a dependency in your < code > package.json< / code >
2023-11-17 09:26:24 +00:00
and then override the puppeteer cache directory by including a file named
2023-11-29 13:34:30 +00:00
< code > .puppeteerrc.cjs< / code > at the root of your application with the contents:< / 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" style = "color:#393A34;background-color:#f6f8fa" > < 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 keyword" style = "color:#00009f" > 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 doc-comment comment" style = "color:#999988;font-style:italic" > /**< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token doc-comment comment" style = "color:#999988;font-style:italic" > * < / span > < span class = "token doc-comment comment keyword" style = "color:#00009f;font-style:italic" > @type< / span > < span class = "token doc-comment comment" style = "color:#999988;font-style:italic" > < / span > < span class = "token doc-comment comment punctuation" style = "color:#393A34;font-style:italic" > {< / span > < span class = "token doc-comment comment" style = "color:#999988;font-style:italic" > import(" puppeteer" ).Configuration< / span > < span class = "token doc-comment comment punctuation" style = "color:#393A34;font-style:italic" > }< / span > < span class = "token doc-comment comment" style = "color:#999988;font-style:italic" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token doc-comment 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 plain" > exports < / 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" > 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" > ' node_modules' < / span > < span class = "token punctuation" style = "color:#393A34" > ,< / span > < span class = "token plain" > < / span > < span class = "token string" style = "color:#e3116c" > ' .puppeteer_cache' < / 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 viewBox = "0 0 24 24" class = "copyButtonIcon_y97N" > < path fill = "curren
< blockquote >
2024-02-21 08:09:50 +00:00
< p > [!NOTE]
Google App Engine caches your < code > node_modules< / code > between builds.
2023-11-17 09:26:24 +00:00
Specifying the Puppeteer cache as subdirectory of < code > node_modules< / code >
mitigates an issue in which Puppeteer can' t find the browser executable
2023-11-29 13:34:30 +00:00
due to < code > postinstall< / code > not being run.< / p >
< / blockquote >
< h3 class = "anchor anchorWithStickyNavbar_LWe7" id = "running-puppeteer-on-google-cloud-functions" > Running Puppeteer on Google Cloud Functions< a href = "#running-puppeteer-on-google-cloud-functions" class = "hash-link" aria-label = "Direct link to Running Puppeteer on Google Cloud Functions" title = "Direct link to Running Puppeteer on Google Cloud Functions" > < / a > < / h3 >
< p > The Node.js runtime of
2023-11-17 09:26:24 +00:00
< a href = "https://cloud.google.com/functions/docs/" target = "_blank" rel = "noopener noreferrer" > Google Cloud Functions< / a >
2023-11-29 13:34:30 +00:00
comes with all system packages needed to run Headless Chrome.< / p >
< p > To use < code > puppeteer< / code > , specify the module as a dependency in your < code > package.json< / code >
2023-11-17 09:26:24 +00:00
and then override the puppeteer cache directory by including a file named
2023-11-29 13:34:30 +00:00
< code > .puppeteerrc.cjs< / code > at the root of your application with the contents:< / 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" style = "color:#393A34;background-color:#f6f8fa" > < 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 keyword" style = "color:#00009f" > 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 doc-comment comment" style = "color:#999988;font-style:italic" > /**< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token doc-comment comment" style = "color:#999988;font-style:italic" > * < / span > < span class = "token doc-comment comment keyword" style = "color:#00009f;font-style:italic" > @type< / span > < span class = "token doc-comment comment" style = "color:#999988;font-style:italic" > < / span > < span class = "token doc-comment comment punctuation" style = "color:#393A34;font-style:italic" > {< / span > < span class = "token doc-comment comment" style = "color:#999988;font-style:italic" > import(" puppeteer" ).Configuration< / span > < span class = "token doc-comment comment punctuation" style = "color:#393A34;font-style:italic" > }< / span > < span class = "token doc-comment comment" style = "color:#999988;font-style:italic" > < / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token doc-comment 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 plain" > exports < / 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" > 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" > ' node_modules' < / span > < span class = "token punctuation" style = "color:#393A34" > ,< / span > < span class = "token plain" > < / span > < span class = "token string" style = "color:#e3116c" > ' .puppeteer_cache' < / 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 viewBox = "0 0 24 24" class = "copyButtonIcon_y97N" > < path fill = "curren
< blockquote >
2024-02-21 08:09:50 +00:00
< p > [!NOTE]
Google Cloud Functions caches your < code > node_modules< / code > between builds. Specifying the
2023-11-17 09:26:24 +00:00
puppeteer cache as subdirectory of < code > node_modules< / code > mitigates an issue in which the
2023-11-29 13:34:30 +00:00
puppeteer install process does not run when the cache is hit.< / p >
< / blockquote >
2024-02-21 08:09:50 +00:00
< h3 class = "anchor anchorWithStickyNavbar_LWe7" id = "running-puppeteer-on-google-cloud-run-1" > Running Puppeteer on Google Cloud Run< a href = "#running-puppeteer-on-google-cloud-run-1" class = "hash-link" aria-label = "Direct link to Running Puppeteer on Google Cloud Run" title = "Direct link to Running Puppeteer on Google Cloud Run" > < / a > < / h3 >
2023-11-29 13:34:30 +00:00
< p > The default Node.js runtime of
2022-10-19 08:43:26 +00:00
< a href = "https://cloud.google.com/run/docs/" target = "_blank" rel = "noopener noreferrer" > Google Cloud Run< / a > does not come with the
system packages needed to run Headless Chrome. You will need to set up your own
< code > Dockerfile< / code > and
2024-03-20 15:05:54 +00:00
< a href = "#chrome-doesnt-launch-on-linux" > include the missing dependencies< / a > .< / p >
2023-11-29 13:34:30 +00:00
< h3 class = "anchor anchorWithStickyNavbar_LWe7" id = "running-puppeteer-on-heroku" > Running Puppeteer on Heroku< a href = "#running-puppeteer-on-heroku" class = "hash-link" aria-label = "Direct link to Running Puppeteer on Heroku" title = "Direct link to Running Puppeteer on Heroku" > < / a > < / h3 >
< p > Running Puppeteer on Heroku requires some additional dependencies that aren' t
2022-10-19 08:43:26 +00:00
included on the Linux box that Heroku spins up for you. To add the dependencies
on deploy, add the Puppeteer Heroku buildpack to the list of buildpacks for your
2023-11-29 13:34:30 +00:00
app under Settings > Buildpacks.< / p >
< p > The url for the buildpack is
< a href = "https://github.com/jontewks/puppeteer-heroku-buildpack" target = "_blank" rel = "noopener noreferrer" > https://github.com/jontewks/puppeteer-heroku-buildpack< / a > < / p >
< p > Ensure that you' re using < code > ' --no-sandbox' < / code > mode when launching Puppeteer. This
2022-10-19 08:43:26 +00:00
can be done by passing it as an argument to your < code > .launch()< / code > call:
2023-11-29 13:34:30 +00:00
< code > puppeteer.launch({ args: [' --no-sandbox' ] });< / code > .< / p >
< p > When you click add buildpack, simply paste that url into the input, and click
2022-10-19 08:43:26 +00:00
save. On the next deploy, your app will also install the dependencies that
2023-11-29 13:34:30 +00:00
Puppeteer needs to run.< / p >
< p > If you need to render Chinese, Japanese, or Korean characters you may need to
2022-10-19 08:43:26 +00:00
use a buildpack with additional font files like
2023-11-29 13:34:30 +00:00
< a href = "https://github.com/CoffeeAndCode/puppeteer-heroku-buildpack" target = "_blank" rel = "noopener noreferrer" > https://github.com/CoffeeAndCode/puppeteer-heroku-buildpack< / a > < / p >
< p > There' s also another
2022-10-19 08:43:26 +00:00
< a href = "https://timleland.com/headless-chrome-on-heroku/" target = "_blank" rel = "noopener noreferrer" > simple guide< / a > from @timleland
that includes a sample project:
2023-11-29 13:34:30 +00:00
< a href = "https://timleland.com/headless-chrome-on-heroku/" target = "_blank" rel = "noopener noreferrer" > https://timleland.com/headless-chrome-on-heroku/< / a > .< / p >
< h3 class = "anchor anchorWithStickyNavbar_LWe7" id = "running-puppeteer-on-aws-lambda" > Running Puppeteer on AWS Lambda< a href = "#running-puppeteer-on-aws-lambda" class = "hash-link" aria-label = "Direct link to Running Puppeteer on AWS Lambda" title = "Direct link to Running Puppeteer on AWS Lambda" > < / a > < / h3 >
< p > AWS Lambda < a href = "https://docs.aws.amazon.com/lambda/latest/dg/limits.html" target = "_blank" rel = "noopener noreferrer" > limits< / a >
2022-10-19 08:43:26 +00:00
deployment package sizes to ~50MB. This presents challenges for running headless
Chrome (and therefore Puppeteer) on Lambda. The community has put together a few
2023-11-29 13:34:30 +00:00
resources that work around the issues:< / p >
< ul >
< li > < a href = "https://github.com/sparticuz/chromium" target = "_blank" rel = "noopener noreferrer" > https://github.com/sparticuz/chromium< / a > (a vendor and framework agnostic library that supports modern versions of < code > chromium< / code > )< / li >
< li > < a href = "https://github.com/alixaxel/chrome-aws-lambda" target = "_blank" rel = "noopener noreferrer" > https://github.com/alixaxel/chrome-aws-lambda< / a > (supports up to puppeteer 10.1 - outdated)< / li >
< li > < a href = "https://github.com/adieuadieu/serverless-chrome/blob/HEAD/docs/chrome.md" target = "_blank" rel = "noopener noreferrer" > https://github.com/adieuadieu/serverless-chrome/blob/HEAD/docs/chrome.md< / a >
(serverless plugin - outdated)< / li >
< / ul >
< h3 class = "anchor anchorWithStickyNavbar_LWe7" id = "running-puppeteer-on-aws-ec2-instance-running-amazon-linux" > Running Puppeteer on AWS EC2 instance running Amazon-Linux< a href = "#running-puppeteer-on-aws-ec2-instance-running-amazon-linux" class = "hash-link" aria-label = "Direct link to Running Puppeteer on AWS EC2 instance running Amazon-Linux" title = "Direct link to Running Puppeteer on AWS EC2 instance running Amazon-Linux" > < / a > < / h3 >
< p > If you are using an EC2 instance running amazon-linux in your CI/CD pipeline,
and if you want to run Puppeteer tests in amazon-linux, follow these steps.< / p >
< ol >
< li >
< p > To install Chromium, you have to first enable < code > amazon-linux-extras< / code > which
2022-10-19 08:43:26 +00:00
comes as part of
2023-11-29 13:34:30 +00:00
< a href = "https://aws.amazon.com/premiumsupport/knowledge-center/ec2-enable-epel/" target = "_blank" rel = "noopener noreferrer" > EPEL (Extra Packages for Enterprise Linux)< / a > :< / 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" style = "color:#393A34;background-color:#f6f8fa" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token function" style = "color:#d73a49" > sudo< / span > < span class = "token plain" > amazon-linux-extras < / span > < span class = "token function" style = "color:#d73a49" > install< / span > < span class = "token plain" > epel < / span > < span class = "token parameter variable" style = "color:#36acaa" > -y< / 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 viewBox = "0 0 24 24" class = "copyButtonIcon_y97N" > < path fill = "currentColor" 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 viewBox = "0 0 24 24" class = "copyButtonSuccessIcon_LjdS" > < path fill = "currentColor" d = "M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" > < / path > < / svg > < / span > < / button > < / div > < / div > < / div >
< / li >
< li >
< p > Next, install Chromium:< / 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" style = "color:#393A34;background-color:#f6f8fa" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < span class = "token function" style = "color:#d73a49" > sudo< / span > < span class = "token plain" > yum < / span > < span class = "token function" style = "color:#d73a49" > install< / span > < span class = "token plain" > < / span > < span class = "token parameter variable" style = "color:#36acaa" > -y< / span > < span class = "token plain" > chromium< / 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 viewBox = "0 0 24 24" class = "copyButtonIcon_y97N" > < path fill = "currentColor" 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 viewBox = "0 0 24 24" class = "copyButtonSuccessIcon_LjdS" > < path fill = "currentColor" d = "M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" > < / path > < / svg > < / span > < / button > < / div > < / div > < / div >
< / li >
< / ol >
< p > Now Puppeteer can launch Chromium to run your tests. If you do not enable EPEL
2022-10-19 08:43:26 +00:00
and if you continue installing chromium as part of < code > npm install< / code > , Puppeteer
cannot launch Chromium due to unavailablity of < code > libatk-1.0.so.0< / code > and many more
2023-11-29 13:34:30 +00:00
packages.< / p >
< h2 class = "anchor anchorWithStickyNavbar_LWe7" id = "code-transpilation-issues" > Code Transpilation Issues< a href = "#code-transpilation-issues" class = "hash-link" aria-label = "Direct link to Code Transpilation Issues" title = "Direct link to Code Transpilation Issues" > < / a > < / h2 >
< p > If you are using a JavaScript transpiler like babel or TypeScript, calling
2022-10-19 08:43:26 +00:00
< code > evaluate()< / code > with an async function might not work. This is because while
< code > puppeteer< / code > uses < code > Function.prototype.toString()< / code > to serialize functions while
transpilers could be changing the output code in such a way it' s incompatible
2023-11-29 13:34:30 +00:00
with < code > puppeteer< / code > .< / p >
< p > Some workarounds to this problem would be to instruct the transpiler not to mess
2022-10-19 08:43:26 +00:00
up with the code, for example, configure TypeScript to use latest ecma version
(< code > " target" : " es2018" < / code > ). Another workaround could be using string templates
2023-11-29 13:34:30 +00:00
instead of functions:< / p >
2024-03-07 10:27:52 +00:00
< 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" style = "color:#393A34;background-color:#f6f8fa" > < code class = "codeBlockLines_e6Vv" > < span class = "token-line" style = "color:#393A34" > < 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" > evaluate< / span > < span class = "token punctuation" style = "color:#393A34" > (< / span > < span class = "token template-string template-punctuation string" style = "color:#e3116c" > `< / span > < span class = "token template-string string" style = "color:#e3116c" > (async() => {< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token template-string string" style = "color:#e3116c" > console.log(' 1' );< / span > < br > < / span > < span class = "token-line" style = "color:#393A34" > < span class = "token template-string string" style = "color:#e3116c" > })()< / span > < span class = "token template-string template-punctuation string" style = "color:#e3116c" > `< / 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 viewBox = "0 0 24 24" class = "copyButtonIcon_y97N" > < path fill = "currentColor" 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 viewBox = "0 0 24 24" class = "copyButtonSuccessIcon_LjdS" > < path fill = "currentColor" d = "M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" > < / path > < / svg > < / span > < / button > < / div > < / div > < / div > < / div > < / article > < nav class = "pagination-nav docusaurus-mt-lg" aria-label = "Docs pages" > < a class = "pagination-nav__link pagination-nav__link--prev" href = "/next/chromium-support" > < div class = "pagination-nav__sublabel" > Previous< / div > < div class = "pagination-nav__label" > Chromium Support< / div > < / a > < a class = "pagination-nav__link pagination-nav__link--next" href = "/next/contributing" > < div class = "pagination-nav__sublabel" > Next< / div > < div class = "pagination-nav__label" > Contributing< / 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 = "#cannot-find-module-puppeteer-coreinternal" class = "table-of-contents__link toc-highlight" > < code > Cannot find module ' puppeteer-core/internal/...' < / code > < / a > < / li > < li > < a href = "#could-not-find-expected-browser-locally" class = "table-of-contents__link toc-highlight" > < code > Could not find expected browser locally< / code > < / a > < / li > < li > < a href = "#chrome-headless-doesnt-launch-on-windows" class = "table-of-contents__link toc-highlight" > Chrome headless doesn' t launch on Windows< / a > < / li > < li > < a href = "#chrome-doesnt-launch-on-linux" class = "table-of-contents__link toc-highlight" > Chrome doesn' t launch on Linux< / a > < / li > < li > < a href = "#chrome-headless-shell-disables-gpu-compositing" class = "table-of-contents__link toc-highlight" > chrome-headless-shell disables GPU compositing< / a > < / li > < li > < a href = "#setting-up-gpu-with-chrome" class = "table-of-contents__link toc-highlight" > Setting up GPU with Chrome< / a > < / li > < li > < a href = "#setting-up-chrome-linux-sandbox" class = "table-of-contents__link toc-highlight" > Setting Up Chrome Linux Sandbox< / a > < ul > < li > < a href = "#recommended-enable-user-namespace-cloning" class = "table-of-contents__link toc-highlight" > [recommended] Enable user namespace cloning< / a > < / li > < li > < a href = "#alternative-setup-setuid-sandbox" class = "table-of-contents__link toc-highlight" > [alternative] Setup setuid sandbox< / a > < / li > < / ul > < / li > < li > < a href = "#running-puppeteer-on-travis-ci" class = "table-of-contents__link toc-highlight" > Running Puppeteer on Travis CI< / a > <
2022-07-01 15:15:07 +00:00
< / body >
< / html >
