Testing - intermittent error: "Failed: selector" # root0 "did not match elements,

I am working on creating an application on the beta version of Angular2, and when I run my test case, I accidentally get an error message:

The selector "# root0" does not match element errors.

Security Code:

@Component({ template: '', directives: [GroupBox, GroupBoxHeader] }) class TestComponent { } describe('group-box control', () => { it('should show the title', injectAsync([TestComponentBuilder], (tcb) => { return tcb.overrideTemplate(TestComponent, '<group-box><group-box-header>Title Content</group-box-header></group-box>') .createAsync(TestComponent).then( (fixture) => { fixture.detectChanges(); let compiled = fixture.debugElement.nativeElement; expect(compiled).toContainText('Title Content'); }); })); it('should show the body', injectAsync([TestComponentBuilder], (tcb) => { return tcb.overrideTemplate(TestComponent, '<group-box><group-box-header>Title Content</group-box-header>Body Content</group-box>') .createAsync(TestComponent).then( (fixture) => { fixture.detectChanges(); let compiled = fixture.debugElement.nativeElement; expect(compiled).toContainText('Body Content'); }); })); }); 

Im using Karma with Jasmine following the guidelines https://github.com/juliemr/ng2-test-seed

The following repository reproduces the error: https://github.com/cangosta/ng2_testing_controls

Stacktrace:

