@trpc/client 11.0.0-rc.449 → 11.0.0-rc.455

package/src/links/httpBatchStreamLink.ts

@@ -13,6 +13,7 @@ import {
   fetchHTTPResponse,
   getBody,
   getUrl,
+  mergeAbortSignals,
   resolveHTTPLinkOptions,
 } from './internals/httpUtils';
 import type { Operation, TRPCLink } from './types';
@@ -57,90 +58,82 @@ export function unstable_httpBatchStreamLink<TRouter extends AnyRouter>(
             type,
             path,
             inputs,
+            signal: null,
           });
 
           return url.length <= maxURLLength;
         },
-        fetch(batchOps) {
+        async fetch(batchOps) {
           const path = batchOps.map((op) => op.path).join(',');
           const inputs = batchOps.map((op) => op.input);
 
-          const ac = resolvedOpts.AbortController
-            ? new resolvedOpts.AbortController()
-            : null;
-          const responsePromise = fetchHTTPResponse(
-            {
-              ...resolvedOpts,
-              type,
-              contentTypeHeader: 'application/json',
-              trpcAcceptHeader: 'application/jsonl',
-              getUrl,
-              getBody,
-              inputs,
-              path,
-              headers() {
-                if (!opts.headers) {
-                  return {};
-                }
-                if (typeof opts.headers === 'function') {
-                  return opts.headers({
-                    opList: batchOps as NonEmptyArray<Operation>,
-                  });
-                }
-                return opts.headers;
-              },
+          const ac = mergeAbortSignals(batchOps);
+
+          const responsePromise = fetchHTTPResponse({
+            ...resolvedOpts,
+            signal: ac.signal,
+            type,
+            contentTypeHeader: 'application/json',
+            trpcAcceptHeader: 'application/jsonl',
+            getUrl,
+            getBody,
+            inputs,
+            path,
+            headers() {
+              if (!opts.headers) {
+                return {};
+              }
+              if (typeof opts.headers === 'function') {
+                return opts.headers({
+                  opList: batchOps as NonEmptyArray<Operation>,
+                });
+              }
+              return opts.headers;
             },
-            ac,
-          );
+          });
 
-          return {
-            promise: responsePromise.then(async (res) => {
-              const [head] = await jsonlStreamConsumer<
-                Record<string, Promise<any>>
-              >({
-                // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                from: res.body!,
-                deserialize: resolvedOpts.transformer.output.deserialize,
-                // onError: console.error,
-                formatError(opts) {
-                  const error = opts.error as TRPCErrorShape;
-                  return TRPCClientError.from({
-                    error,
-                  });
-                },
+          const res = await responsePromise;
+          const [head] = await jsonlStreamConsumer<
+            Record<string, Promise<any>>
+          >({
+            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+            from: res.body!,
+            deserialize: resolvedOpts.transformer.output.deserialize,
+            // onError: console.error,
+            formatError(opts) {
+              const error = opts.error as TRPCErrorShape;
+              return TRPCClientError.from({
+                error,
               });
+            },
+            abortController: ac,
+          });
+          const promises = Object.keys(batchOps).map(
+            async (key): Promise<HTTPResult> => {
+              let json: TRPCResponse = await Promise.resolve(head[key]);
 
-              const promises = Object.keys(batchOps).map(
-                async (key): Promise<HTTPResult> => {
-                  let json: TRPCResponse = await Promise.resolve(head[key]);
-
-                  if ('result' in json) {
-                    /**
-                     * Not very pretty, but we need to unwrap nested data as promises
-                     * Our stream producer will only resolve top-level async values or async values that are directly nested in another async value
-                     */
-                    const result = await Promise.resolve(json.result);
-                    json = {
-                      result: {
-                        data: await Promise.resolve(result.data),
-                      },
-                    };
-                  }
+              if ('result' in json) {
+                /**
+                 * Not very pretty, but we need to unwrap nested data as promises
+                 * Our stream producer will only resolve top-level async values or async values that are directly nested in another async value
+                 */
+                const result = await Promise.resolve(json.result);
+                json = {
+                  result: {
+                    data: await Promise.resolve(result.data),
+                  },
+                };
+              }
 
-                  return {
-                    json,
-                    meta: {
-                      response: res,
-                    },
-                  };
+              return {
+                json,
+                meta: {
+                  response: res,
                 },
-              );
-              return promises;
-            }),
-            cancel() {
-              ac?.abort();
+              };
             },
-          };
+          );
+          return promises;
         },
       };
     };
@@ -158,7 +151,7 @@ export function unstable_httpBatchStreamLink<TRouter extends AnyRouter>(
           );
         }
         const loader = loaders[op.type];
-        const { promise, cancel } = loader.load(op);
+        const promise = loader.load(op);
 
         let _res = undefined as HTTPResult | undefined;
         promise
@@ -191,7 +184,7 @@ export function unstable_httpBatchStreamLink<TRouter extends AnyRouter>(
           });
 
         return () => {
-          cancel();
+          // noop
         };
       });
     };

