cytoscape / cytosnap

A Node.js package that renders images of Cytoscape.js graphs on the server using Puppeteer
MIT License
58 stars 11 forks source link

Puppeteer #19

Closed d2fong closed 5 years ago

d2fong commented 5 years ago

migrate from phantomjs to puppeteer for the browser automation.

maxkfranz commented 5 years ago

TODO investigate why Travis is failing. I think there may be two issues:

(1) The Travis VMs may not always have the libs necessary to run Chrome. This is what you saw the other day on the Ubuntu VM, Dylan.

(2) I don't think Puppeteer works on old versions of Node. We may have to drop support for versions before 6.

d2fong commented 5 years ago

ubuntu steps for phantomjs: https://gist.github.com/d2fong/8b7b48dd2c853034e5785bedf992e6aa

ubuntu steps for puppeteer: https://github.com/GoogleChrome/puppeteer/blob/master/docs/troubleshooting.md#running-puppeteer-in-docker

jeshan commented 5 years ago

I tried this in Docker on my local machine and it's working. Based on the previous comment, here is what I found that we need:

  1. add packages as per troubleshooting doc above:
    
    RUN apt-get update && apt-get install -yq libgconf-2-4

Install latest chrome dev package and fonts to support major charsets (Chinese, Japanese, Arabic, Hebrew, Thai and a few others)

Note: this installs the necessary libs to make the bundled version of Chromium that Puppeteer

installs, work.

RUN apt-get update && apt-get install -y wget --no-install-recommends \ && wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | apt-key add - \ && sh -c 'echo "deb [arch=amd64] http://dl.google.com/linux/chrome/deb/ stable main" >> /etc/apt/sources.list.d/google.list' \ && apt-get update \ && apt-get install -y google-chrome-unstable fonts-ipafont-gothic fonts-wqy-zenhei fonts-thai-tlwg fonts-kacst ttf-freefont \ --no-install-recommends \ && rm -rf /var/lib/apt/lists/ \ && apt-get purge --auto-remove -y curl \ && rm -rf /src/.deb

RUN groupadd -r pptruser && useradd -r -g pptruser -G audio,video pptruser \ && mkdir -p /home/pptruser/Downloads \ && chown -R pptruser:pptruser /home/pptruser \ && chown -R pptruser:pptruser node_modules

Run everything after as non-privileged user.

USER pptruser

2. add SYS_ADMIN capability. e.g in Docker compose:
```yaml
    cap_add:
      - SYS_ADMIN

I found that using puppeteer allowed for use of certain selectors, these were not possible in the current release with phantom (it crashed):

{
  selector: 'edge[type = "Whatever"]',
  css: {
    'curve-style': 'unbundled-bezier',
....

I need the above selectors in my app, so hopefully we can get a release soon.

Note: tested on a node 11 based image. I will try to gather results based on older versions of Node

maxkfranz commented 5 years ago

@d2fong Let's test this on the interactions app next week. I suspect we may need to expose the entire options object for puppeteer.launch(options), since different setups may need to override more things.

d2fong commented 5 years ago

Ok sounds good