AJAX呼び出しを行うメソッドをモックするにはどうすればよいですか？

Question

Angularアプリケーション用のテストをいくつか作成しようとしています。私は実際にサーバーを呼び出さないようにメソッドをモックしたいと思います。

は、ここに私のgrid.service.tsの内側に私の方法である：

 loadAccountListPromise(id: string) { 
     let promise = new Promise((resolve, reject) => { 
      this.http.get(`${this.baseUrl}`) 
       .toPromise() 
       .then(
       (data) => { 
        this.results = this.formatData(data.json()); 
        resolve(this.results); 
       }, 
       (msg) => { 
        reject(msg); 

       } 
       ); 
     }); 
     return promise; 

    } 

は、これまでのところ私は、公式の角度のテストガイド次のようなものを書いて試してみました。私が持っている私のgrid.service.spec.tsで：

it('loadAcountListPromise should return Promise',() => { 

      let someHttp; 

      spyOn(myInnergridService, 'loadAccountListPromise').and.callThrough(); 

      myInnergridService.loadAccountListPromise(someHttp).then(
       (response) => { expect(response).toBe(jasmine.any(Promise)); 
      }); 
     }); 

ここで私はこの方法をスパイしていますが、.callThough()を呼び出すことによって、私は、実際の実装を使用していますので、サーバーへの実際のAJAX呼び出しを行います。私はこれを避け、テスト目的でGET要求を偽造したいと思います。これはどうすればいいですか？

Answer 1

まず、テストベッド：

beforeEach(() => { 
    TestBed.configureTestingModule({ 
    imports: [HttpModule], 
    providers: [ 
     YourService, 
     // ... Other services 
     { provide: XHRBackend, useClass: MockBackend } 
    ] 
    }); 
}); 

、その後、すべてのテストで（またはbeforeEach中）：

it('testing http calls ...', inject([YourService, XHRBackend], (service: YourService, http: MockBackend) => { 
    let cnt: MockConnection; 
    let response = { contenu: 'anything you want here' }; 
    http.connections.subscribe((connection: MockConnection) => { 
    cnt = connection; 
    // Response (CHOOSE ONE) 
    connection.mockRespond(new Response(new ResponseOptions({ 
     body: JSON.stringify(response) 
    }))); 
    // Error (CHOOSE ONE) 
    connection.mockError(new Error('error')); 
    }); 

    let goodCall = (method, url) => { 
    expect(cnt.request.method).toBe(method); 
    expect(cnt.request.url.endsWith(url)).toBe(true); 
    }; 

    service.method().subscribe(res => goodCall(RequestMethod.Get, 'params/search')); 
})); 

あなたが理解していない場合は聞いてお気軽に！