Usage on GitHub Actions with xvfb

[fregante]

I tried to install/configure xvfb on GitHub actions to use browser-run/tape-run there, but I was not successful.

If anyone finds a solution, please advise. This is the simplest configuration that's only missing xvfb

on: push
jobs:
  run:
    runs-on: ubuntu-latest
    steps:
    - uses: actions/setup-node@v1
    - run: npm install browser-run
    - run: echo 'console.log(9001); window.close()' | browser-run

I wrote all of this and it exits with 0 but browser-run doesn't output anything. The code is not run at all, invalid JS will also result in browser-run exiting successfully.

on: push
jobs:
  run:
    runs-on: ubuntu-latest
    steps:
    - uses: actions/setup-node@v1
    - run: sudo apt-get install xvfb
    - run: export DISPLAY=':99.0'
    - run: Xvfb :99 -screen 0 1024x768x24 > /dev/null 2>&1 &
    - run: npm install browser-run
    - run: npm install electron # Without this, Electron complains it's not installed correctly
    - run: echo 'console.log(9001); window.close()' | ./node_modules/.bin/browser-run

[bcomnes]

I had to clean up old xvfp processes but this method has been working for me:

https://github.com/little-core-labs/nanochrome/pull/1/files#diff-42c92e55465a3edde413334753e1c2e9R26

Haven't had a chance to play with browser-run yet in actions.

[bcomnes]

fwiw, its an action https://github.com/marketplace/actions/cleanup-xvfb. Let me know how it goes if you try it out.

[fregante]

Would it be possible to create an action that wraps xvfb more cleanly instead?

Before

    - run: sudo apt-get install xvfb
    - name: npm install, build, and test
      run: |
        npm i
        xvfb-run --auto-servernum npm test
      env:
        CI: true
    - name: Cleanup xvfb pidx
      uses: bcomnes/cleanup-xvfb@v1

After

    - name: Test with xvfb
      uses: run-with-xvfb
      with:
        run: npm test
      env:
        CI: true

[juliangruber]

I recently set up xvfb with the "Before" method and it worked well. But yes that action looks really cool...I guess it would need to install xvfb by spawning an apt-get child process?

[juliangruber]

I might give this a shot, but since it's your idea, if you want to, please go first!

[bcomnes]

I’ve been using actions a bit more an the cleanup might not even be needed. Not sure what was happening before. Running in headless ci, you need to set up a frame buffer for chrome to work. Unless that responsibility is pulled into browser run, setting up per run is the way to go.

[juliangruber]

I’ve been using actions a bit more an the cleanup might not even be needed

Same for me, this currently works for headless electron: https://github.com/hypergraph-xyz/desktop/blob/master/.github/workflows/test.yml

[fregante]

This is working for me:

on:
  - pull_request
  - push

jobs:
  test:
    runs-on: ubuntu-latest
    steps:
    - uses: actions/checkout@v1
    - run: npm install
    - run: sudo apt-get install xvfb
    - run: xvfb-run --auto-servernum npm test

If anyone publishes an action like I suggested earlier, leave a comment.

[GabrielBB]

This is working for me:

on:
  - pull_request
  - push

jobs:
  test:
    runs-on: ubuntu-latest
    steps:
    - uses: actions/checkout@v1
    - run: npm install
    - run: sudo apt-get install xvfb
    - run: xvfb-run --auto-servernum npm test

If anyone publishes an action like I suggested earlier, leave a comment.

I just published an action like you suggested.

To clean the process I used @bcomnes's script. I added an author header to it. Even tho the cleaning is not really necessary in practice, I wanted the action to feel isolated.

Because I saw @juliangruber conditions his workflow based on platform I added that condition inside the action so your workflow ends up cleaner, if you're not using linux then the command will be executed without using xvfb. In this commit to @juliangruber's repo you guys can see the differences (what before was 7 lines, now can be done with 3).

I added the action in the official electron documentation.

Later I'll add a working-directory parameter because right now you can't run commands in sub-directories

[juliangruber]

This is fantastic work @GabrielBB!

[paulmueller]

Since I ended up here and I figured others might as well, this is my solution:

jobs:
  build:
    env:
      DISPLAY: :0
  steps:
    - name: Setup xvfb (Linux)
      if: runner.os == 'Linux'
      run: |
        sudo apt-get install -y xvfb libxkbcommon-x11-0 libxcb-icccm4 libxcb-image0 libxcb-keysyms1 libxcb-randr0 libxcb-render-util0 libxcb-xinerama0 libxcb-xinput0 libxcb-xfixes0
        # start xvfb in the background
        sudo /usr/bin/Xvfb $DISPLAY -screen 0 1280x1024x24 &

Example: https://github.com/ZELLMECHANIK-DRESDEN/ShapeOut2/blob/2307c9f403c586937059d5c97e3ebc2d8769ce0d/.github/workflows/check.yml

I used this to test a PyQt5 application.