Appearance
Ecrire mon premier test unitaire ​
Pour Ă©crire un test unitaire simple sur Angular, vous pouvez suivre les Ă©tapes ci-dessous :
Créez un nouveau composant en utilisant la commande
ng generate component mon-composant
.Dans le fichier
src/app/mon-composant/mon-composant.component.ts
, ajoutez une fonction qui sera testée dans votre test unitaire, par exemple :
ts
import { Component } from '@angular/core';
@Component({
selector: 'app-mon-composant',
templateUrl: './mon-composant.component.html',
styleUrls: ['./mon-composant.component.css']
})
export class MonComposantComponent {
public maFonction() {
return "Hello World!";
}
}
Créez un fichier de test pour votre composant en utilisant la commande
ng generate component mon-composant.component.spec
.Dans le fichier
src/app/mon-composant/mon-composant.component.spec.ts
, ajoutez le code suivant pour tester la fonctionmaFonction
:
ts
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { MonComposantComponent } from './mon-composant.component';
describe('MonComposantComponent', () => {
let component: MonComposantComponent;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ MonComposantComponent ]
})
.compileComponents();
});
beforeEach(() => {
const fixture = TestBed.createComponent(MonComposantComponent);
component = fixture.componentInstance;
});
it('should create', () => {
expect(component).toBeTruthy();
});
it('should return "Hello World!"', () => {
expect(component.maFonction()).toBe('Hello World!');
});
});
- Exécutez les tests en utilisant la commande
ng test
. Si tous les tests passent avec succès, vous devriez voir un message indiquant que tous les tests ont réussi.
Ce code vous donne un exemple simple de la façon d'écrire un test unitaire sur Angular. Vous pouvez modifier les tests et les fonctions pour tester d'autres parties de votre code.