Angular 使用旁观者日志进行组件测试 "can't bind to input" 模拟子组件的警告

Question

我在使用@ngneat/spectator 模拟 Angular 9 组件测试中的子组件时遇到问题。模拟的模拟和传递工作正常，但它会在输入日志中抛出警告（即使它们是有效的）。

简化后的组件如下所示：

@Component({
  selector: 'child',
  template: '<h2>{{someInput}}</h2>'
})
export class ChildComponent {
  @Input() someInput: string;
}

@Component({
  selector: 'parent',
  template: '<child [someInput]="inputVal"></child>'
})
export class ParentComponent {
  public inputVal = 'hello';
}

现在是旁观者测试

import { createComponentFactory, Spectator } from '@ngneat/spectator/jest';
import { MockComponent } from 'ng-mocks';
...

describe('ParentComponent', () => {
  let spectator: Spectator<ParentComponent>;
  let createComponent: SpectatorFactory<ParentComponent>;

  beforeEach(() => {
    createComponent = createComponentFactory({
      component: ParentComponent,
      declarations: [MockComponent(ChildComponent)]
    });

    spectator = createComponent();
  });

  describe('example', () => {
    it('should set the input', () => {
      expect(spectator.query(ChildComponent).someInput).toEqual('hello');
    });
  });

});

测试运行良好并通过。但是，日志会打印警告：

console.warn
    Can't bind to 'someInput' since it isn't a known property of 'child'.

知道为什么它会记录警告吗？

Answer 1

发现我自己的问题 - 结果 createComponentFactory() 必须在 beforeEach() 之外调用。

一旦我将其移出 beforeEach 块，模拟便开始按预期工作。

Angular 使用旁观者日志进行组件测试 "can't bind to input" 模拟子组件的警告

Angular component test with spectator logs "can't bind to input" warnings for mocked child component

angular

testing

angular-spectator

spectator

ng-mocks