Selfelected

Error message “Can’t bind to ‘ngIf’ since it isn’t a known property of ‘div'” solved

When testing a component in Angular you might receive the follwoting warning:

Can’t bind to ‘ngIf’ since it isn’t a known property of ‘div’

It might depend on you not declaring the component-under-test.

See this repo.

describe('AppComponent', () => {
   beforeEach(async () => {
     await TestBed.configureTestingModule({
       imports: [
         RouterTestingModule
       ],
       declarations: [
         AppComponent
       ],
     }).compileComponents();
   });
   it('should create the app', () => {
       const fixture = TestBed.createComponent(AppComponent);
       const app = fixture.componentInstance;
       expect(app).toBeTruthy();
     });
 });

The code is slightly different than the boiler plate Angular/Jasmine test code but still visualises the issue.

The row

const fixture = TestBed.createComponent(AppComponent);

Creates a component that must be declared in

declarations: [
  AppComponent
],

It took me an hour to find it due to code being convoluted.
If it saves you 5 minutes, it was worth writing this post.