Railway•17mo ago

Puppeteer Deployment Issue

PUPPETEER DEPLOYMENT ISSUES -- I've seen a lot of chatter around various issues deploying Puppeteer, but nothing jumps out as a complete answer or example for deployment of the current versions. I'm seeing the deployment errors, below after setup in .puppeteerrc.cjs. I also tried nixpacks.toml described in various places but have since removed it after looking at a railway PR. NOTE: We are using Puppeteer for internal URL screenshot / image generation as it's proven most reliable for our requirement.

// .puppeteerrc.cjs
const { join } = require('path');

/**
 * @type {import("puppeteer").Configuration}
 */
module.exports = {
  cacheDirectory: join(__dirname, '.cache', 'puppeteer'),
};

// .puppeteerrc.cjs
const { join } = require('path');

/**
 * @type {import("puppeteer").Configuration}
 */
module.exports = {
  cacheDirectory: join(__dirname, '.cache', 'puppeteer'),
};

ERRORS:

#13 13.02 file:///app/node_modules/.pnpm/[email protected][email protected]/node_modules/puppeteer-core/lib/esm/puppeteer/node/ProductLauncher.js:278
#13 13.02                     throw new Error(`Could not find Chrome (ver. ${this.puppeteer.browserRevision}). This can occur if either\n` +
#13 13.02                           ^
#13 13.02
#13 13.02 Error: Could not find Chrome (ver. 114.0.5735.133). This can occur if either
#13 13.02  1. you did not perform an installation before running the script (e.g. `npm install`) or
#13 13.02  2. your cache path is incorrectly configured (which is: /app/.cache/puppeteer).
#13 13.02 For (2), check out our guide on configuring puppeteer at https://pptr.dev/guides/configuration.
#13 13.02     at ChromeLauncher.resolveExecutablePath (file:///app/node_modules/.pnpm/[email protected][email protected]/node_modules/puppeteer-core/lib/esm/puppeteer/node/ProductLauncher.js:278:27)
#13 13.02     at ChromeLauncher.executablePath (file:///app/node_modules/.pnpm/[email protected][email protected]/node_modules/puppeteer-core/lib/esm/puppeteer/node/ChromeLauncher.js:174:25)
#13 13.02     at ChromeLauncher.computeLaunchArguments (file:///app/node_modules/.pnpm/[email protected][email protected]/node_modules/puppeteer-core/lib/esm/puppeteer/node/ChromeLauncher.js:91:37)
#13 13.02     at async ChromeLauncher.launch (file:///app/node_modules/.pnpm/[email protected][email protected]/node_modules/puppeteer-core/lib/esm/puppeteer/node/ProductLauncher.js:57:28)
#13 13.02
#13 13.02 Node.js v18.12.1
#13 13.02
#13 13.03  ELIFECYCLE  Command failed with exit code 1.
 
#13 ERROR: process "/bin/bash -ol pipefail -c pnpm build" did not complete successfully: exit code: 1
-----
> [stage-0  9/11] RUN --mount=type=cache,id=s/d2f8a6b1-6a3d-46dc-9755-43c359214c26-node_modules/cache,target=/app/node_modules/.cache pnpm build:
#13 13.02  2. your cache path is incorrectly configured (which is: /app/.cache/puppeteer).
#13 13.02 For (2), check out our guide on configuring puppeteer at https://pptr.dev/guides/configuration.
#13 13.02     at ChromeLauncher.resolveExecutablePath (file:///app/node_modules/.pnpm/[email protected][email protected]/node_modules/puppeteer-core/lib/esm/puppeteer/node/ProductLauncher.js:278:27)
#13 13.02     at ChromeLauncher.executablePath (file:///app/node_modules/.pnpm/[email protected][email protected]/node_modules/puppeteer-core/lib/esm/puppeteer/node/ChromeLauncher.js:174:25)
#13 13.02     at ChromeLauncher.computeLaunchArguments (file:///app/node_modules/.pnpm/[email protected][email protected]/node_modules/puppeteer-core/lib/esm/puppeteer/node/ChromeLauncher.js:91:37)
#13 13.02     at async ChromeLauncher.launch (file:///app/node_modules/.pnpm/[email protected][email protected]/node_modules/puppeteer-core/lib/esm/puppeteer/node/ProductLauncher.js:57:28)
#13 13.02