14.01.2016 11: 40: 32.073: INFO [karma]: the Karma server v0.13.19 started with http: // localhost: 9876/14 01 2016 11: 40: 32.078: INFO [launcher]: launching the Chrome browser 01.14.2016 11: 40: 32.669: INFO [Chrome 47.0.2526 (Windows 8.1 0.0.0)]: connected to the / # 9hKZqsNbKFPfYWzIAAAA connector with the identifier 50428936 Chrome 47.0.2526 (Windows 8.1 0.0.0) group control should show the body FAILED Error: selector "# root0" does not match any element Error: the selector "# root0" does not match any element in the new BaseException (C: /Projectos/Fontes/Stratus-HTML/build/assets/js/angular2.dev.js: 8080: 21) in DomRenderer_.createRootHostView (C: /Projectos/Fontes/Stratus-HTML/build/assets/js/angular2.dev.js: 15248: 15) in AppViewManager_.createRootHostView (C: /Projectos/Fontes/Stratus-HTML/build/assets/js/angular2.dev.js: 11265: 52) in C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2.dev.js: 14531: 46 in Zone.run (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills.js: 138: 17) in Zone.run (C: / Projectos /Fontes/Stratus-HTML/build/assets/js/testing.dev.js: 2544: 30) in the BoundFn zone (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills.js: 111 : 19) in lib $ es6 $ prom $$ internal $$ tryCatch (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills.js: 1511: 16) in lib $ es6 $ prom $ $ internal $$ invokeCallback (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills.js: 1523: 17) to lib $ es6 $ continue $$ internal $$ publish (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills.js: 1494: 11) in C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills.js: 243: 5 in microtask (C: /Projectos/Fontes/Stratus-HTML/build/assets/js/testing.dev.js: 2557: 15) in Zone.run (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills.js: 138: 17) in Zone.run (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / testing.dev.js: 2544: 30) in the BoundFn zone (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills.js: 111: 19) in lib $ es6 $ promise $ asap $$ flush (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills.js: 1305: 9) Error: cannot read property "hostView" undefined TypeError: Cannot read property "hostView" from undefined on new ComponentFixture_ (C: /Projectos/Fontes/Stratus-HTML/build/assets/js/testing.dev.js: 2047: 97) in C: / Projectos / Fontes / Stratus-HTML / build / assets / js /testing.dev.js: 2145: 16 in Zone.run (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills.js: 138: 17) in Zone.run (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / testing.dev.js: 2544: 30) in the BoundFn zone (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills.js: 111: 19) to lib $ es6 $ prom $$ internal $$ tryCatch (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills.js: 1511: 16) to lib $ es6 $ prom $$ internal $$ invokeCallback (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills.js: 1523: 17) to lib $ es6 $ continue $$ internal $$ publish (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills.js: 1494: 11) in C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills.js: 243: 5 in microtask (C: /Projectos/Fontes/Stratus-HTML/build/assets/js/testing.dev.js: 2557: 15) in Zone.run (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills.js: 138: 17) in Zone.run (C: /Projectos/Fontes/Stratus-HTML/build/assets/js/testing.dev. js: 2544: 30) in the BoundFn zone (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills.js: 111: 19) in lib $ es6 $ promise $ asap $$ flush (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills.js: 1305: 9) Error: Cannot read the detectChanges property undefined TypeError: Cannot read the detectChanges property from undefined in C: / Projectos / Fontes / Stratus-HTML / build / test / infrastructure / controls / group-box.test.js: 52: 20 in Zone.run (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills .js: 138: 17) in Zone.run (C: /Projectos/Fontes/Stratus-HTML/build/assets/js/testing.dev.js: 2544: 30) in zoneBoundFn (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -fill .JS: 111: 19) in lib $ es6 $ prom $$ internal $$ tryCatch (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills.js: 1511: 16) in lib $ es6 $ prom $$ internal $$ invokeCallback (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills.js: 1523: 17 ) to lib $ es6 $ continue $$ internal $$ publish (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills.js: 1494: 11) to C: / Projectos / Fontes / Stratus -HTML / build / assets / js / angular2 -polyfills.js: 243: 5 in microtask (C: /Projectos/Fontes/Stratus-HTML/build/assets/js/testing.dev.js: 2557: 15) in Zone .run (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills.js: 138: 17) in Zone.run (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / testing.dev.js: 2544: 30) in the BoundFn zone (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular 2 -polyfills.js: 111: 19) in lib $ es6 $ promise $ asap $$ flush (C: / Projectos / Fontes / Stratus-HTML / build / assets / js / angular2 -polyfills.js: 1305: 9) Chrome 47.0.2526 (Windows 8.1 0.0.0): Completed 59 of 60 (1 FAULT) (skipped 1) (0.519 s / 0.51 s) [11:40:33] 'test' erroneously after 2.01 s [11:40 : 33] Error: 1 in the format Error (C: \ Users \ LSANTOS \ AppData \ Roaming \ npm \ node_modules \ gulp \ bin \ gulp.js: 169: 10) in Gulp. (C: \ Users \ LSANTOS \ AppData \ Roaming \ NPM \ node_modules \ gulp \ Bin \ gulp.js: 195: 15) on emitOne (events.js: 77: 13) in Gulp.emit (events.js: 169: 7) in Gulp.Orchestrator._emitTaskDone (C: \ Projectos \ Fontes \ Stratus-HTML \ node_modules \ orchestrator \ index.js: 264: 8) in C: \ Projectos \ Fontes \ Stratus-HTML \ node_modules \ orchestrator \ index. js: 275: 23 at the finish (C: \ Projectos \ Fontes \ Stratus-HTML \ node_modules \ orchestrator \ lib \ runTask.js: 21: 8) in cb (C: \ Projectos \ Fontes \ Stratus-HTML \ node_modules \ orchestrator \ lib \ runTask.js: 29: 3) on removeAllListeners (C: \ Projectos \ Fontes \ Stratus-HTML \ node_modules \ karma \ lib \ server.js: 333: 7) on the server. (C: \ Projectos \ Fontes \ Stratus-HTML \ node_modules \ karma \ Lib \ server.js: 344: 9) on the .g server (events.js: 260: 16) at emitNone (events.js: 72: 20) on Server.emit (events.js: 166: 7) at emitCloseNT (net.js: 1518: 8) at doNTCallback1 (node.js: 418: 9) on process._tickCallback (node.js: 340: 17)

+5
source share
1 answer

This is fixed in Angular 2.0.0-beta.3

See https://github.com/angular/angular/issues/6483#issuecomment-179557485 for details

Basically, what I had to do:

  • Manually add typing for jasmine with tsd install jasmine -so and add ///<reference... to the test files;
  • Add this to my import:
 import {setBaseTestProviders} from 'angular2/testing'; import { TEST_BROWSER_PLATFORM_PROVIDERS, TEST_BROWSER_APPLICATION_PROVIDERS } from 'angular2/platform/testing/browser'; 

Add this before the tests of my component:

  setBaseTestProviders(TEST_BROWSER_PLATFORM_PROVIDERS, TEST_BROWSER_APPLICATION_PROVIDERS); 
+1
source

Source: https://habr.com/ru/post/1240612/


All Articles