MockComponent仍然包含实际的组件

Question

在我的单元测试中，我做了以下操作(通过@ngneat/spectator):

const createComponent = createComponentFactory({
component: AppComponent,
detectChanges: false,
declarations: MockComponents(IgxToastComponent, NgxUiLoaderComponent),
imports: [
CommonModule, IgxToastModule, RouterTestingModule, NgxUiLoaderModule,
MockComponent(HeaderComponent)
],
mocks: [ToasterService]
})

HeaderComponent是一个独立的组件，因此根据ng-mock站点上的说明，我将其包含在导入中。但是，当我运行测试时，我从HeaderComponent的构造中得到错误，因为它包含该组件不使用/mock的其他服务。我的理解是，通过使用MockComponent，它应该伪造了组件，以便即使html仍然有<app-header>，它实际上并不试图加载HeaderComponent。

我应该做些不同的事情吗?

我正在使用ng-mocks 14.0.1

Answer 1

因为您的组件是独立的，您需要使用MockBuilder。它将保持AppComponent的原样，而它的导入将被模拟:

// building TestingModule definition
const dependencies = MockBuilder(
[AppComponent, RouterTestingModule],
).build();
const createComponent = createComponentFactory({
component: AppComponent,
detectChanges: false,
mocks: [ToasterService],
// adding dependencies where AppComponent is kept,
// and its imports are mocks
...dependencies,
});