Table des matières

Tests unitaires avec Jest

Routing

Component qui dépend de ActivatedRoute

Erreur: Can't resolve all parameters for ActivatedRoute

Ajouter dans providers:

providers: [
  {
    provide: ActivatedRoute,
    useValue: {
      params: of({id: 123}),
    },
  },
],

RouterOutlet

Erreur Template parse errors: 'router-outlet' is not a known element

imports : RouterTestingModule.withRoutes([]),
providers : RouterOutlet

Store

Erreur: NullInjectorError: No provider for Store!

imports: [
  StoreModule.forRoot({})
]

Forms

  Template parse errors:
  Can't bind to 'formGroup' since it isn't a known property of 'form'

import ReactiveFormsModule

Si le component utilise la .value d'un contrôle, ajouter dans le mock de FormGroup:

  public form: FormGroup = new FormGroup({
    firstName: new FormControl(''),
  });

Protractor

Positioner et maximiser le browser sur le deuxième écran lors de développement de tests :

await browser.driver
  .manage()
  .window()
  .setPosition(2400, 100);
 
await browser.driver
  .manage()
  .window()
  .maximize();

SpyOn

const video = require('./video');
 
test('plays video', () => {
  const spy = jest.spyOn(video, 'play');
  const isPlaying = video.play();
 
  expect(spy).toHaveBeenCalled();
  expect(isPlaying).toBe(true);
 
  spy.mockReset();
  spy.mockRestore();
});

Observable

Override

Si on veut overrider le provider, pour changer par exemple les valeurs on peut utiliser TestBed.overrideProvider(). Ici, dans le beforeEach(), le TestBed normal est fait avec la spécification des providers.

it('should take value from environment if not set in AppConfig', () => {
  mockAppConfig.baseUrl = '__BASE_URL__';
  mockEnvironment.baseUrl = 'https://someurl';
 
  TestBed.overrideProvider(APP_CONFIG, {
    useValue: mockAppConfig,
  });
 
  service = TestBed.get(ConfigService);
 
  expect(service.config.baseUrl).toEqual(
    mockEnvironment.baseUrl,
  );
});