title: Testing Http Service making multiple calls and returning observable without mapping the responses
body: <p>I have a data service which fetches the data from server and makes multiple requests which then return an array of observables. I want to test the data.</p>
  
  <p>What i tried doing is in the mockrespone I sent array which contains two observables i dont know if thats the right way to test data.</p>
  
  <p>But tests are failing especially the last three tests in the async test block</p>
  
  <p><strong>Important:</strong> I want to test that, when setting charId to falsy and comicsId to falsy, calling tthe method, subscribing to the observable it returns, after you've mocked http, you get back an array containing the two expected responses. Same with the 4 expected response if charId is truthy. Same for the 6 expected responses when comicsId is truthy</p>
  
  <p>// the service which fetches the data</p>
  
  <pre><code>getChar(): Observable&lt;any&gt; {
  
      const Observables = [];
      Observables.push(this.http.get('https://gateway.marvel.com:443/v1/public/characters?apikey'));
      Observables.push(this.http.get('https://gateway.marvel.com:443/v1/public/comics?apikey'));
  
      if (this.charId) {
        Observables.push(this.http.get(`${this.urlChar}${this.charId}${this.apiKey}`));
        Observables.push(this.http.get(`${this.urlChar}${this.charId}/comics${this.apiKey}`));
      }
      if (this.comicsId) {
        Observables.push(this.http.get(`${this.urlCom}${this.comicsId}${this.apiKey}`));
        Observables.push(this.http.get(`${this.urlCom}${this.comicsId}/creators${this.apiKey}`));
      }
      console.log([Observable, Observable]);
      return Observable.forkJoin(Observables);
    }
  }
  </code></pre>
  
  <p>// my test</p>
  
  <pre><code>import { async, ComponentFixture, TestBed, getTestBed, inject } from '@angular/core/testing';
  import { MockBackend, MockConnection } from '@angular/http/testing';
  import { DataService } from './data.service';
  import {
    BaseRequestOptions, Http, XHRBackend, HttpModule,
    Response, ResponseOptions, RequestMethod
  } from '@angular/http';
  import { Observable } from 'rxjs/Observable';
  
  describe('DataService', () =&gt; {
    let mockBackend: MockBackend;
  
     beforeEach(async(() =&gt; {
      TestBed.configureTestingModule({
        providers: [
          DataService,
          MockBackend,
          BaseRequestOptions,
          {
            provide: Http,
            deps: [MockBackend, BaseRequestOptions],
            useFactory:
            (backend: XHRBackend, defaultOptions: BaseRequestOptions) =&gt; {
              return new Http(backend, defaultOptions);
            }
          }
        ],
        imports: [
          HttpModule
        ]
      });
      mockBackend = getTestBed().get(MockBackend);
    }));
  
  
    it('should get ObservableArr', (done) =&gt; {
      let dataService: DataService;
  
      getTestBed().compileComponents().then(() =&gt; {
        mockBackend.connections.subscribe(
          (connection: MockConnection) =&gt; {
            connection.mockRespond(new Response(
              new ResponseOptions({
                body: [Observable, Observable]
              }
              )));
          });
  
        dataService = getTestBed().get(DataService);
        expect(DataService).toBeDefined();
  
        dataService.getChar().subscribe((obsArr: Observable&lt;any&gt;[]) =&gt; {
          expect(obsArr.length).toBeDefined();
          expect(obsArr.length).toEqual(2);
          expect(obsArr.length).not.toBe(1);
          done();
        });
      });
    });
  
  
    it('should check the service',
      inject([DataService], (service: DataService) =&gt; {
        expect(service).toBeTruthy();
      }));
  
    it('should get ObservableArray async',
      async(inject([DataService], (dataService: DataService) =&gt; {
        mockBackend.connections.subscribe(
          (connection: MockConnection) =&gt; {
            connection.mockRespond(new Response(
              new ResponseOptions({
                body: [Observable, Observable]
              }
              )));
          });
        dataService.getChar().subscribe(
          (response) =&gt; {
            expect(response.length).toBe(2);
            expect(response[0]).toBe(Observable); &lt;&lt;&lt;&lt;&lt;&lt;&lt;&lt;&lt;&lt;&lt;&lt;&lt;&lt; Fails
            expect(response[1]).toBe(Observable); &lt;&lt;&lt;&lt;&lt;&lt;&lt;&lt;&lt;&lt;&lt;&lt;&lt;&lt; Fails
            expect(response).toEqual([Observable, Observable]); &lt;&lt;&lt;&lt;&lt;&lt; Fails
          });
      })));
  });
  </code></pre>