feat(http): add keepalive support for fetch requests in httpResource (#61833)

This commit adds support for the Fetch API's keepalive option when using httpResource with the withFetch provider

PR Close #61833

goldens/public-api/common/http/index.api.md

@@ -1872,6 +1872,7 @@ export interface HttpResourceRequest {
     body?: unknown;
     context?: HttpContext;
     headers?: HttpHeaders | Record<string, string | ReadonlyArray<string>>;
+    keepalive?: boolean;
     method?: string;
     params?: HttpParams | Record<string, string | number | boolean | ReadonlyArray<string | number | boolean>>;
     reportProgress?: boolean;

packages/common/http/src/resource.ts

@@ -278,6 +278,7 @@ function normalizeRequest(
       params,
       reportProgress: unwrappedRequest.reportProgress,
       withCredentials: unwrappedRequest.withCredentials,
+      keepalive: unwrappedRequest.keepalive,
       responseType,
       context: unwrappedRequest.context,
       transferCache: unwrappedRequest.transferCache,

packages/common/http/src/resource_api.ts

@@ -70,6 +70,11 @@ export interface HttpResourceRequest {
    */
   withCredentials?: boolean;
 
+  /**
+   * When using the fetch implementation and set to `true`, the browser will not abort the associated request if the page that initiated it is unloaded before the request is complete.
+   */
+  keepalive?: boolean;
+
   /**
    * Configures the server-side rendering transfer cache for this request.
    *

packages/common/http/test/resource_spec.ts

@@ -105,6 +105,7 @@ describe('httpResource', () => {
           'fast': 'yes',
         },
         withCredentials: true,
+        keepalive: true,
       }),
       {injector: TestBed.inject(Injector)},
     );
@@ -114,6 +115,7 @@ describe('httpResource', () => {
     expect(req.request.body).toEqual({message: 'Hello, backend!'});
     expect(req.request.headers.get('X-Special')).toBe('true');
     expect(req.request.withCredentials).toBe(true);
+    expect(req.request.keepalive).toBe(true);
 
     req.flush([]);
 
@@ -201,6 +203,7 @@ describe('httpResource', () => {
         reportProgress: true,
         context: new HttpContext().set(CTX_TOKEN, 'bar'),
         withCredentials: true,
+        keepalive: true,
         transferCache: {includeHeaders: ['Y-Tag']},
       }),
       {
@@ -215,6 +218,7 @@ describe('httpResource', () => {
     expect(req.request.withCredentials).toEqual(true);
     expect(req.request.context.get(CTX_TOKEN)).toEqual('bar');
     expect(req.request.reportProgress).toEqual(true);
+    expect(req.request.keepalive).toBe(true);
     expect(req.request.transferCache).toEqual({includeHeaders: ['Y-Tag']});
   });