@trpc/client 11.0.0-rc.552 → 11.0.0-rc.560

package/dist/bundle-analysis.json

@@ -1,7 +1,7 @@
 {
-  "bundleSize": 54227,
-  "bundleOrigSize": 71827,
-  "bundleReduction": 24.5,
+  "bundleSize": 57426,
+  "bundleOrigSize": 75759,
+  "bundleReduction": 24.2,
   "modules": [
     {
       "id": "/src/links/wsLink.ts",
@@ -13,9 +13,21 @@
       ],
       "removedExports": [],
       "dependents": [],
-      "percent": 28.17,
+      "percent": 26.6,
       "reduction": 10.13
     },
+    {
+      "id": "/src/links/httpSubscriptionLink.ts",
+      "size": 7004,
+      "origSize": 8051,
+      "renderedExports": [
+        "unstable_httpSubscriptionLink"
+      ],
+      "removedExports": [],
+      "dependents": [],
+      "percent": 12.2,
+      "reduction": 13
+    },
     {
       "id": "/src/links/httpBatchStreamLink.ts",
       "size": 5861,
@@ -25,7 +37,7 @@
       ],
       "removedExports": [],
       "dependents": [],
-      "percent": 10.81,
+      "percent": 10.21,
       "reduction": 3.51
     },
     {
@@ -37,7 +49,7 @@
       ],
       "removedExports": [],
       "dependents": [],
-      "percent": 10.06,
+      "percent": 9.5,
       "reduction": 18.48
     },
     {
@@ -61,7 +73,7 @@
         "/src/links/httpBatchStreamLink.ts",
         "/src/links/httpSubscriptionLink.ts"
       ],
-      "percent": 8.23,
+      "percent": 7.78,
       "reduction": 32.81
     },
     {
@@ -76,7 +88,7 @@
         "/src/links/httpBatchLink.ts",
         "/src/links/httpBatchStreamLink.ts"
       ],
-      "percent": 7.53,
+      "percent": 7.11,
       "reduction": 5.64
     },
     {
@@ -88,21 +100,9 @@
       ],
       "removedExports": [],
       "dependents": [],
-      "percent": 7.24,
+      "percent": 6.83,
       "reduction": 4.69
     },
-    {
-      "id": "/src/links/httpSubscriptionLink.ts",
-      "size": 3805,
-      "origSize": 4221,
-      "renderedExports": [
-        "unstable_httpSubscriptionLink"
-      ],
-      "removedExports": [],
-      "dependents": [],
-      "percent": 7.02,
-      "reduction": 9.86
-    },
     {
       "id": "/src/links/httpLink.ts",
       "size": 3183,
@@ -112,13 +112,13 @@
       ],
       "removedExports": [],
       "dependents": [],
-      "percent": 5.87,
+      "percent": 5.54,
       "reduction": 14.14
     },
     {
       "id": "/src/internals/TRPCUntypedClient.ts",
       "size": 2162,
-      "origSize": 4126,
+      "origSize": 4228,
       "renderedExports": [
         "TRPCUntypedClient"
       ],
@@ -127,8 +127,8 @@
         "/src/createTRPCUntypedClient.ts",
         "/src/createTRPCClient.ts"
       ],
-      "percent": 3.99,
-      "reduction": 47.6
+      "percent": 3.76,
+      "reduction": 48.86
     },
     {
       "id": "/src/TRPCClientError.ts",
@@ -147,7 +147,7 @@
         "/src/links/httpSubscriptionLink.ts",
         "/src/internals/TRPCUntypedClient.ts"
       ],
-      "percent": 3.58,
+      "percent": 3.38,
       "reduction": 45.43
     },
     {
@@ -164,7 +164,7 @@
       "dependents": [
         "/src/index.ts"
       ],
-      "percent": 2.19,
+      "percent": 2.07,
       "reduction": 73.19
     },
     {
@@ -179,7 +179,7 @@
         "/src/links/splitLink.ts",
         "/src/internals/TRPCUntypedClient.ts"
       ],
-      "percent": 1.27,
+      "percent": 1.2,
       "reduction": 32.75
     },
     {
@@ -191,7 +191,7 @@
       ],
       "removedExports": [],
       "dependents": [],