package/src/links/httpLink.ts

@@ -92,6 +92,7 @@ export function httpLink<TRouter extends AnyRouter = AnyRouter>(
           type,
           path,
           input,
+          signal: op.signal,
           headers() {
             if (!opts.headers) {
               return {};
@@ -105,7 +106,7 @@ export function httpLink<TRouter extends AnyRouter = AnyRouter>(
           },
         });
         let meta: HTTPResult['meta'] | undefined = undefined;
-        request.promise
+        request
           .then((res) => {
             meta = res.meta;
             const transformed = transformResult(
@@ -132,7 +133,7 @@ export function httpLink<TRouter extends AnyRouter = AnyRouter>(
           });
 
         return () => {
-          request.cancel();
+          // noop
         };
       });
     };

package/src/links/httpSubscriptionLink.ts

@@ -69,7 +69,7 @@ export function unstable_httpSubscriptionLink<
             input,
             path,
             type,
-            AbortController: null,
+            signal: null,
           });
 
           /* istanbul ignore if -- @preserve */

package/src/links/internals/httpUtils.ts

@@ -1,23 +1,20 @@
 import type {
   AnyClientTypes,
   CombinedDataTransformer,
+  Maybe,
   ProcedureType,
   TRPCAcceptHeader,
   TRPCResponse,
 } from '@trpc/server/unstable-core-do-not-import';
 import { getFetch } from '../../getFetch';
-import { getAbortController } from '../../internals/getAbortController';
 import type {
-  AbortControllerEsque,
-  AbortControllerInstanceEsque,
   FetchEsque,
   RequestInitEsque,
   ResponseEsque,
 } from '../../internals/types';
-import { TRPCClientError } from '../../TRPCClientError';
 import type { TransformerOptions } from '../../unstable-internals';
 import { getTransformer } from '../../unstable-internals';
-import type { HTTPHeaders, PromiseAndCancel } from '../types';
+import type { HTTPHeaders } from '../types';
 
 /**
  * @internal
@@ -30,10 +27,6 @@ export type HTTPLinkBaseOptions<
    * Add ponyfill for fetch
    */
   fetch?: FetchEsque;
