A cosa servono i file “spec.ts” generati da Angular CLi?


213

Sono nuovo di Angular 2 (e Angular in generale ...) e lo trovo molto coinvolgente. Sto usando Angular CLi per generare e servire progetti. Sembra funzionare bene, anche se per i miei piccoli progetti di apprendimento produce più del necessario, ma è prevedibile.

Ho notato che genera spec.tsper ogni elemento angolare in un progetto (Componente, Servizio, Tubazione, ecc.). Ho cercato in giro ma non ho trovato una spiegazione a cosa servono questi file.

Questi file di build sono normalmente nascosti durante l'utilizzo tsc? Mi chiedevo perché volevo cambiare il nome di un mal chiamato Componentche avevo creato e ho scoperto che il nome era anche referenziato in questi spec.tsfile.


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 {
}

Risposte:


267

I file delle specifiche sono test unitari per i file di origine. La convenzione per le applicazioni angolari è di avere un file .spec.ts per ogni file .ts. Vengono eseguiti utilizzando il framework di test javascript Jasmine tramite il test runner Karma ( https://karma-runner.github.io/ ) quando si utilizza il ng testcomando.

Puoi usarlo per qualche ulteriore lettura:

https://angular.io/guide/testing


17
Grazie, me lo stavo chiedendo da solo. Supponiamo di non voler eseguire alcun test, posso eliminare in sicurezza i file .spec? (e anche le cartelle e i file di prova come la cartella e2e?)
Kokodoko,

7
Sento anche che questa domanda richiede un po 'più di risposta. Possiamo semplicemente ignorare totalmente questi file e dedicarci al nostro lavoro?
Mateusz Migała,

18
Come afferma awiseman, i file delle specifiche sono effettivamente per il test della tua applicazione. Se non si desidera utilizzare i file di test, è possibile semplicemente eliminarli o ignorarli. Il progetto continuerà a funzionare senza i file delle specifiche.
dennismuijs,

33
quando si genera un nuovo componente con l'interfaccia della riga di comando è possibile aggiungere --spec=falseper escludere la generazione di un file di specifiche. Il comando completo per la generazione di un nuovo componente potrebbe essere: ng g component comp-name --spec=false. Maggiori informazioni qui: github.com/angular/angular-cli/wiki/generate-component
Decano

11
questo può essere disabilitato modificando in angular-cli.jsonquesto modo:{ "defaults": { "component": { "spec": false } } }
Ali Sherafat,

20

se si genera un nuovo progetto angolare usando "ng new", è possibile saltare una generazione di file spec.ts. Per questo dovresti applicare l'opzione --skip-test.

nuovo nome-app -nsk --skip-test


1
Puoi impostare questa opzione dopo che il progetto è stato generato?
HughHughTeotl,

2

I file .spec.ts sono per unit test per singoli componenti. Puoi eseguire il task runner di Karma ng test. Per visualizzare la copertura del codice dei casi di test unitari per determinati componenti in esecuzioneng test --code-coverage


0

.spec.tsil file viene utilizzato per unit testingl'applicazione.

Se non lo si genera, basta usare --spec=falsedurante la creazione di nuovi Component. Come questo

ng generate component --spec=false mycomponentName
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.