Impossible de faire des XHR à partir d'un faux test asynchrone

Question

Total novice chez Karma/Jasmine à la recherche d'aide. J'essaie d'exécuter le test suivant et j'obtiens l'erreur "Impossible de faire des XHR dans un faux test asynchrone". J'ai inclus le test et la méthode que j'essaie d'appeler. Toute aide est grandement appréciée.

import... 

fdescribe('CageService',() => { 

beforeEach(() => { 
    TestBed.configureTestingModule({ 
     imports: [ 
      RouterTestingModule, 
      HttpModule 
     ], 
     providers: [ 
      BaseRequestOptions, 
      MockBackend, 
      CageService, 
      { provide: 'appHttpService', useClass: AppHttpService }, 
      { provide: 'appHttpHelperService', useClass: AppHttpHelperService }, 
      { provide: 'appUtilityService', useClass: AppUtilityService }, 
      { provide: Http, useFactory: (backend: ConnectionBackend, defaultOptions: BaseRequestOptions) => { 
       return new Http(backend, defaultOptions); 
      }, deps: [MockBackend, BaseRequestOptions] } 
     ] 
    }); 
}); 

it('will load cages', inject([CageService, MockBackend], fakeAsync((cageService, mockBackend\) => { 

    var res; 
    mockBackend.connections.subscribe(c => { 

     expect(c.request.url).toBe('http://example.com'); 
     let response = new ResponseOptions({ body: '{"name": "charles"}' }); 
     c.mockRespond(new Response(response)); 
    }); 

    cageService.load({}).subscribe((_res) => { 

     res = _res; 
    }); 

    tick(100); 
    discardPeriodicTasks(); 
    expect(res.name).toBe('Charles'); 
}))); 
}); 

La méthode que je fais appel lit

load (criteria: Object) { 

    return this.appHttpService.get(this.url + '?' + criteria) 
    .map( 

     response => { 

      let data = response.json(); 

      this.pagination.total = data.count; 
      this.pagination.per_page = data.limit; 
      this.pagination.current_page = data.currentPage; 
      this.pagination.last_page = data.totalPages; 

      let cages = []; 
      for(let x = 0; x < data.rows.length; x++) { 

       cages.push(this.formatCage(new Cage(), data.rows[x])); 
      } 

      this._cages$.next(this.dataStore.cages); 

      return data.rows; 
     } 
    ); 
} 

Answer 1

J'ai eu le même problème, et je ne sais pas quelle version vous êtes angulaire à l'aide, mais cela fonctionne avec HttpClientModule en, pas sûr si cela fonctionne avec HttpModule. Voici mes versions:

@angular/cli: 1.4.9 
node: 8.8.1 
os: linux x64 
@angular/animations: 4.4.6 
@angular/cdk: 2.0.0-beta.12 
@angular/common: 4.4.6 
@angular/compiler: 4.4.6 
@angular/core: 4.4.6 
@angular/forms: 4.4.6 
@angular/http: 4.4.6 
@angular/material: 2.0.0-beta.12 
@angular/platform-browser: 4.4.6 
@angular/platform-browser-dynamic: 4.4.6 
@angular/router: 4.4.6 
@angular/cli: 1.4.9 
@angular/compiler-cli: 4.4.6 
@angular/language-service: 4.4.6 
typescript: 2.5.3 

Et voici mon imports & providers tableau:

import { MockBackend } from '@angular/http/testing'; 
import { HttpClientModule, HttpXhrBackend } from '@angular/common/http'; 
imports: [ 
    otherStuff..., 
    HttpClientModule 
], 
providers: [ 
    otherStuff..., 
    SomeService, 
    { 
     provide: HttpXhrBackend, 
     useClass: MockBackend 
    } 
] 

Si vous ne l'utilisez encore HttpClient, il vaut peut-être mise à jour car il est beaucoup plus facile à utiliser. J'espère que cela t'aides.