e2e testing of VueJS app in gitlab-ci

Question

I have generated a VueJS project using vue-cli, including end to end tests with Nightswatch.js.

I'm using the following .gitlab-ci.yml file

services:
  - selenium/standalone-chrome

stages:
  - test
  - pages

test:
  image: node:6.11
  stage: test
  before_script:
    - node -v
    - npm -v
  script:
    - npm install
    - npm test

pages:
  image: node:6.11
  stage: pages
  before_script:
    - node -v
    - npm -v
  script:
    - npm install
    - npm run build
    - cp -R ./dist ./public
    - cd ./public
    - ls
  artifacts:
    paths:
      - public
  only:
    - master

This is the nightswatch.conf.js file

require('babel-register')
var config = require('../../config')

// http://nightwatchjs.org/gettingstarted#settings-file
module.exports = {
  src_folders: ['test/e2e/specs'],
  output_folder: 'test/e2e/reports',
  custom_assertions_path: ['test/e2e/custom-assertions'],

  selenium: {
    start_process: true,
    server_path: require('selenium-server').path,
    host: '127.0.0.1',
    port: 4444,
    cli_args: {
      'webdriver.chrome.driver': require('chromedriver').path
    }
  },

  test_settings: {
    default: {
      selenium_port: 4444,
      selenium_host: 'localhost',
      silent: true,
      globals: {
        devServerURL: 'http://localhost:' + (process.env.PORT || config.dev.port)
      }
    },

    chrome: {
      desiredCapabilities: {
        browserName: 'chrome',
        javascriptEnabled: true,
        acceptSslCerts: true
      }
    },

    firefox: {
      desiredCapabilities: {
        browserName: 'firefox',
        javascriptEnabled: true,
        acceptSslCerts: true
      }
    }
  }
}

In Gitlab-CI, the job passes but looking at the log only the unit tests are passing, not the end to end tests.

> node test/e2e/runner.js

Starting selenium server... 
An error occurred while trying to start Selenium. Check if JAVA is installed on your machine.
{ Error: spawn java ENOENT
    at exports._errnoException (util.js:1020:11)
    at Process.ChildProcess._handle.onexit (internal/child_process.js:197:32)
    at onErrorNT (internal/child_process.js:376:16)
    at _combinedTickCallback (internal/process/next_tick.js:80:11)
    at process._tickCallback (internal/process/next_tick.js:104:9)
    at Module.runMain (module.js:606:11)
    at run (bootstrap_node.js:383:7)
    at startup (bootstrap_node.js:149:9)
    at bootstrap_node.js:496:3
  code: 'ENOENT',
  errno: 'ENOENT',
  syscall: 'spawn java',
  path: 'java',
  spawnargs: 
   [ '-Dwebdriver.chrome.driver=/builds/Overdrivr/frontend/node_modules/chromedriver/lib/chromedriver/chromedriver',
     '-jar',
     '/builds/Overdrivr/frontend/node_modules/selenium-server/lib/runner/selenium-server-standalone-3.8.1.jar',
     '-port',
     4444 ] }
INFO Selenium process finished.
Job succeeded

How can I properly configure gitlab-ci or nightswatch to run e2e tests in Gitlab-CI ?

Answer 1

Ok, now that I looked at your config and your compose file some more I think I see your issue. First thing you need to do is give your selenium/standalone-chrome service a name in the .yml file. The problem is you are trying to launch selenium standalone in your tests container (the node image) which doesn't have java installed. However, the selenium/standalone-chrome image does and this is where you want to point your tests instead of localhost

services:
  "chrome"
  - selenium/standalone-chrome

#...rest of file can stay the same

The second thing you need to do is remove the selenium section entirely from your nightwatch config and point selenium_host under test_settings at your chrome service.

selenium_host: 'chrome',

Here is a nightwatch.json and docker-compose.yml that is working for me.

docker-compose.yml

version: '3'
services:  
chrome:
  image: selenium/standalone-chrome
tests:
  image: nightwatch-tests
  environment: 
    - ENV_PASS=${ENV_PASS}
  depends_on:
    - chrome

nightwatch.json

{
  "src_folders": [
    "nw_tests"
  ],
  "output_folder": "nw_reports",
  "page_objects_path": "./nw_tests/pages",
  "globals_path": "globals.js",
  "test_workers": false,  
  "test_settings": {
    "default": {
      "launchUrl": "https://mylaunchurl/login",
      "selenium_port": 4444,
      "selenium_host": "chrome",
      "silent": true,
      "screenshots": {
        "enabled": true,
        "path": "nw_screenshots"
      },
      "desiredCapabilities": {
        "browserName": "chrome",
        "chromeOptions" : {
          "args": ["deny-permission-prompts"],
          "prefs": {
            "profile.default_content_settings.popups": 0,
            "download.prompt_for_download": false
          }
        }
      }
    }
  }
}