-  /**
-   * Add ponyfill for AbortController
-   */
-  AbortController?: AbortControllerEsque | null;
   /**
    * Send all requests `as POST`s requests regardless of the procedure type
    * The HTTP handler must separately allow overriding the method. See:
@@ -45,7 +38,6 @@ export type HTTPLinkBaseOptions<
 export interface ResolvedHTTPLinkOptions {
   url: string;
   fetch?: FetchEsque;
-  AbortController: AbortControllerEsque | null;
   transformer: CombinedDataTransformer;
   methodOverride?: 'POST';
 }
@@ -56,7 +48,6 @@ export function resolveHTTPLinkOptions(
   return {
     url: opts.url.toString(),
     fetch: opts.fetch,
-    AbortController: getAbortController(opts.AbortController),
     transformer: getTransformer(opts.transformer),
     methodOverride: opts.methodOverride,
   };
@@ -102,6 +93,7 @@ export type HTTPBaseRequestOptions = GetInputOptions &
   ResolvedHTTPLinkOptions & {
     type: ProcedureType;
     path: string;
+    signal: Maybe<AbortSignal>;
   };
 
 type GetUrl = (opts: HTTPBaseRequestOptions) => string;
@@ -151,7 +143,7 @@ export type Requester = (
   opts: HTTPBaseRequestOptions & {
     headers: () => HTTPHeaders | Promise<HTTPHeaders>;
   },
-) => PromiseAndCancel<HTTPResult>;
+) => Promise<HTTPResult>;
 
 export const jsonHttpRequester: Requester = (opts) => {
   return httpRequest({
@@ -167,10 +159,8 @@ export type HTTPRequestOptions = ContentOptions &
     headers: () => HTTPHeaders | Promise<HTTPHeaders>;
   };
 
-export async function fetchHTTPResponse(
-  opts: HTTPRequestOptions,
-  ac?: AbortControllerInstanceEsque | null,
-) {
+export async function fetchHTTPResponse(opts: HTTPRequestOptions) {
+  opts.signal?.throwIfAborted();
   const url = opts.getUrl(opts);
   const body = opts.getBody(opts);
   const { type } = opts;
@@ -193,42 +183,66 @@ export async function fetchHTTPResponse(
 
   return getFetch(opts.fetch)(url, {
     method: opts.methodOverride ?? METHOD[type],
-    signal: ac?.signal,
+    signal: opts.signal,
     body,
     headers,
   });
 }
 
-export function httpRequest(
+export async function httpRequest(
   opts: HTTPRequestOptions,
-): PromiseAndCancel<HTTPResult> {
-  const ac = opts.AbortController ? new opts.AbortController() : null;
+): Promise<HTTPResult> {
   const meta = {} as HTTPResult['meta'];
 
-  let done = false;
-  const promise = new Promise<HTTPResult>((resolve, reject) => {
-    fetchHTTPResponse(opts, ac)
-      .then((_res) => {
-        meta.response = _res;
-        done = true;
-        return _res.json();
-      })
-      .then((json) => {
-        meta.responseJSON = json;
-        resolve({
-          json: json as TRPCResponse,
-          meta,
-        });
-      })
-      .catch((err) => {
-        done = true;
-        reject(TRPCClientError.from(err, { meta }));
-      });
-  });
-  const cancel = () => {
-    if (!done) {
-      ac?.abort();
+  const res = await fetchHTTPResponse(opts);
+  meta.response = res;
+
+  const json = await res.json();
+
+  meta.responseJSON = json;
+
+  return {
+    json: json as TRPCResponse,
+    meta,
+  };
+}
+
+/**
+ * Merges multiple abort signals into a single one
+ * - When all signals have been aborted, the merged signal will be aborted
+ */
+export function mergeAbortSignals(
+  opts: {
+    signal: Maybe<AbortSignal>;
+  }[],
+): AbortController {
+  const ac = new AbortController();
+
+  if (opts.some((o) => !o.signal)) {
+    return ac;
+  }
+
+  const count = opts.length;
+
+  let abortedCount = 0;
+
+  const onAbort = () => {
+    if (++abortedCount === count) {
+      ac.abort();
     }
   };
-  return { promise, cancel };
+
+  for (const o of opts) {
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+    const signal = o.signal!;
+    if (signal.aborted) {
+      onAbort();
+    } else {
+      signal.addEventListener('abort', onAbort, {
+        once: true,
+      });
+    }
+  }
+
+  return ac;
 }

