Karma testing output not the same in angular/cli versions after 1.0.6

Bug Report or Feature Request (mark with an x)

- [x] bug report -> please search issues before submitting
- [ ] feature request

Versions.

Summary:

@angular/cli: 1.1.0 (replicated on 1.2.0-beta.0)
node: v6.9.1 (replicated on 8.0.0)
npm: 4.6.1 (replicated on 5.0.0)
OS: macOS Sierra 10.12.4 (replicated on Windows 7 too)

Full:

@angular/cli: 1.1.0
node: 6.9.1
os: darwin x64
@angular/animations: 4.1.3
@angular/common: 4.1.3
@angular/compiler: 4.1.3
@angular/compiler-cli: 4.1.3
@angular/core: 4.1.3
@angular/forms: 4.1.3
@angular/http: 4.1.3
@angular/platform-browser: 4.1.3
@angular/platform-browser-dynamic: 4.1.3
@angular/platform-server: 4.1.3
@angular/router: 4.1.3
@angular/cli: 1.1.0

Repro steps.

Create a project, write some unit tests, make at least one test fail (e.g. expect true to be false), run ng test

karma.conf.js has these features:

    frameworks: ['jasmine', '@angular/cli'],
    preprocessors: {
      './src/test.ts': ['@angular/cli']
    },
    reporters: ['progress'],

package.json has these features (probably irrelevant since older versions of these packages were working fine too before the cli upgrade):

    "jasmine-core": "~2.6.2",
    "karma": "~1.7.0",
    "karma-jasmine": "~1.1.0",
    "karma-cli": "~1.0.1",

The log given by the failure.

When using later versions of @angular/cli the ng test output looks something like this:

        _getByKey@http://localhost:9876/_karma_webpack_/vendor.bundle.js:34382:41
        get@http://localhost:9876/_karma_webpack_/vendor.bundle.js:34251:30
        get@http://localhost:9876/_karma_webpack_/vendor.bundle.js:35219:55
        resolveDep@http://localhost:9876/_karma_webpack_/vendor.bundle.js:42680:48
        createClass@http://localhost:9876/_karma_webpack_/vendor.bundle.js:42536:45
        createDirectiveInstance@http://localhost:9876/_karma_webpack_/vendor.bundle.js:42364:48
        createViewNodes@http://localhost:9876/_karma_webpack_/vendor.bundle.js:43727:72
        createRootView@http://localhost:9876/_karma_webpack_/vendor.bundle.js:43632:20
        callWithDebugContext@http://localhost:9876/_karma_webpack_/vendor.bundle.js:44847:47
        debugCreateRootView@http://localhost:9876/_karma_webpack_/vendor.bundle.js:44307:32
        create@http://localhost:9876/_karma_webpack_/vendor.bundle.js:41553:60
        initComponent@http://localhost:9876/_karma_webpack_/vendor.bundle.js:46642:55
        invoke@http://localhost:9876/_karma_webpack_/polyfills.bundle.js:2732:31
        onInvoke@http://localhost:9876/_karma_webpack_/vendor.bundle.js:106204:45
        invoke@http://localhost:9876/_karma_webpack_/polyfills.bundle.js:2731:40
        onInvoke@http://localhost:9876/_karma_webpack_/vendor.bundle.js:35790:43
        invoke@http://localhost:9876/_karma_webpack_/polyfills.bundle.js:2731:40
        run@http://localhost:9876/_karma_webpack_/polyfills.bundle.js:2482:49
        run@http://localhost:9876/_karma_webpack_/vendor.bundle.js:35658:65
        createComponent@http://localhost:9876/_karma_webpack_/vendor.bundle.js:46645:61
        createComponent@http://localhost:9876/_karma_webpack_/vendor.bundle.js:46449:44

Desired functionality.

