Angular unit/karma tests can not connect to Chrome?

[reingroot]

Dear Sylvain,

I am very happy to have found your Docker image because I have been trying to get my Angular2 e2e/Protractor tests to run in a Docker environment. With this image that works.

However, my Angular unit/karma tests are not able to run. I get the following error message:

root@45525908b9da:/angular-project# ng test
Could not start watchman; falling back to NodeWatcher for file system events.
Visit http://ember-cli.com/user-guide/#watchman for more info.
Built project successfully. Stored in "dist/".
⠋ Building
START:
⠹ Building10 06 2016 20:13:26.954:INFO [karma]: Karma v0.13.22 server started at http://localhost:9876/
10 06 2016 20:13:26.965:INFO [launcher]: Starting browser Chrome

Build successful - 4986ms.

Slowest Trees                                 | Total               
----------------------------------------------+---------------------
BroccoliTypeScriptCompiler                    | 2743ms              
SASSPlugin                                             | 1069ms              
vendor                                        | 503ms               
HandlebarReplace                              | 290ms               

Slowest Trees (cumulative)                    | Total (avg)         
----------------------------------------------+---------------------
BroccoliTypeScriptCompiler (1)                | 2743ms              
SASSPlugin (1)                                | 1069ms              
vendor (1)                                    | 503ms               
HandlebarReplace (1)                          | 290ms               

10 06 2016 20:14:27.028:WARN [launcher]: Chrome have not captured in 60000 ms, killing.
10 06 2016 20:14:27.038:INFO [launcher]: Trying to start Chrome again (1/2).
10 06 2016 20:15:27.042:WARN [launcher]: Chrome have not captured in 60000 ms, killing.
10 06 2016 20:15:27.050:INFO [launcher]: Trying to start Chrome again (2/2).
10 06 2016 20:16:27.113:WARN [launcher]: Chrome have not captured in 60000 ms, killing.
10 06 2016 20:16:27.119:ERROR [launcher]: Chrome failed 2 times (timeout). Giving up.

Finished in 0 secs / 0 secs

Interestingly, on this image: https://hub.docker.com/r/pimterry/node-karma/~/dockerfile/ I CAN run my unit tests. But then the e2e tests fail.

I have been staring myself blind trying to figure out what's going on. But I am no Docker expert by any means. I hope you can shine some light on what I am missing and what I can do to fix it. Either in your image or otherwise.

Kind regards,
Rein

[sylvaindumont]

Hi,

I'm happy that my work may be useful for someone. 😃
In the default config of angular-cli karma doesn't run chrome in "no-sandbox" mode.

If you haven't already done that, replace

browsers: ['Chrome']

by

browsers: ['Chrome_travis_ci']

With this change, on a fresh angular-cli project, I get this :

root@9a984bd77691:/home/onetest# ng test
Could not start watchman; falling back to NodeWatcher for file system events.
Visit http://ember-cli.com/user-guide/#watchman for more info.
Built project successfully. Stored in "dist/".

Build successful - 886ms.

Slowest Trees                                 | Total
----------------------------------------------+---------------------
BroccoliTypeScriptCompiler                    | 623ms
vendor                                        | 223ms

Slowest Trees (cumulative)                    | Total (avg)
----------------------------------------------+---------------------
BroccoliTypeScriptCompiler (1)                | 623ms
vendor (1)                                    | 223ms

11 06 2016 15:21:56.343:WARN [karma]: No captured browser, open http://localhost:9876/
11 06 2016 15:21:56.357:INFO [karma]: Karma v0.13.22 server started at http://localhost:9876/
11 06 2016 15:21:56.362:INFO [launcher]: Starting browser Chrome
11 06 2016 15:22:05.764:INFO [Chrome 47.0.2526 (Linux 0.0.0)]: Connected on socket /#3wxcnKOIRFyOM1N6AAAA with id 90126463
Chrome 47.0.2526 (Linux 0.0.0): Executed 2 of 2 SUCCESS (0.02 secs / 0.013 secs)

[reingroot]

Thanks! I'll try this out and get back to you with the results.

[reingroot]

It worked! Got both the unit and the protractor test working! :)

Can I ask you another question? How do you start both your webserver (ng server) and run the protractor tests?

I'm currently using the following bash script:

#!/usr/bin/env bash

ng serve & # run in the background

sleep 30

# Run e2e tests
npm run e2e

[sylvaindumont]

In angular 1, I used grunt or gulp to launch e2e tests at serve ending, but I’ve stopped used them since angular2 helped me discover system.js, and since angular2 teams use broccoli.
Now I use pure js scripts, it reduces drastically the dependencies of my projects.

In angular-cli e2e tests, they have a clean way to execute ng e2e after ng serve

var path = require('path');
var child_process = require('child_process');

const ngBin = `node ${path.join(process.cwd(), 'bin', 'ng')}`;
var ngServePid;

function executor(resolve, reject) {
  'use strict';
  var serveProcess = child_process.exec(`${ngBin} serve`);
  var startedProtractor = false;
  ngServePid = serveProcess.pid;

  serveProcess.stdout.on('data', (data) => {
    if (/Build successful/.test(data) && !startedProtractor) {
      startedProtractor = true;
      child_process.exec(`${ngBin} e2e`, (error, stdout, stderr) => {
        if (error !== null) {
          reject(stderr);
        } else {
          resolve();
        }
      });
    } else if (/ failed with:/.test(data)) {
      reject(data);
    }
  });

  serveProcess.stderr.on('data', (data) => {
    reject(data);
  });
  serveProcess.on('close', (code) => {
    code === 0 ? resolve() : reject('ng serve command closed with error')
  });
}

new Promise(executor)
  .then(() => {
    if (ngServePid) treeKill(ngServePid);
  })
  .catch((msg) => {
    if (ngServePid) treeKill(ngServePid);
    throw new Error(msg);
  });

[reingroot]

Ah! That's awesome! How do you kick it of? Just put this script in a file (for example tests.js) and then run node tests.js? Or is this build-in Angular2 functionality?

[sylvaindumont]

Just put it in a file, and run it with node. It isn't a built-in angular2 functionality, it's just a piece of code from their e2e tests. It could be a cool functionality, but i think they don't want complicate the cli.

[reingroot]

Ah, I see they use it in their e2e test for testing the CLI itself (https://github.com/angular/angular-cli/blob/master/tests/e2e/e2e_workflow.spec.js). Pretty cool.

For now I'll stay with my command line script as it also does the job and is far less code ;)

By the way. I have seen my unit tests AND e2e tests working in your Docker. So that's great. Thanks for the support!

Kind regards,
Rein