package/src/links/types.ts

@@ -1,6 +1,7 @@
 import type { Observable, Observer } from '@trpc/server/observable';
 import type {
   InferrableClientTypes,
+  Maybe,
   TRPCResultMessage,
   TRPCSuccessResponse,
 } from '@trpc/server/unstable-core-do-not-import';
@@ -13,19 +14,6 @@ export {
   isOctetType,
 } from './internals/contentTypes';
 
-/**
- * @internal
- */
-export type CancelFn = () => void;
-
-/**
- * @internal
- */
-export type PromiseAndCancel<TValue> = {
-  promise: Promise<TValue>;
-  cancel: CancelFn;
-};
-
 /**
  * @internal
  */
@@ -40,6 +28,7 @@ export type Operation<TInput = unknown> = {
   input: TInput;
   path: string;
   context: OperationContext;
+  signal: Maybe<AbortSignal>;
 };
 
 interface HeadersInitEsque {

package/src/links/wsLink.ts

@@ -486,7 +486,7 @@ export function wsLink<TRouter extends AnyRouter>(
         const input = transformer.input.serialize(op.input);
 
         const unsub = client.request(
-          { type, path, input, id, context },
+          { type, path, input, id, context, signal: null },
           {
             error(err) {
               observer.error(err as TRPCClientError<any>);

package/dist/internals/getAbortController.d.ts

@@ -1,4 +0,0 @@
-import type { Maybe } from '@trpc/server/unstable-core-do-not-import';
-import type { AbortControllerEsque } from './types';
-export declare function getAbortController(customAbortControllerImpl: Maybe<AbortControllerEsque>): AbortControllerEsque | null;
-//# sourceMappingURL=getAbortController.d.ts.map

package/dist/internals/getAbortController.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"getAbortController.d.ts","sourceRoot":"","sources":["../../src/internals/getAbortController.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,0CAA0C,CAAC;AACtE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAEpD,wBAAgB,kBAAkB,CAChC,yBAAyB,EAAE,KAAK,CAAC,oBAAoB,CAAC,GACrD,oBAAoB,GAAG,IAAI,CAc7B"}

package/dist/internals/getAbortController.js

@@ -1,16 +0,0 @@
-'use strict';
-
-function getAbortController(customAbortControllerImpl) {
-    if (customAbortControllerImpl) {
-        return customAbortControllerImpl;
-    }
-    if (typeof window !== 'undefined' && window.AbortController) {
-        return window.AbortController;
-    }
-    if (typeof globalThis !== 'undefined' && globalThis.AbortController) {
-        return globalThis.AbortController;
-    }
-    return null;
-}
-
-exports.getAbortController = getAbortController;

package/dist/internals/getAbortController.mjs

@@ -1,14 +0,0 @@
-function getAbortController(customAbortControllerImpl) {
-    if (customAbortControllerImpl) {
-        return customAbortControllerImpl;
-    }
-    if (typeof window !== 'undefined' && window.AbortController) {
-        return window.AbortController;
-    }
-    if (typeof globalThis !== 'undefined' && globalThis.AbortController) {
-        return globalThis.AbortController;
-    }
-    return null;
-}
-
-export { getAbortController };

package/src/internals/getAbortController.ts

@@ -1,20 +0,0 @@
-import type { Maybe } from '@trpc/server/unstable-core-do-not-import';
-import type { AbortControllerEsque } from './types';
-
-export function getAbortController(
-  customAbortControllerImpl: Maybe<AbortControllerEsque>,
-): AbortControllerEsque | null {
-  if (customAbortControllerImpl) {
-    return customAbortControllerImpl;
-  }
-
-  if (typeof window !== 'undefined' && window.AbortController) {
-    return window.AbortController;
-  }
-
-  if (typeof globalThis !== 'undefined' && globalThis.AbortController) {
-    return globalThis.AbortController;
-  }
-
-  return null;
-}