vendredi 31 août 2018

Angular Test Error - not a known element - Only appearing when I run all tests

I have seen lots of questions telling of solutions by simply adding my component to the declaration of my .spec file, but this error only seems to appear when I have run all app tests. Running the component tests only doesn't seem to bring up a problem.

Just FYI - My app and HTML work fine. It just appears that the test hates me.

Chrome 68.0.3440 (Mac OS X 10.13.6) AppComponent should create the app FAILED
    'app-load-spinner' is not a known element:
    1. If 'app-load-spinner' is an Angular component, then verify that it is part of this module.
    2. If 'app-load-spinner' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. ("/div>
        <button *ngIf="!hidden" class="pa-button" id="loginBtn" type="submit">Log in</button>
        [ERROR ->]<app-load-spinner button *ngIf="hidden"></app-load-spinner>
      </form>
    </div>
    "): ng:///DynamicTestModule/LoginComponent.html@17:4
    Error: Template parse errors:
        at syntaxError node_modules/@angular/compiler/fesm5/compiler.js:1016:1)
        at TemplateParser.push../node_modules/@angular/compiler/fesm5/compiler.js.TemplateParser.parse node_modules/@angular/compiler/fesm5/compiler.js:14813:1)
        at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._parseTemplate node_modules/@angular/compiler/fesm5/compiler.js:24000:1)
        at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileTemplate node_modules/@angular/compiler/fesm5/compiler.js:23987:1)
        at http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/compiler/fesm5/compiler.js:23930:48
        at Set.forEach (<anonymous>)
        at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileComponents node_modules/@angular/compiler/fesm5/compiler.js:23930:1)
        at http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/compiler/fesm5/compiler.js:23848:1
        at Object.then node_modules/@angular/compiler/fesm5/compiler.js:1007:33)
        at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileModuleAndAllComponents node_modules/@angular/compiler/fesm5/compiler.js:23846:1)

login.html

<div class="container">
   ...html code
   <spinner></spinner>
</div>

login.spec.ts

TestBed.configureTestingModule({
      declarations: [LoginComponent, StageComponent, LoadSpinnerComponent],
      imports: [FormsModule, HttpClientTestingModule, RouterTestingModule.withRoutes(fakeRoutes)],
      providers: [{provide: AuthService, useValue: mockAuthService}],
    });

spinner.ts

export class LoadSpinnerComponent implements OnInit {
   // code here
}

Aucun commentaire:

Enregistrer un commentaire