-      "percent": 1.12,
+      "percent": 1.06,
       "reduction": 44.95
     },
     {
@@ -205,7 +205,7 @@
       "dependents": [
         "/src/unstable-internals.ts"
       ],
-      "percent": 1.04,
+      "percent": 0.98,
       "reduction": 66.71
     },
     {
@@ -220,7 +220,7 @@
         "/src/index.ts",
         "/src/links/internals/httpUtils.ts"
       ],
-      "percent": 0.79,
+      "percent": 0.75,
       "reduction": 33.54
     },
     {
@@ -234,7 +234,7 @@
       ],
       "removedExports": [],
       "dependents": [],
-      "percent": 0.61,
+      "percent": 0.57,
       "reduction": 15.17
     },
     {
@@ -249,7 +249,7 @@
         "/src/links/wsLink.ts",
         "/src/links/httpSubscriptionLink.ts"
       ],
-      "percent": 0.29,
+      "percent": 0.28,
       "reduction": 81.71
     },
     {
@@ -263,7 +263,7 @@
       "dependents": [
         "/src/index.ts"
       ],
-      "percent": 0.18,
+      "percent": 0.17,
       "reduction": 82.58
     },
     {

package/dist/internals/TRPCUntypedClient.d.ts

@@ -9,11 +9,12 @@ export interface TRPCRequestOptions {
     context?: OperationContext;
     signal?: AbortSignal;
 }
+type inferAsyncIterableYield<T> = T extends AsyncIterable<infer U> ? U : T;
 export interface TRPCSubscriptionObserver<TValue, TError> {
     onStarted: (opts: {
         context: OperationContext | undefined;
     }) => void;
-    onData: (value: TValue) => void;
+    onData: (value: inferAsyncIterableYield<TValue>) => void;
     onError: (err: TError) => void;
     onStopped: () => void;
     onComplete: () => void;
@@ -36,4 +37,5 @@ export declare class TRPCUntypedClient<TRouter extends AnyRouter> {
     mutation(path: string, input?: unknown, opts?: TRPCRequestOptions): Promise<unknown>;
     subscription(path: string, input: unknown, opts: Partial<TRPCSubscriptionObserver<unknown, TRPCClientError<AnyRouter>>> & TRPCRequestOptions): Unsubscribable;
 }
+export {};
 //# sourceMappingURL=TRPCUntypedClient.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"TRPCUntypedClient.d.ts","sourceRoot":"","sources":["../../src/internals/TRPCUntypedClient.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAEV,cAAc,EACf,MAAM,yBAAyB,CAAC;AAEjC,OAAO,KAAK,EACV,SAAS,EACT,qBAAqB,EAErB,SAAS,EACV,MAAM,0CAA0C,CAAC;AAElD,OAAO,KAAK,EACV,gBAAgB,EAEhB,iBAAiB,EACjB,QAAQ,EACT,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAGrD,MAAM,WAAW,kBAAkB;IACjC;;OAEG;IACH,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAC3B,MAAM,CAAC,EAAE,WAAW,CAAC;CACtB;AAED,MAAM,WAAW,wBAAwB,CAAC,MAAM,EAAE,MAAM;IACtD,SAAS,EAAE,CAAC,IAAI,EAAE;QAAE,OAAO,EAAE,gBAAgB,GAAG,SAAS,CAAA;KAAE,KAAK,IAAI,CAAC;IACrE,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,OAAO,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,UAAU,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,gBAAgB;AAChB,MAAM,MAAM,uBAAuB,CAAC,OAAO,SAAS,qBAAqB,IAAI;IAC3E,KAAK,EAAE,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC;IAC3B,WAAW,CAAC,EAAE,SAAS,CAAC,qEAAqE,CAAC,CAAC;CAChG,CAAC;AAEF,gBAAgB;AAChB,MAAM,MAAM,uBAAuB,GAC/B,UAAU,GACV,OAAO,GACP,UAAU,GACV,OAAO,GACP,kBAAkB,GAClB,WAAW,GACX,SAAS,GACT,cAAc,CAAC;AAEnB,qBAAa,iBAAiB,CAAC,OAAO,SAAS,SAAS;IACtD,OAAO,CAAC,QAAQ,CAAC,KAAK,CAA6B;IACnD,SAAgB,OAAO,EAAE,iBAAiB,CAAC;IAC3C,OAAO,CAAC,SAAS,CAAS;gBAEd,IAAI,EAAE,uBAAuB,CAAC,OAAO,CAAC;IASlD,OAAO,CAAC,QAAQ;YAkBF,gBAAgB;IAkBvB,KAAK,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,EAAE,kBAAkB;IAS9D,QAAQ,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,EAAE,kBAAkB;IASjE,YAAY,CACjB,IAAI,EAAE,MAAM,EACZ,KAAK,EAAE,OAAO,EACd,IAAI,EAAE,OAAO,CACX,wBAAwB,CAAC,OAAO,EAAE,eAAe,CAAC,SAAS,CAAC,CAAC,CAC9D,GACC,kBAAkB,GACnB,cAAc;CA4BlB"}
+{"version":3,"file":"TRPCUntypedClient.d.ts","sourceRoot":"","sources":["../../src/internals/TRPCUntypedClient.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAEV,cAAc,EACf,MAAM,yBAAyB,CAAC;AAEjC,OAAO,KAAK,EACV,SAAS,EACT,qBAAqB,EAErB,SAAS,EACV,MAAM,0CAA0C,CAAC;AAElD,OAAO,KAAK,EACV,gBAAgB,EAEhB,iBAAiB,EACjB,QAAQ,EACT,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAGrD,MAAM,WAAW,kBAAkB;IACjC;;OAEG;IACH,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAC3B,MAAM,CAAC,EAAE,WAAW,CAAC;CACtB;AAED,KAAK,uBAAuB,CAAC,CAAC,IAAI,CAAC,SAAS,aAAa,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AAE3E,MAAM,WAAW,wBAAwB,CAAC,MAAM,EAAE,MAAM;IACtD,SAAS,EAAE,CAAC,IAAI,EAAE;QAAE,OAAO,EAAE,gBAAgB,GAAG,SAAS,CAAA;KAAE,KAAK,IAAI,CAAC;IACrE,MAAM,EAAE,CAAC,KAAK,EAAE,uBAAuB,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC;IACzD,OAAO,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,UAAU,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,gBAAgB;AAChB,MAAM,MAAM,uBAAuB,CAAC,OAAO,SAAS,qBAAqB,IAAI;IAC3E,KAAK,EAAE,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC;IAC3B,WAAW,CAAC,EAAE,SAAS,CAAC,qEAAqE,CAAC,CAAC;CAChG,CAAC;AAEF,gBAAgB;AAChB,MAAM,MAAM,uBAAuB,GAC/B,UAAU,GACV,OAAO,GACP,UAAU,GACV,OAAO,GACP,kBAAkB,GAClB,WAAW,GACX,SAAS,GACT,cAAc,CAAC;AAEnB,qBAAa,iBAAiB,CAAC,OAAO,SAAS,SAAS;IACtD,OAAO,CAAC,QAAQ,CAAC,KAAK,CAA6B;IACnD,SAAgB,OAAO,EAAE,iBAAiB,CAAC;IAC3C,OAAO,CAAC,SAAS,CAAS;gBAEd,IAAI,EAAE,uBAAuB,CAAC,OAAO,CAAC;IASlD,OAAO,CAAC,QAAQ;YAkBF,gBAAgB;IAkBvB,KAAK,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,EAAE,kBAAkB;IAS9D,QAAQ,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,EAAE,kBAAkB;IASjE,YAAY,CACjB,IAAI,EAAE,MAAM,EACZ,KAAK,EAAE,OAAO,EACd,IAAI,EAAE,OAAO,CACX,wBAAwB,CAAC,OAAO,EAAE,eAAe,CAAC,SAAS,CAAC,CAAC,CAC9D,GACC,kBAAkB,GACnB,cAAc;CA4BlB"}

package/dist/links/httpSubscriptionLink.d.ts

@@ -3,11 +3,26 @@ import { type TransformerOptions } from '../unstable-internals';
 import type { CallbackOrValue } from './internals/urlWithConnectionParams';
 import { type UrlOptionsWithConnectionParams } from './internals/urlWithConnectionParams';
 import type { TRPCLink } from './types';
+type RecreateOnErrorOpt = {
+    type: 'raw';
+    event: Event;
+} | {
+    type: 'http-error';
+    status: number;
+    event: Event;
+};
 type HTTPSubscriptionLinkOptions<TRoot extends AnyClientTypes> = {
     /**
      * EventSource options or a callback that returns them
      */
     eventSourceOptions?: CallbackOrValue<EventSourceInit>;
+    /**
+     * For a given error, should we reinitialize the underlying EventSource?
+     *
+     * This is useful where a long running subscription might be interrupted by a recoverable network error,
+     * but the existing authorization in a header or URI has expired in the mean-time
+     */
+    shouldRecreateOnError?: (opt: RecreateOnErrorOpt) => boolean | Promise<boolean>;
 } & TransformerOptions<TRoot> & UrlOptionsWithConnectionParams;
 /**
  * @see https://trpc.io/docs/client/links/httpSubscriptionLink

package/dist/links/httpSubscriptionLink.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"httpSubscriptionLink.d.ts","sourceRoot":"","sources":["../../src/links/httpSubscriptionLink.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,cAAc,EACd,gBAAgB,EAChB,qBAAqB,EACtB,MAAM,0CAA0C,CAAC;AAMlD,OAAO,EAAkB,KAAK,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAEhF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qCAAqC,CAAC;AAC3E,OAAO,EAEL,KAAK,8BAA8B,EACpC,MAAM,qCAAqC,CAAC;AAC7C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAiBxC,KAAK,2BAA2B,CAAC,KAAK,SAAS,cAAc,IAAI;IAC/D;;OAEG;IACH,kBAAkB,CAAC,EAAE,eAAe,CAAC,eAAe,CAAC,CAAC;CACvD,GAAG,kBAAkB,CAAC,KAAK,CAAC,GAC3B,8BAA8B,CAAC;AAEjC;;GAEG;AACH,wBAAgB,6BAA6B,CAC3C,WAAW,SAAS,qBAAqB,EAEzC,IAAI,EAAE,2BAA2B,CAAC,gBAAgB,CAAC,WAAW,CAAC,CAAC,GAC/D,QAAQ,CAAC,WAAW,CAAC,CA2FvB"}
+{"version":3,"file":"httpSubscriptionLink.d.ts","sourceRoot":"","sources":["../../src/links/httpSubscriptionLink.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,cAAc,EACd,gBAAgB,EAChB,qBAAqB,EACtB,MAAM,0CAA0C,CAAC;AAMlD,OAAO,EAAkB,KAAK,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAEhF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qCAAqC,CAAC;AAC3E,OAAO,EAEL,KAAK,8BAA8B,EACpC,MAAM,qCAAqC,CAAC;AAC7C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAiBxC,KAAK,kBAAkB,GACnB;IACE,IAAI,EAAE,KAAK,CAAC;IACZ,KAAK,EAAE,KAAK,CAAC;CACd,GACD;IACE,IAAI,EAAE,YAAY,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,KAAK,CAAC;CACd,CAAC;AAEN,KAAK,2BAA2B,CAAC,KAAK,SAAS,cAAc,IAAI;IAC/D;;OAEG;IACH,kBAAkB,CAAC,EAAE,eAAe,CAAC,eAAe,CAAC,CAAC;IACtD;;;;;OAKG;IACH,qBAAqB,CAAC,EAAE,CACtB,GAAG,EAAE,kBAAkB,KACpB,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC,CAAC;CACjC,GAAG,kBAAkB,CAAC,KAAK,CAAC,GAC3B,8BAA8B,CAAC;AAEjC;;GAEG;AACH,wBAAgB,6BAA6B,CAC3C,WAAW,SAAS,qBAAqB,EAEzC,IAAI,EAAE,2BAA2B,CAAC,gBAAgB,CAAC,WAAW,CAAC,CAAC,GAC/D,QAAQ,CAAC,WAAW,CAAC,CA2HvB"}

package/dist/links/httpSubscriptionLink.js

@@ -7,6 +7,7 @@ var transformer = require('../internals/transformer.js');
 var httpUtils = require('./internals/httpUtils.js');
 var urlWithConnectionParams$1 = require('./internals/urlWithConnectionParams.js');
 
+var _listeners, _type, _listeners1, _type1;
 async function urlWithConnectionParams(opts) {
     let url = await urlWithConnectionParams$1.resultOf(opts.url);
     if (opts.connectionParams) {
@@ -43,24 +44,43 @@ async function urlWithConnectionParams(opts) {
                         // already unsubscribed - rare race condition
                         return;
                     }
-                    eventSource = new EventSource(url, eventSourceOptions);
+                    eventSource = new EventSourceWrapper(url, eventSourceOptions);
                     const onStarted = ()=>{
                         observer.next({
                             result: {
                                 type: 'started'
                             },
                             context: {
-                                eventSource
+                                // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+                                eventSource: eventSource.getEventSource()
                             }
                         });
-                        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                        eventSource.removeEventListener('open', onStarted);
                     };
-                    // console.log('starting', new Date());
-                    eventSource.addEventListener('open', onStarted);
+                    eventSource.addEventListener('open', onStarted, {
+                        once: true
+                    });
                     const iterable = unstableCoreDoNotImport.sseStreamConsumer({
                         from: eventSource,
-                        deserialize: transformer$1.output.deserialize
+                        deserialize: transformer$1.output.deserialize,
+                        tryHandleError: async (ev)=>{
+                            if (typeof opts.shouldRecreateOnError !== 'function' || !eventSource) {
+                                return false;
+                            }
+                            const recreateOnErrorOpts = createRecreateOnErrorOpts(ev);
+                            const shouldRestart = await opts.shouldRecreateOnError(recreateOnErrorOpts);
+                            if (!shouldRestart) {
+                                return false;
+                            }
+                            eventSource.restart(httpUtils.getUrl({
+                                transformer: transformer$1,
+                                url: await urlWithConnectionParams(opts),
+                                input,
+                                path,
+                                type,
+                                signal: null
+                            }), await urlWithConnectionParams$1.resultOf(opts.eventSourceOptions));
+                            return true;
+                        }
                     });
                     for await (const chunk of iterable){
                         if (!chunk.ok) {
@@ -93,5 +113,71 @@ async function urlWithConnectionParams(opts) {
         };
     };
 }
+function createRecreateOnErrorOpts(ev) {
+    if ('status' in ev && typeof ev.status === 'number') {
+        return {
+            type: 'http-error',
+            status: ev.status,
+            event: ev
+        };
+    }
+    return {
+        type: 'raw',
+        event: ev
+    };
+}
+/**
+ * We wrap EventSource so that is can be reinitialized with new options
+ */ class EventSourceWrapper {
+    *getAllEventListeners() {
+        for(const _type in this.listeners){
+            const type = _type;
+            for (const listener of this.listeners[type] ?? []){
+                yield listener;
+            }
+        }
+    }
+    restart(url, options) {
+        for (const [type, callback, options1] of this.getAllEventListeners()){
+            this.es.removeEventListener(type, callback, options1);
+        }
+        this.es.close();
+        this.es = new EventSource(url, options);
+        for (const [type1, callback1, options2] of this.getAllEventListeners()){
+            this.es.addEventListener(type1, callback1, options2);
+        }
+    }
+    close() {
+        this.listeners = {};
+        this.es.close();
+    }
+    getEventSource() {
+        return this.es;
+    }
+    get readyState() {
+        return this.es.readyState;
+    }
+    addEventListener(type, listener, options) {
+        (_listeners = this.listeners)[_type = type] ?? (_listeners[_type] = []);
+        this.listeners[type].push([
+            type,
+            listener,
+            options
+        ]);
+        this.es.addEventListener(type, listener, options);
+    }
+    removeEventListener(type, listener, options) {
+        (_listeners1 = this.listeners)[_type1 = type] ?? (_listeners1[_type1] = []);
+        const indexToRemove = this.listeners[type]?.findIndex(([_type, thisListener])=>thisListener === listener);
+        if (typeof indexToRemove === 'number' && indexToRemove >= 0) {
+            this.listeners[type].splice(indexToRemove, 1);
+        }
+        this.es.removeEventListener(type, listener, options);
+    }
+    constructor(url, options){
+        this.listeners = {};
+        this.es = new EventSource(url, options);
+    }
+}
 
 exports.unstable_httpSubscriptionLink = unstable_httpSubscriptionLink;

package/dist/links/httpSubscriptionLink.mjs

@@ -5,6 +5,7 @@ import { getTransformer } from '../internals/transformer.mjs';
 import { getUrl } from './internals/httpUtils.mjs';
 import { resultOf } from './internals/urlWithConnectionParams.mjs';
 
+var _listeners, _type, _listeners1, _type1;
 async function urlWithConnectionParams(opts) {
     let url = await resultOf(opts.url);
     if (opts.connectionParams) {
@@ -41,24 +42,43 @@ async function urlWithConnectionParams(opts) {
                         // already unsubscribed - rare race condition
                         return;
                     }
-                    eventSource = new EventSource(url, eventSourceOptions);
+                    eventSource = new EventSourceWrapper(url, eventSourceOptions);
                     const onStarted = ()=>{
                         observer.next({
                             result: {
                                 type: 'started'
                             },
                             context: {
-                                eventSource
+                                // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+                                eventSource: eventSource.getEventSource()
                             }
                         });
-                        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                        eventSource.removeEventListener('open', onStarted);
                     };
-                    // console.log('starting', new Date());
-                    eventSource.addEventListener('open', onStarted);
+                    eventSource.addEventListener('open', onStarted, {
+                        once: true
+                    });
                     const iterable = sseStreamConsumer({
                         from: eventSource,
-                        deserialize: transformer.output.deserialize
+                        deserialize: transformer.output.deserialize,
+                        tryHandleError: async (ev)=>{
+                            if (typeof opts.shouldRecreateOnError !== 'function' || !eventSource) {
+                                return false;
+                            }
+                            const recreateOnErrorOpts = createRecreateOnErrorOpts(ev);
+                            const shouldRestart = await opts.shouldRecreateOnError(recreateOnErrorOpts);
+                            if (!shouldRestart) {
+                                return false;
+                            }
+                            eventSource.restart(getUrl({
+                                transformer,
+                                url: await urlWithConnectionParams(opts),
+                                input,
+                                path,
+                                type,
+                                signal: null
+                            }), await resultOf(opts.eventSourceOptions));
+                            return true;
+                        }
                     });
                     for await (const chunk of iterable){
                         if (!chunk.ok) {
@@ -91,5 +111,71 @@ async function urlWithConnectionParams(opts) {
         };
     };
 }
+function createRecreateOnErrorOpts(ev) {
+    if ('status' in ev && typeof ev.status === 'number') {
+        return {
+            type: 'http-error',
+            status: ev.status,
+            event: ev
+        };
+    }
+    return {
+        type: 'raw',
+        event: ev
+    };
+}
+/**
+ * We wrap EventSource so that is can be reinitialized with new options
+ */ class EventSourceWrapper {
+    *getAllEventListeners() {
+        for(const _type in this.listeners){
+            const type = _type;
+            for (const listener of this.listeners[type] ?? []){
+                yield listener;
+            }
+        }
+    }
+    restart(url, options) {
+        for (const [type, callback, options1] of this.getAllEventListeners()){
+            this.es.removeEventListener(type, callback, options1);
+        }
+        this.es.close();
+        this.es = new EventSource(url, options);
+        for (const [type1, callback1, options2] of this.getAllEventListeners()){
+            this.es.addEventListener(type1, callback1, options2);
+        }
+    }
+    close() {
+        this.listeners = {};
+        this.es.close();
+    }
+    getEventSource() {
+        return this.es;
+    }
+    get readyState() {
+        return this.es.readyState;
+    }
+    addEventListener(type, listener, options) {
+        (_listeners = this.listeners)[_type = type] ?? (_listeners[_type] = []);
+        this.listeners[type].push([
+            type,
+            listener,
+            options
+        ]);
+        this.es.addEventListener(type, listener, options);
+    }
+    removeEventListener(type, listener, options) {
+        (_listeners1 = this.listeners)[_type1 = type] ?? (_listeners1[_type1] = []);
+        const indexToRemove = this.listeners[type]?.findIndex(([_type, thisListener])=>thisListener === listener);
+        if (typeof indexToRemove === 'number' && indexToRemove >= 0) {
+            this.listeners[type].splice(indexToRemove, 1);
+        }
+        this.es.removeEventListener(type, listener, options);
+    }
+    constructor(url, options){
+        this.listeners = {};
+        this.es = new EventSource(url, options);
+    }
+}
 
 export { unstable_httpSubscriptionLink };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trpc/client",
-  "version": "11.0.0-rc.552+268308497",
+  "version": "11.0.0-rc.560+137b085f8",
   "description": "The tRPC client library",
   "author": "KATT",
   "license": "MIT",
@@ -76,10 +76,10 @@
     "!**/*.test.*"
   ],
   "peerDependencies": {
-    "@trpc/server": "11.0.0-rc.552+268308497"
+    "@trpc/server": "11.0.0-rc.560+137b085f8"
   },
   "devDependencies": {
-    "@trpc/server": "11.0.0-rc.552+268308497",
+    "@trpc/server": "11.0.0-rc.560+137b085f8",
     "@types/isomorphic-fetch": "^0.0.39",
     "@types/node": "^20.10.0",
     "eslint": "^8.57.0",
@@ -96,5 +96,5 @@
   "funding": [
     "https://trpc.io/sponsor"
   ],
-  "gitHead": "268308497fef646ca5e322b49d1503cd47392871"
+  "gitHead": "137b085f86cb4ceb397b29c69ccbe38a93dbe79a"
 }

package/src/internals/TRPCUntypedClient.ts

@@ -27,9 +27,11 @@ export interface TRPCRequestOptions {
   signal?: AbortSignal;
 }
 
+type inferAsyncIterableYield<T> = T extends AsyncIterable<infer U> ? U : T;
+
 export interface TRPCSubscriptionObserver<TValue, TError> {
   onStarted: (opts: { context: OperationContext | undefined }) => void;
-  onData: (value: TValue) => void;
+  onData: (value: inferAsyncIterableYield<TValue>) => void;
   onError: (err: TError) => void;
   onStopped: () => void;
   onComplete: () => void;

package/src/links/httpSubscriptionLink.ts

@@ -33,11 +33,31 @@ async function urlWithConnectionParams(
   return url;
 }
 
+type RecreateOnErrorOpt =
+  | {
+      type: 'raw';
+      event: Event;
+    }
+  | {
+      type: 'http-error';
+      status: number;
+      event: Event;
+    };
+
 type HTTPSubscriptionLinkOptions<TRoot extends AnyClientTypes> = {
   /**
    * EventSource options or a callback that returns them
    */
   eventSourceOptions?: CallbackOrValue<EventSourceInit>;
+  /**
+   * For a given error, should we reinitialize the underlying EventSource?
+   *
+   * This is useful where a long running subscription might be interrupted by a recoverable network error,
+   * but the existing authorization in a header or URI has expired in the mean-time
+   */
+  shouldRecreateOnError?: (
+    opt: RecreateOnErrorOpt,
+  ) => boolean | Promise<boolean>;
 } & TransformerOptions<TRoot> &
   UrlOptionsWithConnectionParams;
 
@@ -60,7 +80,7 @@ export function unstable_httpSubscriptionLink<
           throw new Error('httpSubscriptionLink only supports subscriptions');
         }
 
-        let eventSource: EventSource | null = null;
+        let eventSource: EventSourceWrapper | null = null;
         let unsubscribed = false;
 
         run(async () => {
@@ -79,22 +99,22 @@ export function unstable_httpSubscriptionLink<
             // already unsubscribed - rare race condition
             return;
           }
-          eventSource = new EventSource(url, eventSourceOptions);
+
+          eventSource = new EventSourceWrapper(url, eventSourceOptions);
+
           const onStarted = () => {
             observer.next({
               result: {
                 type: 'started',
               },
               context: {
-                eventSource,
+                // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+                eventSource: eventSource!.getEventSource(),
               },
             });
-
-            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-            eventSource!.removeEventListener('open', onStarted);
           };
-          // console.log('starting', new Date());
-          eventSource.addEventListener('open', onStarted);
+          eventSource.addEventListener('open', onStarted, { once: true });
+
           const iterable = sseStreamConsumer<
             Partial<{
               id?: string;
@@ -103,6 +123,38 @@ export function unstable_httpSubscriptionLink<
           >({
             from: eventSource,
             deserialize: transformer.output.deserialize,
+            tryHandleError: async (ev) => {
+              if (
+                typeof opts.shouldRecreateOnError !== 'function' ||
+                !eventSource
+              ) {
+                return false;
+              }
+
+              const recreateOnErrorOpts = createRecreateOnErrorOpts(ev);
+
+              const shouldRestart = await opts.shouldRecreateOnError(
+                recreateOnErrorOpts,
+              );
+
+              if (!shouldRestart) {
+                return false;
+              }
+
+              eventSource.restart(
+                getUrl({
+                  transformer,
+                  url: await urlWithConnectionParams(opts),
+                  input,
+                  path,
+                  type,
+                  signal: null,
+                }),
+                await resultOf(opts.eventSourceOptions),
+              );
+
+              return true;
+            },
           });
 
           for await (const chunk of iterable) {
@@ -140,3 +192,97 @@ export function unstable_httpSubscriptionLink<
     };
   };
 }
+
+function createRecreateOnErrorOpts(ev: Event): RecreateOnErrorOpt {
+  if ('status' in ev && typeof ev.status === 'number') {
+    return {
+      type: 'http-error',
+      status: ev.status,
+      event: ev,
+    };
+  }
+
+  return {
+    type: 'raw',
+    event: ev,
+  };
+}
+
+/**
+ * We wrap EventSource so that is can be reinitialized with new options
+ */
+class EventSourceWrapper implements Partial<EventSource> {
+  private es: EventSource;
+
+  private listeners: Partial<
+    Record<
+      keyof EventSourceEventMap,
+      Parameters<EventSource['addEventListener']>[]
+    >
+  > = {};
+  private *getAllEventListeners() {
+    for (const _type in this.listeners) {
+      const type = _type as keyof typeof this.listeners;
+      for (const listener of this.listeners[type] ?? []) {
+        yield listener;
+      }
+    }
+  }
+
+  constructor(url: string, options: EventSourceInit | undefined) {
+    this.es = new EventSource(url, options);
+  }
+
+  restart(url: string, options: EventSourceInit | undefined) {
+    for (const [type, callback, options] of this.getAllEventListeners()) {
+      this.es.removeEventListener(type, callback, options);
+    }
+
+    this.es.close();
+    this.es = new EventSource(url, options);
+
+    for (const [type, callback, options] of this.getAllEventListeners()) {
+      this.es.addEventListener(type, callback, options);
+    }
+  }
+
+  close() {
+    this.listeners = {};
+    this.es.close();
+  }
+
+  getEventSource() {
+    return this.es;
+  }
+
+  get readyState() {
+    return this.es.readyState;
+  }
+
+  addEventListener<TEvent extends keyof EventSourceEventMap>(
+    type: TEvent,
+    listener: (this: EventSource, ev: EventSourceEventMap[TEvent]) => any,
+    options?: boolean | AddEventListenerOptions,
+  ) {
+    this.listeners[type] ??= [];
+    this.listeners[type].push([type, listener as any, options]);
+
+    this.es.addEventListener(type, listener, options);
+  }
+
+  removeEventListener<TEvent extends keyof EventSourceEventMap>(
+    type: TEvent,
+    listener: (this: EventSource, ev: EventSourceEventMap[TEvent]) => any,
+    options?: boolean | EventListenerOptions,
+  ) {
+    this.listeners[type] ??= [];
+
+    const indexToRemove = this.listeners[type]?.findIndex(
+      ([_type, thisListener]) => thisListener === listener,
+    );
+    if (typeof indexToRemove === 'number' && indexToRemove >= 0) {
+      this.listeners[type].splice(indexToRemove, 1);
+    }
+    this.es.removeEventListener(type, listener, options);
+  }
+}