I'm new to Angular 2 (and Angular in general...) and am finding it very engaging. I am using Angular CLI to generate and serve projects. It seems to work well – though for my little learning projects, it produces more than I need – but that's to be expected.
I've noticed that it generates spec.ts
for each Angular element in a project (Component, Service, Pipe, etc). I've searched around but have not found an explanation of what these files are for.
Are these build files which are normally hidden when using tsc
? I wondered because I wanted to change the name of a poorly named Component
I'd created and discovered that the name was also referenced in these spec.ts
files.
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 {
}
This question is related to
angular
typescript
if you generate new angular project using "ng new", you may skip a generating of spec.ts files. For this you should apply --skip-tests option.
ng new ng-app-name --skip-tests
The .spec.ts files are for unit tests for individual components.
You can run Karma task runner through ng test
. In order to see code coverage of unit test cases for particular components run ng test --code-coverage
.spec.ts
file is used for unit testing
of your application.
If you don't to get it generated just use --spec=false
while creating new Component
. Like this
ng generate component --spec=false mycomponentName
Source: Stackoverflow.com