Angular 2 + ng test: 'X' is not a known component

Question

I created a new project with Angular 2.0 RTM with Angular CLI 1.0.0-beta 16:

ng init

and then ran:

ng generate component my-new-component

and then ran:

ng test

and got this:

'app-my-new-component' is not a known element:
1. If 'app-my-new-component' is an Angular component, then verify that it is part of this module.
2. If 'app-my-new-component' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schema' of this component to suppress this message. ("
</h1>
<p>The mean of life is {{answer}}</p>
[ERROR ->]<app-my-new-component></app-my-new-component>"): AppComponent@4:0
Error: Template parse errors:
    at TemplateParser.parse (http://localhost:9877/_karma_webpack_/0.bundle.js:8669:19)
    at RuntimeCompiler._compileTemplate (http://localhost:9877/_karma_webpack_/0.bundle.js:17854:51)
    at http://localhost:9877/_karma_webpack_/0.bundle.js:17777:83
    at Set.forEach (native)
    at compile (http://localhost:9877/_karma_webpack_/0.bundle.js:17777:47)
    at RuntimeCompiler._compileComponents (http://localhost:9877/_karma_webpack_/0.bundle.js:17779:13)
    at RuntimeCompiler._compileModuleAndAllComponents (http://localhost:9877/_karma_webpack_/0.bundle.js:17696:37)
    at RuntimeCompiler.compileModuleAndAllComponentsSync (http://localhost:9877/_karma_webpack_/0.bundle.js:17684:21)
    at TestingCompilerImpl.compileModuleAndAllComponentsSync (http://localhost:9877/_karma_webpack_/0.bundle.js:24662:35)
    at TestBed._initIfNeeded (webpack:///home/adam/monctonug/~/@angular/core/bundles/core-testing.umd.js:1059:0 <- src/test.ts:4568:40)

I've tried reordering components, didn't help. What is the correct way to fix this problem?

Having the same issue. I went through open/closed issues on GitHub related to this error but didn't find a solution to resolve it. — ajurasz, Oct 02 '16 at 10:34
I have provided a more up-to-date answer for this problem on this other question about the same issue: https://stackoverflow.com/a/43998532/2209463 — mattarau, May 16 '17 at 10:14

score 33 · Accepted Answer · answered Oct 02 '16 at 11:13

33

I was facing the same issue and it turn out that for tests you need to declare used components as well:

  beforeEach(() => {
    TestBed.configureTestingModule({
      declarations: [
        AppComponent,
        MyNewComponent       
      ],
    });

answered Oct 02 '16 at 11:13

ajurasz

716
1
8
9

This was the problem. I have other issues, but this solved this one. – Adam Greene Oct 04 '16 at 16:26
4

I too have other problems in my life which this answer didn't fix but it did solve this one for me! Nice work. – Jason Swett Mar 05 '17 at 08:40
After spending 30 min I found your answer. Thank you! – Alex S Sep 06 '19 at 14:58

Angular 2 + ng test: 'X' is not a known component

1 Answers1