#13 13.02 file:///app/node_modules/.pnpm/[email protected][email protected]/node_modules/puppeteer-core/lib/esm/puppeteer/node/ProductLauncher.js:278
#13 13.02                     throw new Error(`Could not find Chrome (ver. ${this.puppeteer.browserRevision}). This can occur if either\n` +
#13 13.02                           ^
#13 13.02
#13 13.02 Error: Could not find Chrome (ver. 114.0.5735.133). This can occur if either
#13 13.02  1. you did not perform an installation before running the script (e.g. `npm install`) or
#13 13.02  2. your cache path is incorrectly configured (which is: /app/.cache/puppeteer).
#13 13.02 For (2), check out our guide on configuring puppeteer at https://pptr.dev/guides/configuration.
#13 13.02     at ChromeLauncher.resolveExecutablePath (file:///app/node_modules/.pnpm/[email protected][email protected]/node_modules/puppeteer-core/lib/esm/puppeteer/node/ProductLauncher.js:278:27)
#13 13.02     at ChromeLauncher.executablePath (file:///app/node_modules/.pnpm/[email protected][email protected]/node_modules/puppeteer-core/lib/esm/puppeteer/node/ChromeLauncher.js:174:25)
#13 13.02     at ChromeLauncher.computeLaunchArguments (file:///app/node_modules/.pnpm/[email protected][email protected]/node_modules/puppeteer-core/lib/esm/puppeteer/node/ChromeLauncher.js:91:37)
#13 13.02     at async ChromeLauncher.launch (file:///app/node_modules/.pnpm/[email protected][email protected]/node_modules/puppeteer-core/lib/esm/puppeteer/node/ProductLauncher.js:57:28)
#13 13.02
#13 13.02 Node.js v18.12.1
#13 13.02
#13 13.03  ELIFECYCLE  Command failed with exit code 1.
 
#13 ERROR: process "/bin/bash -ol pipefail -c pnpm build" did not complete successfully: exit code: 1
-----
> [stage-0  9/11] RUN --mount=type=cache,id=s/d2f8a6b1-6a3d-46dc-9755-43c359214c26-node_modules/cache,target=/app/node_modules/.cache pnpm build:
#13 13.02  2. your cache path is incorrectly configured (which is: /app/.cache/puppeteer).
#13 13.02 For (2), check out our guide on configuring puppeteer at https://pptr.dev/guides/configuration.
#13 13.02     at ChromeLauncher.resolveExecutablePath (file:///app/node_modules/.pnpm/[email protected][email protected]/node_modules/puppeteer-core/lib/esm/puppeteer/node/ProductLauncher.js:278:27)
#13 13.02     at ChromeLauncher.executablePath (file:///app/node_modules/.pnpm/[email protected][email protected]/node_modules/puppeteer-core/lib/esm/puppeteer/node/ChromeLauncher.js:174:25)
#13 13.02     at ChromeLauncher.computeLaunchArguments (file:///app/node_modules/.pnpm/[email protected][email protected]/node_modules/puppeteer-core/lib/esm/puppeteer/node/ChromeLauncher.js:91:37)
#13 13.02     at async ChromeLauncher.launch (file:///app/node_modules/.pnpm/[email protected][email protected]/node_modules/puppeteer-core/lib/esm/puppeteer/node/ProductLauncher.js:57:28)
#13 13.02

@Mafdet Did you ever get your deployment issue solved? If so, any guidance here?

44 Replies

Percy•17mo ago

Project ID: d2f8a6b1-6a3d-46dc-9755-43c359214c26

Brody•17mo ago

can you send your package.json?

sebastian®•17mo ago

Hi @brody192. The files look like this: PACKAGE:

{
    "name": "foobar",
    "description": "foobar",
    "engines": {
        "node": ">=18.0.0"
    },
    "private": true,
    "scripts": {
        "build": "qwik build",
        "build.client": "vite build",
        "build.cron_jobs": "cd cron_jobs && tsc",
        "build.preview": "vite build --ssr src/entry.preview.tsx",
        "build.server": "vite build -c adapters/fastify/vite.config.ts",
        "build.types": "tsc --incremental --noEmit",
        "deploy.cron_jobs": "node cron_jobs/build/cron_jobs/index.js",
        "dev": "vite --mode ssr",
        "dev.debug": "node --inspect-brk ./node_modules/vite/bin/vite.js --mode ssr --force",
        "fmt": "prettier --write .",
        "fmt.check": "prettier --check .",
        "lint": "eslint \"src/**/*.ts*\"",
        "preview": "qwik build preview && vite preview --open",
        "serve": "node server/entry.fastify",
        "start": "vite --open --mode ssr",
        "test": "vitest",
        "test.unit": "vitest components",
        "test.unit.ui": "vitest --ui components",
        "typegen": "kysely-codegen --include-pattern \"public.*\" --dialect postgres --out-file src/database/dbTypes_autogenerated.ts && prettier --write src/database/dbTypes_autogenerated.ts",
        "qwik": "qwik"
    },
    "devDependencies": {
        "@builder.io/qwik": "github:builderio/qwik-build",
        "@builder.io/qwik-city": "github:builderio/qwik-city-build",
        "@builder.io/qwik-dom": "^2.1.19",
        "@builder.io/sdk-qwik": "^0.4.1",
        "@fastify/compress": "^6.4.0",
        "@fastify/static": "^6.10.2",
        "@resvg/resvg-js": "^2.4.1",
        "@types/chai": "^4.3.5",
        "@types/compression": "^1.7.2",
        "@types/eslint": "8.40.2",
        "@types/express": "4.17.17",
        "@types/jsonwebtoken": "^9.0.2",
        "@types/node": "^20.3.1",
        "@types/node-cron": "^3.0.7",
        "@types/node-fetch": "^2.6.4",
        "@types/pg": "^8.10.2",
        "@types/ua-parser-js": "^0.7.36",
        "@typescript-eslint/eslint-plugin": "5.59.11",
        "@typescript-eslint/parser": "5.59.11",
        "@vercel/og": "^0.5.7",
        "@vitest/ui": "^0.32.2",
        "better-sqlite3": "^8.4.0",
        "chai": "^4.3.7",
        "compression": "^1.7.4",
        "date-fns": "^2.30.0",
        "dotenv": "^16.3.1",
        "eslint": "8.43.0",
        "eslint-plugin-qwik": "1.1.5",
        "express": "4.18.2",
        "fastify": "^4.18.0",
        "fastify-plugin": "^4.5.0",
        "http-status-codes": "^2.2.0",
        "jsonwebtoken": "^9.0.0",
        "kysely": "^0.25.0",
        "kysely-codegen": "^0.10.1",
        "node-fetch": "3.3.1",
        "openai": "^3.3.0",
        "pg": "8.11.0",
        "prettier": "2.8.8",
        "rollup-plugin-analyzer": "^4.0.0",
        "rollup-plugin-visualizer": "^5.9.2",
        "satori": "^0.10.1",
        "tslog": "^4.8.2",
        "typescript": "5.1.3",
        "ua-parser-js": "^1.0.35",
        "undici": "5.22.1",
        "vite": "^4.3.9",
        "vite-tsconfig-paths": "4.2.0",
        "vitest": "^0.32.2",
        "zod": "^3.21.4"
    },
    "dependencies": {
        "cron-parser": "^4.8.1",
        "node-cron": "^3.0.2",
        "puppeteer": "^20.7.2"
    }
}

