Make "npm test" run Karma tests #140

msabramo · 2016-07-09T19:28:21Z

This makes npm test run unit tests with Karma.
I also added some tests for routes in app/app.spec.js.

Result is this:

[marca@marca-mac2 docker-registry-frontend_2]$ npm test

> docker-registry-frontend@0.0.2 pretest /Users/marca/dev/git-repos/docker-registry-frontend_2
> npm install


> docker-registry-frontend@0.0.2 postinstall /Users/marca/dev/git-repos/docker-registry-frontend_2
> bower install


> docker-registry-frontend@0.0.2 test /Users/marca/dev/git-repos/docker-registry-frontend_2
> karma start test/karma.conf.js

11 07 2016 19:39:20.266:WARN [karma]: No captured browser, open http://localhost:8080/
11 07 2016 19:39:20.276:WARN [karma]: Port 8080 in use
11 07 2016 19:39:20.277:INFO [karma]: Karma v1.1.1 server started at http://localhost:8081/
11 07 2016 19:39:20.277:INFO [launcher]: Launching browser PhantomJS with unlimited concurrency
11 07 2016 19:39:20.312:INFO [launcher]: Starting browser PhantomJS
11 07 2016 19:39:20.781:INFO [PhantomJS 2.1.1 (Mac OS X 0.0.0)]: Connected on socket /#fVTIrC5Oir1PvLqcAAAA with id 38487814

  docker-registry-frontend
    ✓ /home should display home page
    ✓ /repositories should display repository list page
    ✓ /repositories/10 should display repository list page
    ✓ /repositories/20 should display repository list page
    ✓ URL with repositoryUser and repositoryName and no tagsPerPage should display repository detail page
    ✓ URL with repositoryUser and repositoryName and tagsPerPage should display repository detail page
    ✓ URL with repositoryName but no repositoryUser and tagsPerPage should display repository detail page
    ✓ /about should display about page
    ✓ /tag/repositoryUser/repositoryName/latest should display tag detail page
    ✓ /image/88e37c7099fa should display image detail page
    ✓ /image/88e37c7099fa/tag should display create tag page
    ✓ /unknown-url should display home page

  RepositoryListController
    ✓ should attach some keys to the scope

  MainController
    ✓ should attach an appVersion and registryHost to the scope

PhantomJS 2.1.1 (Mac OS X 0.0.0): Executed 14 of 14 SUCCESS (0.008 secs / 0.082 secs)
TOTAL: 14 SUCCESS

Fixes #139

Result is this: ``` $ npm test > docker-registry-frontend@0.0.2 pretest /Users/marca/dev/git-repos/docker-registry-frontend_2 > npm install > docker-registry-frontend@0.0.2 postinstall /Users/marca/dev/git-repos/docker-registry-frontend_2 > bower install > docker-registry-frontend@0.0.2 test /Users/marca/dev/git-repos/docker-registry-frontend_2 > karma start test/karma.conf.js 09 07 2016 13:36:20.771:WARN [karma]: No captured browser, open http://localhost:8080/ 09 07 2016 13:36:20.781:INFO [karma]: Karma v1.1.1 server started at http://localhost:8080/ 09 07 2016 13:36:20.782:INFO [launcher]: Launching browser PhantomJS with unlimited concurrency 09 07 2016 13:36:20.788:INFO [launcher]: Starting browser PhantomJS 09 07 2016 13:36:21.250:INFO [PhantomJS 2.1.1 (Mac OS X 0.0.0)]: Connected on socket /#Z4MF21dfMgThOi3zAAAA with id 9538616 PhantomJS 2.1.1 (Mac OS X 0.0.0) Controller: MainCtrl should attach a list of awesomeThings to the scope FAILED forEach@bower_components/angular/angular.js:326:24 loadModules@bower_components/angular/angular.js:4115:12 createInjector@bower_components/angular/angular.js:4041:22 workFn@bower_components/angular-mocks/angular-mocks.js:2464:60 loaded@http://localhost:8080/context.js:151:17 bower_components/angular/angular.js:4155:53 TypeError: undefined is not an object (evaluating 'scope.awesomeThings') in test/spec/controllers/main.js (line 20) test/spec/controllers/main.js:20:17 loaded@http://localhost:8080/context.js:151:17 PhantomJS 2.1.1 (Mac OS X 0.0.0): Executed 1 of 1 (1 FAILED) ERROR (0.005 secs / 0.006 secs) ``` Fixes kwk#139

This makes the `MainController` tests pass. ``` $ npm test > docker-registry-frontend@0.0.2 pretest /Users/marca/dev/git-repos/docker-registry-frontend_2 > npm install > docker-registry-frontend@0.0.2 postinstall /Users/marca/dev/git-repos/docker-registry-frontend_2 > bower install > docker-registry-frontend@0.0.2 test /Users/marca/dev/git-repos/docker-registry-frontend_2 > karma start test/karma.conf.js 09 07 2016 17:06:59.974:WARN [karma]: No captured browser, open http://localhost:8080/ 09 07 2016 17:06:59.986:INFO [karma]: Karma v1.1.1 server started at http://localhost:8080/ 09 07 2016 17:06:59.986:INFO [launcher]: Launching browser PhantomJS with unlimited concurrency 09 07 2016 17:07:00.133:INFO [launcher]: Starting browser PhantomJS 09 07 2016 17:07:01.051:INFO [PhantomJS 2.1.1 (Mac OS X 0.0.0)]: Connected on socket /#6enEIdsugSVdKVioAAAA with id 62465837 PhantomJS 2.1.1 (Mac OS X 0.0.0): Executed 1 of 1 SUCCESS (0.004 secs / 0.024 secs) ```

