web-dev-qa-db-fra.com

Angular 2 Erreur de test unitaire: Impossible de résoudre tous les paramètres pour 'RequestOptions'

Je souhaite tester un composant simple comportant des dépendances. Donc, entre autres, je dois fournir certains fournisseurs.

/* tslint:disable:no-unused-variable */

import { By }           from '@angular/platform-browser';
import { DebugElement, provide } from '@angular/core';

import {
  beforeEach,
  beforeEachProviders,
  describe,
  expect,
  it,
  inject,
  fakeAsync,
  TestComponentBuilder
} from '@angular/core/testing';

import { AuthHttp, AuthConfig } from 'angular2-jwt';
import { Router, provideRouter } from '@angular/router';
import { Http, ConnectionBackend, RequestOptions, HTTP_PROVIDERS } from '@angular/http';
import { LogoutButtonComponent } from './logout-button.component';
import { UserService } from '../../services/index';

describe('Component: LogoutButtonComponent', () => {

  let component: LogoutButtonComponent;

  beforeEachProviders(() => [
    LogoutButtonComponent,
    Http,
    provide(AuthHttp, { useFactory: Http }),
    provide(AuthConfig, { useValue: new AuthConfig() }),
    ConnectionBackend,
    RequestOptions,
    UserService
  ]);

  beforeEach(inject([AuthHttp, UserService, LogoutButtonComponent],
    (comp: LogoutButtonComponent) => {
      component = comp;
    }));

  it('should inject UserService', () => {
    // My test here
  });

});

Bien que j'obtienne l'erreur suivante:

Erreur: Impossible de résoudre tous les paramètres pour 'RequestOptions' (?). Assurez-vous que tous les paramètres sont décorés avec Inject ou ont une annotation de type valide et que 'RequestOptions' est décoré avec Injectable.

Est-ce que quelque chose me manque dans la fonction beforeEachProviders?

Remarque: cette question concerne uniquement le test unitaire de Angular 2 avec Jasmine. Je ne suis pas en train de chercher des infos sur l’application bootstraping, c’est déjà acceptable dans mon application et il ya d’autres questions connexes ici.

unit-testingtypescriptangularjasmine
12
Vassilis Pits

Vous devez importer HttpModule dans votre configuration TestBed.

import { HttpModule } from "@angular/http";

TestBed.configureTestingModule({
  imports: [
    HttpModule
  ]
});

Après que les tests unitaires devraient fonctionner ????????

22
0x1ad2

RequestOptions n'est pas un produit injectable, vous ne l'injectez pas dans les classes. Au lieu de cela, vous en instanciez un au besoin lorsque vous effectuez une requête HTTP. Vous pouvez donc le supprimer de la beforeEachProviders et en instancier une dans la beforeEach si vous en avez réellement besoin dans les tests:

let options: RequestOptions;

beforeEach(inject([AuthHttp, UserService, LogoutButtonComponent],
    (comp: LogoutButtonComponent) => {
      component = comp;
      options = new RequestOptions({method: RequestMethod.Post});
}));
4
Sunil D.

J'ai corrigé mon erreur en important HttpModule et Http de @angular/http: 

import {HttpModule, Http} from "@angular/http"; 
...

TestBed.configureTestingModule({
  imports: [HttpModule], // <!-- HTTP module
  providers: [HttpService, SourceService, Http] // <!-- HTTP
});
2
Touqeer Shafi

Peut-être serait-il préférable de simuler le service utilisateur alors vous n'avez pas à vous soucier des RequestOptions ou du HttpModule, voici mon approche du problème ci-dessus:

import { RouterTestingModule } from '@angular/router/testing';
import { TestBed } from '@angular/core/testing';
import { LogoutButtonComponent } from './logout-button.component';
import { UserService } from '../../services/index';

describe('Component: LogoutButtonComponent', () => {

  let component: LogoutButtonComponent;
  let fixture: ComponentFixture<LogoutButtonComponent>;
  let mockUserService;

    beforeEach(() => {
        // Provide array of user service methods used in LogoutButtonComponent to the createSpyObj
        mockUserService = jasmine.createSpyObj(['exampleUserServiceMethod']);

        TestBed.configureTestingModule({
            declarations: [ LogoutButtonComponent ],
            providers: [
                { provide: UserService, useValue: mockUserService }
            ],
            // Only if your component uses routing
            imports: [
                RouterTestingModule
            ]
        });

        fixture = TestBed.createComponent(LogoutButtonComponent);
        component = fixture.componentInstance;

    })

  it('should inject UserService', () => {
    // My test here
  });

});
0
Vinorth