fix(http): Don't override the backend when using the InMemoryWebAPI

When using `withFetch`, the `PRIMARY_HTTP_BACKEND` token is set. The InMemory Backend services will also set that token. This means that providers order will matter and the latest on the list will be the one instantiated
angular · Oct 27, 2023 · de13627 · de13627
1 parent 7888819
commit de13627
Show file tree

Hide file tree

Showing 3 changed files with 41 additions and 22 deletions.
diff --git a/packages/misc/angular-in-memory-web-api/src/http-client-in-memory-web-api-module.ts b/packages/misc/angular-in-memory-web-api/src/http-client-in-memory-web-api-module.ts
@@ -8,19 +8,12 @@
 
 import {XhrFactory} from '@angular/common';
 import {HttpBackend} from '@angular/common/http';
+import {PRIMARY_HTTP_BACKEND} from '@angular/common/http/src/interceptor';
 import {ModuleWithProviders, NgModule, Type} from '@angular/core';
 
 import {HttpClientBackendService} from './http-client-backend-service';
 import {InMemoryBackendConfig, InMemoryBackendConfigArgs, InMemoryDbService} from './interfaces';
 
-// Internal - Creates the in-mem backend for the HttpClient module
-// AoT requires factory to be exported
-export function httpClientInMemBackendServiceFactory(
-    dbService: InMemoryDbService, options: InMemoryBackendConfig,
-    xhrFactory: XhrFactory): HttpBackend {
-  return new HttpClientBackendService(dbService, options, xhrFactory) as HttpBackend;
-}
-
 @NgModule()
 export class HttpClientInMemoryWebApiModule {
   /**
@@ -44,12 +37,10 @@ export class HttpClientInMemoryWebApiModule {
     return {
       ngModule: HttpClientInMemoryWebApiModule,
       providers: [
-        {provide: InMemoryDbService, useClass: dbCreator},
-        {provide: InMemoryBackendConfig, useValue: options}, {
-          provide: HttpBackend,
-          useFactory: httpClientInMemBackendServiceFactory,
-          deps: [InMemoryDbService, InMemoryBackendConfig, XhrFactory]
-        }
+        HttpClientBackendService, {provide: InMemoryDbService, useClass: dbCreator},
+        {provide: InMemoryBackendConfig, useValue: options},
+        {provide: HttpBackend, useExisting: HttpClientBackendService},
+        {provide: PRIMARY_HTTP_BACKEND, useExisting: HttpClientBackendService}
       ]
     };
   }

diff --git a/packages/misc/angular-in-memory-web-api/src/in-memory-web-api-module.ts b/packages/misc/angular-in-memory-web-api/src/in-memory-web-api-module.ts
@@ -8,9 +8,10 @@
 
 import {XhrFactory} from '@angular/common';
 import {HttpBackend} from '@angular/common/http';
+import {PRIMARY_HTTP_BACKEND} from '@angular/common/http/src/interceptor';
 import {ModuleWithProviders, NgModule, Type} from '@angular/core';
 
-import {httpClientInMemBackendServiceFactory} from './http-client-in-memory-web-api-module';
+import {HttpClientBackendService} from './http-client-backend-service';
 import {InMemoryBackendConfig, InMemoryBackendConfigArgs, InMemoryDbService} from './interfaces';
 
 @NgModule()
@@ -37,11 +38,9 @@ export class InMemoryWebApiModule {
       ngModule: InMemoryWebApiModule,
       providers: [
         {provide: InMemoryDbService, useClass: dbCreator},
-        {provide: InMemoryBackendConfig, useValue: options}, {
-          provide: HttpBackend,
-          useFactory: httpClientInMemBackendServiceFactory,
-          deps: [InMemoryDbService, InMemoryBackendConfig, XhrFactory]
-        }
+        {provide: InMemoryBackendConfig, useValue: options},
+        {provide: HttpBackend, useClass: HttpClientBackendService},
+        {provide: PRIMARY_HTTP_BACKEND, useExisting: HttpClientBackendService}
       ]
     };
   }

diff --git a/packages/misc/angular-in-memory-web-api/test/http-client-backend-service_spec.ts b/packages/misc/angular-in-memory-web-api/test/http-client-backend-service_spec.ts
@@ -8,8 +8,8 @@
 
 import 'jasmine-ajax';
 
-import {HTTP_INTERCEPTORS, HttpBackend, HttpClient, HttpClientModule, HttpEvent, HttpEventType, HttpHandler, HttpInterceptor, HttpRequest, HttpResponse} from '@angular/common/http';
-import {Injectable} from '@angular/core';
+import {FetchBackend, HTTP_INTERCEPTORS, HttpBackend, HttpClient, HttpClientModule, HttpEvent, HttpEventType, HttpHandler, HttpInterceptor, HttpRequest, HttpResponse, provideHttpClient, withFetch} from '@angular/common/http';
+import {importProvidersFrom, Injectable} from '@angular/core';
 import {TestBed, waitForAsync} from '@angular/core/testing';
 import {HttpClientBackendService, HttpClientInMemoryWebApiModule} from 'angular-in-memory-web-api';
 import {Observable, zip} from 'rxjs';
@@ -46,6 +46,7 @@ describe('HttpClient Backend Service', () => {
 
     it('GET should be a "cold" observable', waitForAsync(() => {
          const httpBackend = TestBed.get(HttpBackend);
+         console.log(httpBackend);
          const spy = spyOn(httpBackend, 'collectionHandler').and.callThrough();
          const get$ = http.get<Hero[]>('api/heroes');
 
@@ -565,6 +566,34 @@ describe('HttpClient Backend Service', () => {
                  failRequest);
        }));
   });
+
+  describe('when using the FetchBackend', () => {
+    it('should be the an InMemory Service', () => {
+      TestBed.configureTestingModule({
+        providers: [
+          provideHttpClient(withFetch()),
+          importProvidersFrom(
+              HttpClientInMemoryWebApiModule.forRoot(HeroInMemDataService, {delay})),
+          {provide: HeroService, useClass: HttpClientHeroService}
+        ]
+      });
+
+      expect(TestBed.inject(HttpBackend)).toBeInstanceOf(HttpClientBackendService)
+    });
+
+    it('should be a FetchBackend', () => {
+      // In the test, order matters
+      TestBed.configureTestingModule({
+        providers: [
+          importProvidersFrom(
+              HttpClientInMemoryWebApiModule.forRoot(HeroInMemDataService, {delay})),
+          provideHttpClient(withFetch()), {provide: HeroService, useClass: HttpClientHeroService}
+        ]
+      });
+
+      expect(TestBed.inject(HttpBackend)).toBeInstanceOf(FetchBackend)
+    });
+  })
 });