E.g.: - angular-bootstrap, - angular-bootstrap-checkbox - angular-filter - angular-loading-bar - angular-moment - angular-smart-table I also alphabetized the list to make it easier to check if something is already included.

`app/app.spec.js` contains tests for various routes, which should be very useful for finding and fixing routing bugs. See: - kwk#97 - kwk#100 - kwk#104 - kwk#121

In `MainController`, depend on the `registry-services` module instead of the `registry-host-services` module.

Remove `app/services/registry-host-services.js` because it seems to be an older, unused version of `app/services/registry-services.js`

Specify that the `repository-list-controller` module depends on `ngRoute` and `ui.bootstrap` modules. Otherwise controller tests of this module fail.

In `repository-list-controller`, do: $scope.repositories = data; in the promise callback. Otherwise, the new tests in `app/repository/repository-list-controller.spec.js` fail. This is because promises get resolved in templates but not in until tests -- see http://stackoverflow.com/questions/15048132/angularjs-promise-not-being-resolved-in-unit-test

in `app/repository/repository-list-controller.spec.js`. RepositoryListController ✓ should attach some keys to the scope

Use `DOCKER_REGISTRY_HOST` and `DOCKER_REGISTRY_PORT` environment variables so that one can specify a custom Docker registry server while developing, without hacking `Gruntfile.js`.

kwk · 2016-07-19T06:41:27Z

@msabramo Thank you so much for contributing tests to this project. It should help getting all the open PRs merged in more quickly.

See also PR #140 for more information on tests.

kwk · 2016-07-19T10:29:03Z

package.json

+    "postinstall": "bower install",
+    "pretest": "npm install",
+    "test": "karma start test/karma.conf.js",
+    "test-single-run": "karma start test/karma.conf.js --single-run"


@msabramo Maybe this is a dump question but how can I trigger this test-single-run? Just npm test-single-run won't work. As you can see here, travis will stuck after a while when running npm test. I know that this is normal and that it allows me open various browsers to run my tests.

@kwk There are no dumb questions. Use npm run test-single-run (note run in there). npm test is a special case, but in general you need to use npm run (or npm run-script) to execute the scripts that you define in package.json.

$ npm run test-single-run > docker-registry-frontend@0.0.2 test-single-run /Users/marca/dev/git-repos/docker-registry-frontend_2 > karma start test/karma.conf.js --single-run 19 07 2016 06:29:24.145:WARN [karma]: Port 8080 in use 19 07 2016 06:29:24.148:WARN [karma]: Port 8081 in use 19 07 2016 06:29:24.148:INFO [karma]: Karma v1.1.1 server started at http://localhost:8082/ 19 07 2016 06:29:24.149:INFO [launcher]: Launching browser PhantomJS with unlimited concurrency 19 07 2016 06:29:24.157:INFO [launcher]: Starting browser PhantomJS 19 07 2016 06:29:24.613:INFO [PhantomJS 2.1.1 (Mac OS X 0.0.0)]: Connected on socket /#L0dobW7vCDANyy35AAAA with id 59001397 docker-registry-frontend ✓ /home should display home page ✓ /repositories should display repository list page ✓ /repositories/10 should display repository list page ✓ /repositories/20 should display repository list page ✓ URL with repositoryUser and repositoryName and no tagsPerPage should display repository detail page ✓ URL with repositoryUser and repositoryName and tagsPerPage should display repository detail page ✓ URL with repositoryName but no repositoryUser and no tagsPerPage should display repository detail page ✓ URL with repositoryName but no repositoryUser and tagsPerPage should display repository detail page ✓ /about should display about page ✓ /tag/repositoryUser/repositoryName/latest should display tag detail page ✓ /image/88e37c7099fa should display image detail page ✓ /image/88e37c7099fa/tag should display create tag page ✓ /unknown-url should display home page RepositoryListController ✓ should attach some keys to the scope MainController ✓ should attach an appVersion and registryHost to the scope PhantomJS 2.1.1 (Mac OS X 0.0.0): Executed 15 of 15 SUCCESS (0.008 secs / 0.077 secs) TOTAL: 15 SUCCESS

See https://docs.npmjs.com/cli/run-script for more info on this.

I was going to submit a PR to change it in .travis.yml but I see that you are a step ahead of me.

Crossing my fingers and hoping that the Travis CI build passes!

@msabramo Thank you for this. I totally forgot about run. It probably will not pass because in pretest you do an npm install which I have to do before running the single test as well, right?

