Question

是否有一种最佳方式来定义所有规范中常见的导入，声明，提供程序（即一个地方定义的所有规范所共有的模块，就像我们在@NgModule中所做的那样），如同我们在@NgModule中进行应用单元测试。

注意：在beforeEach中调用configureTestingModule，以便TestBed可以在每次测试运行之前将自身重置为基本状态。在文档上

在我的一个测试规范中，我必须加载相同的模块组件和指令..etc，这也被其他一些规范使用。

describe('Component: Login', () => {
let loginFixture, loginComponent, loginComponentElement,loginComponentDebugElement;
beforeEach(async(() => {
TestBed.configureTestingModule({
  imports: [FormsModule, ReactiveFormsModule, MaterialRootModule, ModalModule, DatepickerModule,
    DropdownModule, AccordionModule], //--> here we load n number of mudoles 
  declarations: [LoginComponent, LoginHeaderComponent, LoginColumnComponent, LoginColumnContentComponent,
    LoginStatusLaneComponent, LoginSettingsComponent,
    LoginLaneComponent, SortableDirective, WindowHeightDirective, ConfirmDirective, ConfirmPopoverComponent, ConfirmationDialogComponent,
    ConfirmationDialogDirective],         //--> here we load n number of components directive and piper          
  providers: [LoginComponent,
    MockBackend,
    BaseRequestOptions,
    ComponentLoaderFactory,
    ConfirmOptions,
    {
      provide: Http,
      useFactory: (backend, options) => new Http(backend, options),
      deps: [MockBackend, BaseRequestOptions]
    },
    {provide: AuthService, useClass: MockAuthService},
    {provide: AppContextService, useClass: MockAppContextService},
    {provide: NotificationsService, useClass: MockNotificationsService},
    {provide: PositioningService}]       //--> here we load n number of services    
}).compileComponents();
loginFixture = TestBed.createComponent(LoginComponent);
loginComponent = loginFixture.componentInstance; 
loginComponentElement = LoginFixture.nativeElement;
loginComponentDebugElement = LoginFixture.debugElement;
}));

 it('should have a defined component', () => {
expect(LoginComponent).toBeDefined();
});
});

注意：Git Angular issue TestBed.configureTestingModule Performance Issue

在运行所有spec.ts 文件并为每个规范注入相应的依赖项之前，是否有任何模式可以使它像加载所有这些模块组件等一样常见。任何帮助都会很棒。

Answer 1

我的回答是不完整的，你已经开始期待了。但我希望它能帮到你一点点。

路由器stubs.ts

//----------Default Import------------
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
...snip...
export const test_imports = [
               BrowserModule,
               FormsModule,
               HttpModule,
               BrowserAnimationsModule
             ];

每个test.spec.ts

import { test_imports }   from '../testing/router-stubs';
..snip..
      imports: [test_imports],

但提供者/声明不能以相同的方式使用。

Answer 2

您需要在describe方法之前定义TestBed.configureTestingModule。所以它可以在全球范围内使用。所以现在你的测试用例看起来像这样。

TestBed.configureTestingModule({
  imports: [FormsModule, ReactiveFormsModule, MaterialRootModule, ModalModule, DatepickerModule,
    DropdownModule, AccordionModule], //--> here we load n number of mudoles 
  declarations: [LoginComponent, LoginHeaderComponent, LoginColumnComponent, LoginColumnContentComponent,
    LoginStatusLaneComponent, LoginSettingsComponent,
    LoginLaneComponent, SortableDirective, WindowHeightDirective, ConfirmDirective, ConfirmPopoverComponent, ConfirmationDialogComponent,
    ConfirmationDialogDirective],         //--> here we load n number of components directive and piper          
  providers: [LoginComponent,
    MockBackend,
    BaseRequestOptions,
    ComponentLoaderFactory,
    ConfirmOptions,
    {
      provide: Http,
      useFactory: (backend, options) => new Http(backend, options),
      deps: [MockBackend, BaseRequestOptions]
    },
    {provide: AuthService, useClass: MockAuthService},
    {provide: AppContextService, useClass: MockAppContextService},
    {provide: NotificationsService, useClass: MockNotificationsService},
    {provide: PositioningService}]       //--> here we load n number of services    
}).compileComponents();

describe('Component: Login', () => {
  let loginFixture, loginComponent, loginComponentElement, loginComponentDebugElement;
  beforeEach(async(() => {

    loginFixture = TestBed.createComponent(LoginComponent);
    loginComponent = loginFixture.componentInstance;
    loginComponentElement = LoginFixture.nativeElement;
    loginComponentDebugElement = LoginFixture.debugElement;
  }));

  it('should have a defined component', () => {
    expect(LoginComponent).toBeDefined();
  });
});

Answer 3

无需为了实现此目的而建立单独的库。您可以通过创建公共角度模块（可以在其中定义实用程序方法）来创建全局TestBed。此实用程序方法创建TestBed，然后您可以在所有规格文件中重复使用。

您可以参考下面的答案，其中还包括示例代码：（可能重复）https://stackoverflow.com/a/64835814/4184651

TestBed configureTestingModule定义一个模块中所有规范共有的导入，声明，提供程序和管道 - 模式

3 个答案: