Angular: how to debug an insert error
I sometimes get an insert error in unit tests that looks like below and it doesn't give me an idea of which dependency I should fix. I tried to play with the providers I have in the config TestBed.configureTestingModule
, but it didn't help. Anyone have any ideas how I can further investigate the problem?
✖ should create
Chrome 57.0.2987 (Mac OS X 10.11.0)
Error
at injectionError (webpack:///~/@angular/core/@angular/core.es5.js:1232:21 <- src/test.ts:1992:86) [angular]
at noProviderError (webpack:///~/@angular/core/@angular/core.es5.js:1270:0 <- src/test.ts:2030:12) [angular]
at ReflectiveInjector_.Array.concat.ReflectiveInjector_._throwOrNull (webpack:///~/@angular/core/@angular/core.es5.js:2772:0 <- src/test.ts:3532:19) [angular]
at ReflectiveInjector_.Array.concat.ReflectiveInjector_._getByKeyDefault (webpack:///~/@angular/core/@angular/core.es5.js:2811:0 <- src/test.ts:3571:25) [angular]
at ReflectiveInjector_.Array.concat.ReflectiveInjector_._getByKey (webpack:///~/@angular/core/@angular/core.es5.js:2743:0 <- src/test.ts:3503:25) [angular]
at ReflectiveInjector_.Array.concat.ReflectiveInjector_.get (webpack:///~/@angular/core/@angular/core.es5.js:2612:0 <- src/test.ts:3372:21) [angular]
at DynamicTestModuleInjector.Array.concat.NgModuleInjector.get (webpack:///~/@angular/core/@angular/core.es5.js:3577:0 <- src/test.ts:4337:52) [angular]
at resolveDep (webpack:///~/@angular/core/@angular/core.es5.js:10981:0 <- src/test.ts:11741:45) [angular]
at createClass (webpack:///~/@angular/core/@angular/core.es5.js:10849:0 <- src/test.ts:11609:32) [angular]
at createDirectiveInstance (webpack:///~/@angular/core/@angular/core.es5.js:10675:21 <- src/test.ts:11435:37) [angular]
at createViewNodes (webpack:///~/@angular/core/@angular/core.es5.js:12024:33 <- src/test.ts:12784:49) [angular]
at callViewAction (webpack:///~/@angular/core/@angular/core.es5.js:12394:0 <- src/test.ts:13154:13) [angular]
at execComponentViewsAction (webpack:///~/@angular/core/@angular/core.es5.js:12333:0 <- src/test.ts:13093:13) [angular]
at createViewNodes (webpack:///~/@angular/core/@angular/core.es5.js:12051:0 <- src/test.ts:12811:5) [angular]
I use: angular: 4.0.0
ng-cli: 1.0.0
source to share
Found one of the possible ways. The stack trace shows that there is a method resolveDep
that raises the error:
at resolveDep (webpack:///~/@angular/core/@angular/core.es5.js:10982:0 <- src/test.ts:11742:45) [angular]
so I put a breakpoint inside this method:
debugger;
return startView.root.ngModule.injector.get(depDef.token, notFoundValue);
and an updated Karma browser page as described in the docs: https://angular.io/docs/ts/latest/testing/#!#test-debugging
I could see what dependencies are required to test the variable devDep
:
source to share