Context
I have confirmed "green" builds on the master branch which is using angular-cli 1.0.0 and the old angular2 dependencies. My Objective is to upgrade from angular2 to angular4.
Post upgrade issue
- The application works
- The unit tests fail in karma using
ng test
andnpm run test
which are equivalent
Working configuration
specifically the package.json
is as follows.
...
"dependencies": {
"@angular/common": "^2.4.0",
"@angular/compiler": "^2.4.0",
"@angular/core": "^2.4.0",
"@angular/forms": "^2.4.0",
"@angular/http": "^2.4.0",
"@angular/platform-browser": "^2.4.0",
"@angular/platform-browser-dynamic": "^2.4.0",
"@angular/router": "^3.4.0",
...
},
"devDependencies": {
"@angular/cli": "1.0.0",
"@angular/compiler-cli": "^2.4.0",
...
}
With the following test result
Chromium 53.0.2785 (Ubuntu 0.0.0): Executed 82 of 83 (skipped 1) SUCCESS (5.674 secs / 0.061 secs)
Angular 4 upgrade fails the tests
When I try to upgrade the angular4 dependencies with a very specific diff the application runs successfully, however I get failed/repeated tests for the upgrade like so Chromium 53.0.2785 (Ubuntu 0.0.0): Executed 127 of 83 (32 FAILED) (skipped 2) (7.521 secs / 0.101 secs)
What I find fascinating about the result is that there are 44 tests run in addition to the number of tests I actually have. It also appears that the only tests that fail are the duplicate tests that are running and they fail directly after they succeed. On investigation is seems that these tests would fail if their before each were not run
Chrome 56.0.2924 (Linux 0.0.0): Executed 67 of 83 (13 FAILED) (0 secs / 0.11 secs)
✔ will raise a houseCreated event
Chrome 56.0.2924 (Linux 0.0.0) HouseListComponent when valid input is provided (while in create mode) will raise a houseCreated event FAILED
AssertionError: expected { Object (country, state, ...) } to equal { Object (country, state, ...) }
at Context.<anonymous> (webpack:///src/app/housing/components/edit/house-edit.component.spec.ts:69:40 <- src/test.ts:26683:54)
at ZoneDelegate.invoke (webpack:///~/zone.js/dist/zone.js:365:0 <- src/polyfills.ts:1520:26)
at ProxyZoneSpec.Array.concat.ProxyZoneSpec.onInvoke (webpack:///~/zone.js/dist/proxy.js:79:0 <- src/test.ts:88673:39)
at ZoneDelegate.invoke (webpack:///~/zone.js/dist/zone.js:364:0 <- src/polyfills.ts:1519:32)
at Zone.run (webpack:///~/zone.js/dist/zone.js:125:0 <- src/polyfills.ts:1280:43)
at Context.<anonymous> (webpack:///~/zone.js/dist/mocha-patch.js:88:0 <- src/test.ts:88521:33)
at webpack:///~/zone.js/dist/mocha-patch.js:140:0 <- src/test.ts:88573:33
at ZoneDelegate.invokeTask (webpack:///~/zone.js/dist/zone.js:398:0 <- src/polyfills.ts:1553:31)
at Zone.runTask (webpack:///~/zone.js/dist/zone.js:165:0 <- src/polyfills.ts:1320:47)
at drainMicroTaskQueue (webpack:///~/zone.js/dist/zone.js:593:0 <- src/polyfills.ts:1748:35)
at ZoneTask.invoke (webpack:///~/zone.js/dist/zone.js:464:0 <- src/polyfills.ts:1619:25)
at timer (webpack:///~/zone.js/dist/zone.js:1540:0 <- src/polyfills.ts:2695:29)
Chrome 56.0.2924 (Linux 0.0.0): Executed 68 of 83 (14 FAILED) (0 secs / 0.111 secs)
✖ will raise a houseCreated event
broken configuration
...
"dependencies": {
"@angular/common": "^4.0.1",
"@angular/compiler": "^4.0.1",
"@angular/core": "^4.0.1",
"@angular/forms": "^4.0.1",
"@angular/http": "^4.0.1",
"@angular/platform-browser": "^4.0.1",
"@angular/platform-browser-dynamic": "^4.0.1",
"@angular/router": "^4.0.1",
...
},
"devDependencies": {
"@angular/cli": "1.0.0",
"@angular/compiler-cli": "^4.0.1",
...
}
Same tests on a different runner
In attempt to identify if the issue was the tests or the runner, I ran the exact same tests with the wallabyjs runner and I get No failing tests, 82 passing
which is perfectly inline with master using the upgraded angular4 dependencies. This would seem to indicate that the issues is specific to karma and not the tests.
resources
Errors
There are a number of test errors, however they all seem to be related to beforeEach
. The test module should not already be instantiated which seems to be a weird side effect from the repeating tests.
Chrome 56.0.2924 (Linux 0.0.0) car reducer "before each" hook for "will return array removes existing values when state is not empty" FAILED
Error: Cannot configure the test module when the test module has already been instantiated. Make sure you are not using `inject` before `TestBed.configureTestingModule`.
at TestBed.Array.concat.TestBed._assertNotInstantiated (webpack:///~/@angular/core/@angular/core/testing.es5.js:749:0 <- src/test.ts:25844:19) [ProxyZone]
at TestBed.Array.concat.TestBed.configureTestingModule (webpack:///~/@angular/core/@angular/core/testing.es5.js:671:0 <- src/test.ts:25766:14) [ProxyZone]
at Function.Array.concat.TestBed.configureTestingModule (webpack:///~/@angular/core/@angular/core/testing.es5.js:576:0 <- src/test.ts:25671:22) [ProxyZone]
at Context.<anonymous> (webpack:///src/app/car/reducers/car.reducer.spec.ts:30:12 <- src/test.ts:31440:27) [ProxyZone]
at ProxyZoneSpec.Array.concat.ProxyZoneSpec.onInvoke (webpack:///~/zone.js/dist/proxy.js:79:0 <- src/test.ts:88673:39) [ProxyZone]
at Zone.run (webpack:///~/zone.js/dist/zone.js:125:0 <- src/polyfills.ts:1280:43) [<root> => ProxyZone]
at Context.<anonymous> (webpack:///~/zone.js/dist/mocha-patch.js:88:0 <- src/test.ts:88521:33) [<root>]
Then after the before each fails then we get more errors regarding the property call
Chrome 56.0.2924 (Linux 0.0.0) car reducer "before each" hook for "will return array removes existing values when state is not empty" FAILED
TypeError: Cannot read property 'call' of undefined
at ZoneDelegate.invokeTask (webpack:///~/zone.js/dist/zone.js:398:0 <- src/polyfills.ts:1553:31)
at Zone.runTask (webpack:///~/zone.js/dist/zone.js:165:0 <- src/polyfills.ts:1320:47)
at ZoneTask.invoke (webpack:///~/zone.js/dist/zone.js:460:0 <- src/polyfills.ts:1615:38)
at timer (webpack:///~/zone.js/dist/zone.js:1540:0 <- src/polyfills.ts:2695:29)
Chrome 56.0.2924 (Linux 0.0.0): Executed 45 of 83 (8 FAILED) (0 secs / 0.092 secs)