Integrate TestCafe with headless Chrome on GitlabCI and TravisCI

[ajhsu]

Gitlab CI

The following .gitlab-ci.yml configuration demonstrate how to setup an environment for running TestCafe with headless Chrome:

variables:
  GIT_SSL_NO_VERIFY: "1"
  USE_DOCKER: "1"

image: <KKBOX_DOCKER_IMAGE_NAME>

stages:
  - e2e-test

e2e-test:
  tags:
    - docker
  stage: e2e-test
  script:
    # Install NVM
    - "curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.2/install.sh | bash"
    # Enable NVM manually
    - "source ~/.nvm/nvm.sh"
    - "source ~/.nvm/bash_completion"
    # Install Node.js@6
    # This is due to "chrome-remote-interface" package requires node@6.3.0 at least.
    # See: https://github.com/cyrus-and/chrome-remote-interface#implementations
    - "nvm install 6"
    # Resolve ondrej's repository issue
    # See: https://gist.github.com/anonymous/a447da6a10a1964c609234dd3ccbf4a8
    - "rm /etc/apt/sources.list.d/ondrej-php5-5_6-trusty.list"
    - "add-apt-repository -y ppa:ondrej/php"
    - "apt-get -qq -y update"
    # Install google-chrome-stable
    # See: https://askubuntu.com/questions/510056/how-to-install-google-chrome
    - "apt-get -qq -y install wget"
    - "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-chrome.list'"
    - "apt-get -y update"
    - "apt-get -y install google-chrome-stable"
    # Install npm packages
    - "npm install"
    # Run TestCafe
    - "./node_modules/.bin/testcafe 'path:`/usr/bin/google-chrome-stable` --headless --disable-gpu --remote-debugging-port=9222 --remote-debugging-address=0.0.0.0' 'tests/index.spec.js' --skip-js-errors --assertion-timeout 30000"

Travis CI

Due to the well-formed ecosystem of TravisCI, the configuration will be easier than Gitlab CI:

language: node_js
node_js: 6

# Enable container-based mode
sudo: false

# Switch distribution to Ubuntu 14.04
dist: trusty

addons:
  # Install Google Chrome
  # Ref1: https://docs.travis-ci.com/user/chrome
  # Ref2: https://docs.travis-ci.com/user/gui-and-headless-browsers/#Using-the-Chrome-addon-in-the-headless-mode
  # Ref3: https://iamakulov.com/notes/install-google-chrome-on-travis/
  chrome: stable

script:
  # Install npm packages
  - "npm install"
  # Run TestCafe
  - "./node_modules/.bin/testcafe 'path:`/usr/bin/google-chrome-stable` --headless --disable-gpu --remote-debugging-port=9222 --remote-debugging-address=0.0.0.0' test.js --skip-js-errors --assertion-timeout 30000"