can't bind to 'value' since it isn't a known property angular component

Question

my test case is failing for my component and throwing error Error: Template parse errors: Can't bind to 'video' since it isn't a known property of 'app-video-card'.

here, in my component

<app-video-card class="bs-video-card" *ngFor="let video of videos" [video]="video"></app-video-card>

I have declared my component in test file.

@Component({ selector: 'app-video-card', template: '' })
class VideoCardStuBComponent { }

describe('VideosComponent', () => {
  let component: VideosListComponent;
  let fixture: ComponentFixture<VideosListComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [
        SharedModule, HttpClientTestingModule
      ],
      declarations: [ VideosListComponent, VideoCardStuBComponent ],
      providers: [HomeConstants,
      {provide: SqVideoExportService},
      DatePipe],
    })
    .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(VideosListComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });

});

Answer 1

Since you're using a stub for <app-video-card> you need to define the video input there as well.

@Component({ selector: 'app-video-card', template: '<div></div>' })
class VideoCardStuBComponent {
  @Input() video;
}