Angular CLI 生成的“spec.ts”文件是干什么用的?

新手上路,请多包涵

我是 Angular 2 的新手(以及一般的 Angular ……),我发现它非常吸引人。我正在使用 Angular CLI 来生成和服务项目。它似乎运作良好——尽管对于我的小学习项目,它产生的比我需要的多——但这是意料之中的。

我注意到它会为项目中的每个 Angular 元素(组件、服务、管道等)生成 spec.ts 。我四处搜索,但没有找到这些文件的用途的解释。

这些构建文件在使用 tsc 时通常是隐藏的吗?我想知道,因为我想更改一个名称不佳的 Component 我创建并发现在这些 spec.ts 文件中也引用了该名称。


 import {
  beforeEach,
  beforeEachProviders,
  describe,
  expect,
  it,
  inject,
} from '@angular/core/testing';
import { ComponentFixture, TestComponentBuilder } from '@angular/compiler/testing';
import { Component } from '@angular/core';
import { By } from '@angular/platform-browser';
import { PovLevelComponent } from './pov-level.component';

describe('Component: PovLevel', () => {
  let builder: TestComponentBuilder;

  beforeEachProviders(() => [PovLevelComponent]);
  beforeEach(inject([TestComponentBuilder], function (tcb: TestComponentBuilder) {
    builder = tcb;
  }));

  it('should inject the component', inject([PovLevelComponent],
      (component: PovLevelComponent) => {
    expect(component).toBeTruthy();
  }));

  it('should create the component', inject([], () => {
    return builder.createAsync(PovLevelComponentTestController)
      .then((fixture: ComponentFixture<any>) => {
        let query = fixture.debugElement.query(By.directive(PovLevelComponent));
        expect(query).toBeTruthy();
        expect(query.componentInstance).toBeTruthy();
      });
  }));
});

@Component({
  selector: 'test',
  template: `
    <app-pov-level></app-pov-level>
  `,
  directives: [PovLevelComponent]
})
class PovLevelComponentTestController {
}

原文由 spring 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 1.6k
1 个回答

规范文件是源文件的单元测试。 Angular 应用程序的约定是每个 .ts 文件都有一个 .spec.ts 文件。当您使用 ng test 命令时,它们通过 Karma 测试运行器 ( https://karma-runner.github.io/ ) 使用 Jasmine javascript 测试框架运行。

您可以将其用于进一步阅读:

https://angular.io/guide/testing

原文由 awiseman 发布,翻译遵循 CC BY-SA 4.0 许可协议

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进