{
    "name": "foobar",
    "description": "foobar",
    "engines": {
        "node": ">=18.0.0"
    },
    "private": true,
    "scripts": {
        "build": "qwik build",
        "build.client": "vite build",
        "build.cron_jobs": "cd cron_jobs && tsc",
        "build.preview": "vite build --ssr src/entry.preview.tsx",
        "build.server": "vite build -c adapters/fastify/vite.config.ts",
        "build.types": "tsc --incremental --noEmit",
        "deploy.cron_jobs": "node cron_jobs/build/cron_jobs/index.js",
        "dev": "vite --mode ssr",
        "dev.debug": "node --inspect-brk ./node_modules/vite/bin/vite.js --mode ssr --force",
        "fmt": "prettier --write .",
        "fmt.check": "prettier --check .",
        "lint": "eslint \"src/**/*.ts*\"",
        "preview": "qwik build preview && vite preview --open",
        "serve": "node server/entry.fastify",
        "start": "vite --open --mode ssr",
        "test": "vitest",
        "test.unit": "vitest components",
        "test.unit.ui": "vitest --ui components",
        "typegen": "kysely-codegen --include-pattern \"public.*\" --dialect postgres --out-file src/database/dbTypes_autogenerated.ts && prettier --write src/database/dbTypes_autogenerated.ts",
        "qwik": "qwik"
    },
    "devDependencies": {
        "@builder.io/qwik": "github:builderio/qwik-build",
        "@builder.io/qwik-city": "github:builderio/qwik-city-build",
        "@builder.io/qwik-dom": "^2.1.19",
        "@builder.io/sdk-qwik": "^0.4.1",
        "@fastify/compress": "^6.4.0",
        "@fastify/static": "^6.10.2",
        "@resvg/resvg-js": "^2.4.1",
        "@types/chai": "^4.3.5",
        "@types/compression": "^1.7.2",
        "@types/eslint": "8.40.2",
        "@types/express": "4.17.17",
        "@types/jsonwebtoken": "^9.0.2",
        "@types/node": "^20.3.1",
        "@types/node-cron": "^3.0.7",
        "@types/node-fetch": "^2.6.4",
        "@types/pg": "^8.10.2",
        "@types/ua-parser-js": "^0.7.36",
        "@typescript-eslint/eslint-plugin": "5.59.11",
        "@typescript-eslint/parser": "5.59.11",
        "@vercel/og": "^0.5.7",
        "@vitest/ui": "^0.32.2",
        "better-sqlite3": "^8.4.0",
        "chai": "^4.3.7",
        "compression": "^1.7.4",
        "date-fns": "^2.30.0",
        "dotenv": "^16.3.1",
        "eslint": "8.43.0",
        "eslint-plugin-qwik": "1.1.5",
        "express": "4.18.2",
        "fastify": "^4.18.0",
        "fastify-plugin": "^4.5.0",
        "http-status-codes": "^2.2.0",
        "jsonwebtoken": "^9.0.0",
        "kysely": "^0.25.0",
        "kysely-codegen": "^0.10.1",
        "node-fetch": "3.3.1",
        "openai": "^3.3.0",
        "pg": "8.11.0",
        "prettier": "2.8.8",
        "rollup-plugin-analyzer": "^4.0.0",
        "rollup-plugin-visualizer": "^5.9.2",
        "satori": "^0.10.1",
        "tslog": "^4.8.2",
        "typescript": "5.1.3",
        "ua-parser-js": "^1.0.35",
        "undici": "5.22.1",
        "vite": "^4.3.9",
        "vite-tsconfig-paths": "4.2.0",
        "vitest": "^0.32.2",
        "zod": "^3.21.4"
    },
    "dependencies": {
        "cron-parser": "^4.8.1",
        "node-cron": "^3.0.2",
        "puppeteer": "^20.7.2"
    }
}

USAGE:

import puppeteer from 'puppeteer';

...

    pagePromise = puppeteer
        .launch({
            headless: 'new',
            args: ['--no-sandbox', '--disable-setuid-sandbox'],
        })
        .then((browser) => {
            console.log('Browser launched');
            return browser.newPage();
        });

import puppeteer from 'puppeteer';

...

    pagePromise = puppeteer
        .launch({
            headless: 'new',
            args: ['--no-sandbox', '--disable-setuid-sandbox'],
        })
        .then((browser) => {
            console.log('Browser launched');
            return browser.newPage();
        });

Brody•17mo ago

what is this file for?

// .puppeteerrc.cjs
const { join } = require('path');

/**
 * @type {import("puppeteer").Configuration}
 */
module.exports = {
  cacheDirectory: join(__dirname, '.cache', 'puppeteer'),
};

// .puppeteerrc.cjs
const { join } = require('path');

/**
 * @type {import("puppeteer").Configuration}
 */
module.exports = {
  cacheDirectory: join(__dirname, '.cache', 'puppeteer'),
};

sebastian®•17mo ago

https://pptr.dev/guides/configuration

Configuration | Puppeteer

All defaults in Puppeteer can be customized in two ways:

sebastian®•17mo ago

As it's unclear where Railway needs to store the browser (e.g. ~/.cache/puppeteer), this resolves. that.

Brody•17mo ago

see what happens when you delete that file

sebastian®•17mo ago

