React-snap: puppeteer not getting args in ubuntu

[cjimmy]

I'm trying to get react-snap to run on a Ubuntu 14.04.5 LTS image on AWS CodeBuild. My issue seems to be related to issue #290 for puppeteer.

I've added "puppeteerArgs": ["--no-sandbox", "--disable-setuid-sandbox"] to package.json in node_modules/react-snap
so that this is the config:

  "reactSnap": {
    "destination": "tmp",
    "inlineCss": true,
    "cacheAjaxRequests": true,
    "puppeteerArgs": ["--no-sandbox", "--disable-setuid-sandbox"]
  },

and print out the contents of node_modules/react-snap/package.json to verify that I successfully edited the file.

and I've added all the dependencies noted in #290, but when the script runs react-snap, I end up with this:

(node:1840) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Error: Failed to launch chrome!
[0122/002828.978563:ERROR:zygote_host_impl_linux.cc(88)] Running as root without --no-sandbox is not supported. See https://crbug.com/638180.


TROUBLESHOOTING: https://github.com/GoogleChrome/puppeteer/blob/master/docs/troubleshooting.md

(node:1840) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

I'm surprised that it doesn't see the --no-sandbox arg. Any advice on how to proceed? I'd like to not fork react-snap just to try to launch puppeteer with the same flags.

[cjimmy]

That was silly. I was putting "puppeteerArgs": ["--no-sandbox", "--disable-setuid-sandbox"] in the wrong place. I should've just read through the code in the first place. It should go under defaultOptions in index.js. 🙇

I'll close this now, as a tomb to my stupidity, and for any future folks who run into a similar problem.

I might also put in a PR to make it clearer in the docs where to add options.

For reference for my future self and others, here's how I got react-snap to work in an AWS CodeBuild image (Nodejs-7.0.0). This is one of their standard images, not a custom Docker container.

• update Node to ^8.4.0 so that spread operator works.
• update npm (defaults to ~3.x).
• update apt-get and install additional dependencies for puppeteer (per #290).
• add puppeteer args to react-snap index.js

resulting in a buildspec.yml:

version: 0.2

env:
  variables:
    AWS_ACCESS_KEY_ID: "xxx"
    AWS_SECRET_ACCESS_KEY: "xxx"
  # parameter-store:
     # key: "value"
     # key: "value"

phases:
  install:
    commands:
      - cat /etc/issue # display ubuntu version
      - sudo npm install -g n # install n
      - sudo n 8.4.0 # install node 8.4.0
      - node -v # print out node version
      - npm install -g npm # update npm
      - apt-get update # update apt-get
      - apt-get install -yq gconf-service libasound2 libatk1.0-0 libc6 libcairo2 libcups2 libdbus-1-3 libexpat1 libfontconfig1 libgcc1 libgconf-2-4 libgdk-pixbuf2.0-0 libglib2.0-0 libgtk-3-0 libnspr4 libpango-1.0-0 libpangocairo-1.0-0 libstdc++6 libx11-6 libx11-xcb1 libxcb1 libxcomposite1 libxcursor1 libxdamage1 libxext6 libxfixes3 libxi6 libxrandr2 libxrender1 libxss1 libxtst6 ca-certificates fonts-liberation libappindicator1 libnss3 lsb-release xdg-utils wget #install dependencies for puppeteer, which is a dependency for react-snap
  pre_build:
    commands:
      - npm install # install node modules
      - sh ./scripts/addArgs.sh # run custom script to change options on react-snap to make it work
  build:
    commands:
      - npm run build # create-react-app, react-snap, generate sw
  post_build:
    commands:
      - npm run deploy # sync to aws with correct cache-control

where addArgs.sh is:

# modifies react-snap defaultOptions to add the --no-sandbox and --disable-setuid-sandbox flags so that puppeteer/chromium can run in the codebuild standard image
sed -i "s/puppeteerArgs: \[\],/puppeteerArgs: \[\"--no-sandbox\", \"--disable-setuid-sandbox\"\],/" ./node_modules/react-snap/index.js
echo changed arguments in react-snap

Thanks for this package. React-snap is saving me a lot of work and time!

[mribbons]

This helped me on WSL / ubuntu.

Just to be clear, you can add the args to run instead of defaultOptions:

const { run } = require("react-snap");

await run({
    // You would have other args here,
    puppeteerArgs: ["--no-sandbox", "--disable-setuid-sandbox"]
})

290 above should refer to https://github.com/Googlechrome/puppeteer/issues/290