When using @angular/cli 1.0.6 (and 1.0.1 and earlier) the output of ng test would look something like this:

        _throwOrNull@webpack:///~/@angular/core/@angular/core.es5.js:2770:0 <- src/test.ts:4787:45
        _getByKeyDefault@webpack:///~/@angular/core/@angular/core.es5.js:2809:0 <- src/test.ts:4826:37
        _getByKey@webpack:///~/@angular/core/@angular/core.es5.js:2741:0 <- src/test.ts:4758:41
        get@webpack:///~/@angular/core/@angular/core.es5.js:2610:0 <- src/test.ts:4627:30
        get@webpack:///~/@angular/core/@angular/core.es5.js:3578:0 <- src/test.ts:5595:55
        resolveDep@webpack:///~/@angular/core/@angular/core.es5.js:11039:0 <- src/test.ts:13056:48
        createClass@webpack:///~/@angular/core/@angular/core.es5.js:10895:0 <- src/test.ts:12912:45
        createDirectiveInstance@webpack:///~/@angular/core/@angular/core.es5.js:10723:21 <- src/test.ts:12740:48
        createViewNodes@webpack:///~/@angular/core/@angular/core.es5.js:12086:33 <- src/test.ts:14103:72
        createRootView@webpack:///~/@angular/core/@angular/core.es5.js:11991:0 <- src/test.ts:14008:20
        callWithDebugContext@webpack:///~/@angular/core/@angular/core.es5.js:13206:25 <- src/test.ts:15223:47
        debugCreateRootView@webpack:///~/@angular/core/@angular/core.es5.js:12666:0 <- src/test.ts:14683:32
        create@webpack:///~/@angular/core/@angular/core.es5.js:9912:25 <- src/test.ts:11929:60
        initComponent@webpack:///~/@angular/core/@angular/core/testing.es5.js:803:0 <- src/test.ts:17338:55
        invoke@webpack:///~/zone.js/dist/zone.js:391:0 <- src/polyfills.ts:1546:31
        onInvoke@webpack:///~/zone.js/dist/proxy.js:79:0 <- src/test.ts:96647:45
        invoke@webpack:///~/zone.js/dist/zone.js:390:0 <- src/polyfills.ts:1545:40
        onInvoke@webpack:///~/@angular/core/@angular/core.es5.js:4149:0 <- src/test.ts:6166:43
        invoke@webpack:///~/zone.js/dist/zone.js:390:0 <- src/polyfills.ts:1545:40

Mention any other details that might be useful.

Please let me know if I should clarify anything. I confirmed the error is caused by angular-cli: when I rolled back to version 1.0.6 the ng test unit test errors were logged as they were logged previously (as desired).

[whyboris]

Issue reproduced with a clean-install using command ng new cli106: https://github.com/whyboris/cli106 Generated using globally-installed @angular/cli@1.0.6 with no changes except the addition of a failing test: https://github.com/whyboris/cli106/commit/ffb9133cb2fd099e26e38cf759d1e9a2b1471448 This repository will generate errors that are expected: 1.0.6 error log:

Expected 'hello there' to be 'hello!'.
at Object.<anonymous> (webpack:///src/app/app.component.spec.ts:45:30 <- src/test.ts:51489:37)
at ZoneDelegate.invoke (webpack:///~/zone.js/dist/zone.js:391:0 <- src/polyfills.ts:1546:26)
at ProxyZoneSpec.Array.concat.ProxyZoneSpec.onInvoke (webpack:///~/zone.js/dist/proxy.js:79:0 <- src/test.ts:52534:39)

notice the app.component.spec.ts while the 45:30 is not the correct location of the error, at least the file where the error occurred is easily seen.

Now change the package.json devDependency from "@angular/cli": "1.0.6", to "@angular/cli": "1.1.0", and run npm install and run ng test

1.1.0 error log:

Expected 'hello there' to be 'hello!'.
at Object.<anonymous> (http://localhost:9876/_karma_webpack_/main.bundle.js:106:37)
at ZoneDelegate.webpackJsonp../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (http://localhost:9876/_karma_webpack_/polyfills.bundle.js:2732:26)
at ProxyZoneSpec.webpackJsonp../node_modules/zone.js/dist/proxy.js.ProxyZoneSpec.onInvoke (http://localhost:9876/_karma_webpack_/vendor.bundle.js:54685:39)
at ZoneDelegate.webpackJsonp../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (http://localhost:9876/_karma_webpack_/polyfills.bundle.js:2731:32)

Notice that the stack trace no longer includes app.component.spec.ts

[filipesilva]

https://github.com/angular/angular-cli/pull/6968 is marked as a fix so ti should be in the next patch release, after being merged. Releases happen on wednesday-thursday usually.