same issue it's unclear in Railway where this should point. There's a whole bunch of different posts around this, and also references for Railway based on Heroku nixpacks. But there's a Railway PR that seems to fix it, so I removed the nixpack.

Brody•17mo ago

show me the pr?

sebastian®•17mo ago

oh, boy ..... that's hours ago...... let me see....

sebastian®•17mo ago

This one: https://github.com/railwayapp/nixpacks/pull/416

GitHub

Support Puppeteer out of the box by JakeCooper · Pull Request #416 ...

This PR adds support for Puppeteer detection

sebastian®•17mo ago

Interestingly, as a test, I was just able to successfully deploy Playwright which also uses a headless browser. There is something about the caching of the browser in Puppeteer that is not right -- at least that's my suspicion.

Brody•17mo ago

okay fine, I'll ask, why do you have 99% of your dependencies as dev dependencies

sebastian®•17mo ago

That's how Qwik is designed. Highly optimized for JIT execution, "Resumability" model. It's like streamed Typescript.

Brody•17mo ago

but a lot of those are definitely not dependencies that are only used during development

sebastian®•17mo ago

True, the optmization process of Qwik resolves this when it build the produciton version.

sebastian®•17mo ago

https://qwik.builder.io https://github.com/BuilderIO/qwik

Qwik

Framework reimagined for the edge! - Qwik

No hydration, auto lazy-loading, edge-optimized, and fun 🎉!

GitHub

GitHub - BuilderIO/qwik: Instant-loading web apps, without effort

Instant-loading web apps, without effort. Contribute to BuilderIO/qwik development by creating an account on GitHub.

sebastian®•17mo ago

We have production-grade Qwik apps running quite successfully on Railway.

Brody•17mo ago

the puppeteer dependency is supposed to install chrome, any idea why it isn't? I think I should mention, I'm not a JavaScript developer

sebastian®•17mo ago

That's exactly what a couple of us are digging around for today. Why it's not.... and the current suspicion is the cache path. I'm going to ping someone in the morning and get their opinion too.

Brody•17mo ago

I've seen people use puppeteer without issues, without any configuration

sebastian®•17mo ago

I'd just like to see a current (working) example of Puppeteer on Railway using the current versions.

Brody•17mo ago

they've never touched the cache directory

sebastian®•17mo ago

Indeed. I've also seen some comments that people have rolled back to an old version of Puppeterr on Railway. If you recall anybody, or know of a working example with current releases, please let me know. I can reverse engineer from there.

Brody•17mo ago

ill throw my puppeteer test app on railway right now

sebastian®•17mo ago

pnpm up --latest

Brody•17mo ago

what

sebastian®•17mo ago

Puppeteer v20.7.2

Brody•17mo ago

my test is using 19.7.1 i will try that, then i will update

sebastian®•17mo ago

19 should be after their transision ... interesting yeah, please throw it up. and if you have a working repo, please share it, plus any configs for Railway (e.g. essential env vars for any paths if required).

Brody•17mo ago

no configs should be needed, but i am throwing it up

Brody•17mo ago

good start

Brody•17mo ago

no issues with 20.7.2

sebastian®•17mo ago

That's good news. Can you share the repo?

Brody•17mo ago

dont have a repo i give zip

sebastian®•17mo ago

sure, that works.

Brody•17mo ago

pup.7z

Brody•17mo ago

7z close enough

sebastian®•17mo ago

got it -- simple simple simple. thank you. let me look at this tomorrow and try to triangulate what's going on with my deployment not finding chrome. Thank you @brody192! 🙏

Brody•17mo ago

sounds good, i blame pnpm

sebastian®•17mo ago

Hahahaha.... maybe! vite

Brody•17mo ago

nothing ever good comes from going against the grain

sebastian®•17mo ago

or one of many other popcicle sticks and bubble gum holding the digital world together. I've moved over to PlayWright for snapshots and it's working perfectly. I did have to add a "postinstall": "npx playwright install" script to resolve the missing chromium browser. It could be the case that Puppeteer requires a similar but different postinstall step. Thanks for your help @brody192. I am marking this solved, but if anybody else wishes to continue the puppeteer deployment conversation, please feel free.

Brody•17mo ago

glad you've solved it, super odd why puppeteer wasn't installing chrome for you but was for me

Gaming

Programming

Puppeteer Deployment Issue