Hmmm yeah, you are probably right. And I don't know if there is a way to have a pre step for a script. I guess the easiest thing to do is to have the .travis.yml do npm install.

It might work on Travis perhaps, because maybe the default for a node_js project is to do npm install for the install step.

That seems to be what they are saying (I think) at https://docs.travis-ci.com/user/languages/javascript-with-nodejs#Travis-CI-uses-npm

Just found this:

https://karma-runner.github.io/latest/plus/travis.html

Though that will work, it doesn't seem ideal because then npm test won't run continuously, which is kind of nice for development. I guess one could use a script for that, like test-continuously or something.

Here's what angular-seed does:

https://github.com/angular/angular-seed/blob/master/.travis.yml

script: - node_modules/.bin/karma start karma.conf.js --no-auto-watch --single-run --reporters=dots --browsers=Firefox

From #146:

Awesome!

msabramo force-pushed the make-karma-work branch 3 times, most recently from fcd4218 to a3b141c Compare July 9, 2016 20:54

msabramo force-pushed the make-karma-work branch from a3b141c to 080109e Compare July 10, 2016 00:06

msabramo force-pushed the make-karma-work branch from 080109e to 1037d8e Compare July 10, 2016 00:08

msabramo added 13 commits July 10, 2016 11:15

test/karma.conf.js: Add more files

02fab80

E.g.: - angular-bootstrap, - angular-bootstrap-checkbox - angular-filter - angular-loading-bar - angular-moment - angular-smart-table I also alphabetized the list to make it easier to check if something is already included.

test/karma.conf.js: Add 'dots' reporter

8c03b03

Add app/app.spec.js

d0404bf

`app/app.spec.js` contains tests for various routes, which should be very useful for finding and fixing routing bugs. See: - kwk#97 - kwk#100 - kwk#104 - kwk#121

Enable junit and spec Karma reporters

1a30a65

app/app.spec.js: Check scope attributes

a9fd8db

app/app.spec.js: Check scope.appMode

205fc7e

test/spec/controllers/main.js: Check appVersion & registryHost

19c4762

MainController: use registry-services

af36dae

In `MainController`, depend on the `registry-services` module instead of the `registry-host-services` module.

Remove app/services/registry-host-services.js

351fc22

Remove `app/services/registry-host-services.js` because it seems to be an older, unused version of `app/services/registry-services.js`

repository-list-controller: Add dependencies

99fdbd1

Specify that the `repository-list-controller` module depends on `ngRoute` and `ui.bootstrap` modules. Otherwise controller tests of this module fail.

Add unit test for RepositoryListController

5463786

in `app/repository/repository-list-controller.spec.js`. RepositoryListController ✓ should attach some keys to the scope

Gruntfile.js: Use DOCKER_REGISTRY_{HOST,PORT}

4459aab

Use `DOCKER_REGISTRY_HOST` and `DOCKER_REGISTRY_PORT` environment variables so that one can specify a custom Docker registry server while developing, without hacking `Gruntfile.js`.

kwk merged commit ea2bcd5 into kwk:v2 Jul 19, 2016

kwk added a commit that referenced this pull request Jul 19, 2016

We need bzip2 in container to extract PhantomJS

361825c

See also PR #140 for more information on tests.

kwk reviewed Jul 19, 2016
View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Make "npm test" run Karma tests #140

Make "npm test" run Karma tests #140

msabramo commented Jul 9, 2016 •

edited

Loading

kwk commented Jul 19, 2016

kwk Jul 19, 2016

msabramo Jul 19, 2016 •

edited

Loading

msabramo Jul 19, 2016

kwk Jul 19, 2016

msabramo Jul 19, 2016

msabramo Jul 19, 2016 •

edited

Loading

msabramo Jul 19, 2016 •

edited

Loading

msabramo Jul 19, 2016 •

edited

Loading

msabramo Jul 19, 2016 •

edited

Loading

Make "npm test" run Karma tests #140

Make "npm test" run Karma tests #140

Conversation

msabramo commented Jul 9, 2016 • edited Loading

kwk commented Jul 19, 2016

kwk Jul 19, 2016

Choose a reason for hiding this comment

msabramo Jul 19, 2016 • edited Loading

Choose a reason for hiding this comment

msabramo Jul 19, 2016

Choose a reason for hiding this comment

kwk Jul 19, 2016

Choose a reason for hiding this comment

msabramo Jul 19, 2016

Choose a reason for hiding this comment

msabramo Jul 19, 2016 • edited Loading

Choose a reason for hiding this comment

msabramo Jul 19, 2016 • edited Loading

Choose a reason for hiding this comment

msabramo Jul 19, 2016 • edited Loading

Choose a reason for hiding this comment

msabramo Jul 19, 2016 • edited Loading

Choose a reason for hiding this comment

msabramo commented Jul 9, 2016 •

edited

Loading

msabramo Jul 19, 2016 •

edited

Loading

msabramo Jul 19, 2016 •

edited

Loading

msabramo Jul 19, 2016 •

edited

Loading

msabramo Jul 19, 2016 •

edited

Loading

msabramo Jul 19, 2016 •

edited

Loading