@voltkit-rtc/client 0.7.1 → 0.7.2

package/dist/esm/index.js

@@ -110,6 +110,16 @@ export class StreamClient {
     /** In-app music being published, kept across reconnects so it can be published again. */
     music = null;
     musicProducerId = null;
+    /**
+     * Bumped by every publishMusic() and stopMusic(). A music producer still
+     * being made when it changes belongs to a publish that is over: it is
+     * closed, not kept. publishGeneration alone missed stopMusic(), and the
+     * music went out after stopMusic() had returned.
+     */
+    musicOperation = 0;
+    // Music publishes run one at a time: the server takes one producer per
+    // source, so the next is produced only once the last one is settled.
+    musicQueue = Promise.resolve();
     screenStream = null;
     screenMode = 'detail';
     screenAudioEnabled = true;
@@ -126,6 +136,8 @@ export class StreamClient {
     frameRateWarmupSamples = 2;
     /** What each remote producer carries, so a pause can say "music" rather than just "audio". */
     remoteSources = new Map();
+    /** Identity of each pending/active subscription; cleared on close/reconnect. */
+    subscriptions = new Map();
     /**
      * The layers asked for each remote video, by producerId. A reconnect
      * consumes everything again, and the new consumer would otherwise start at
@@ -164,6 +176,17 @@ export class StreamClient {
     /** When the token held for reconnects expires (unix ms), and the timer that warns before it does. */
     tokenExpiry;
     tokenTimer = null;
+    /**
+     * Bumped whenever the server hands this client a token (its own refresh, a
+     * promotion's). An updateToken() that started before then keeps the token
+     * it was given only if nothing newer arrived while it waited: its reply,
+     * or its fallback once the socket closed, used to replace a promotion's
+     * token, and the reconnect joined with the old one.
+     */
+    serverTokenRevision = 0;
+    /** updateToken() calls in call order, and the newest one whose token is held: a later call wins over an earlier one answered after it. */
+    tokenRequests = 0;
+    tokenRequestHeld = 0;
     /** Whose each received track is and whether it is switched off, by producerId. */
     remoteInfo = new Map();
     /** Videos left unconsumed at the fan-out limit, oldest first; consumed as others end. */
@@ -225,6 +248,17 @@ export class StreamClient {
         this.setState('closed');
         this.emit('closed', reason);
     }
+    /**
+     * Over for good without the app asking: finish, then release everything
+     * local as close() does -- camera, microphone, screen, music, recording.
+     * kicked and roomClosed always did; a replaced socket, a close without
+     * roomClosed and a reconnect that gave up left them capturing (and the
+     * recording uploading) after `closed`, until the app called close().
+     */
+    end(reason) {
+        this.finish(reason);
+        this.close();
+    }
     stopTimers() {
         if (this.tokenTimer)
             clearTimeout(this.tokenTimer);
@@ -251,8 +285,13 @@ export class StreamClient {
         let result;
         if (this.state === 'idle' || this.state === 'closed')
             this.setState('connecting');
+        // The socket this call opens. A later connect() replaces it, and this
+        // call's failure must then leave the newer socket, and the state, alone.
+        let socket = null;
         try {
-            await this.openSocket();
+            const opening = this.openSocket();
+            socket = this.ws;
+            await opening;
             result = (await this.rpc('join', { token: this.token }));
             this.joinResult = result;
             this.device = this.createDevice();
@@ -266,7 +305,8 @@ export class StreamClient {
             // A session that never got going: the app has the error. Left open,
             // the socket would be closed by the server's join deadline instead, and
             // that close would start reconnecting a session that never began.
-            if (!this.joinedOnce) {
+            const superseded = this.ws !== null && this.ws !== socket;
+            if (!this.joinedOnce && !superseded) {
                 this.detachSocket();
                 if (this.state === 'connecting')
                     this.setState('idle');
@@ -370,17 +410,16 @@ export class StreamClient {
                     // Another session for this identity is live. Reconnecting would
                     // displace it, and it would displace us right back, forever.
                     this.emit('error', new RpcError('replaced', 'this identity connected from somewhere else'));
-                    // The producers outlive this close until the app calls close(); the
-                    // videoLimited sampling must not, or it reports after `closed`.
+                    // The videoLimited sampling stops first, or it reports after `closed`.
                     this.limitWatch.reset();
-                    this.finish('replaced');
+                    this.end('replaced');
                     return;
                 }
                 if (ev.code === CLOSE_ENDED) {
                     // Normally roomClosed has already ended the session; this covers a
                     // close that arrived without it.
                     this.limitWatch.reset();
-                    this.finish('room-closed');
+                    this.end('room-closed');
                     return;
                 }
                 // Before a first successful join the app is still waiting on
@@ -393,10 +432,12 @@ export class StreamClient {
             });
         });
     }
-    detachSocket(reason = 'superseded') {
+    detachSocket(reason = 'superseded', why = 'the connection was replaced') {
         const ws = this.ws;
         this.ws = null;
-        if (ws && ws.readyState <= WebSocket.OPEN) {
+        if (!ws)
+            return;
+        if (ws.readyState <= WebSocket.OPEN) {
             try {
                 ws.close(1000, reason);
             }
@@ -404,6 +445,10 @@ export class StreamClient {
                 /* already closing */
             }
         }
+        // Its replies are no longer read, so what waits on it would only wait out
+        // its 15 s timeout: it fails now, as on a close. Never replayed -- the
+        // server may already have acted on it.
+        this.failPending(ws, new RpcError('not-connected', why));
     }
     /**
      * A reconnect that ends the session lets go of its socket. A refused join
@@ -412,7 +457,7 @@ export class StreamClient {
      * still sending.
      */
     releaseSocket() {
-        this.detachSocket('gave up');
+        this.detachSocket('gave up', 'the session has ended');
         this.failAllPending(new RpcError('not-connected', 'the session has ended'));
     }
     /**
@@ -433,7 +478,7 @@ export class StreamClient {
                 if (this.reconnectAttempt > MAX_RECONNECT_ATTEMPTS) {
                     this.emit('error', new RpcError('reconnect-gave-up', `gave up after ${MAX_RECONNECT_ATTEMPTS} reconnect attempts`));
                     this.releaseSocket();
-                    this.finish('gave-up');
+                    this.end('gave-up');
                     return;
                 }
                 const backoff = Math.min(500 * 2 ** (this.reconnectAttempt - 1), 15_000);
@@ -461,7 +506,7 @@ export class StreamClient {
                     // attempt forever and drowns out whatever actually went wrong.
                     if (err instanceof RpcError && isTerminalError(err.code)) {
                         this.releaseSocket();
-                        this.finish('gave-up');
+                        this.end('gave-up');
                         return;
                     }
                 }
@@ -506,6 +551,7 @@ export class StreamClient {
             this.emit('closed', 'left');
     }
     teardownMedia() {
+        this.subscriptions.clear();
         for (const c of this.consumers.values())
             c.close();
         this.consumers.clear();
@@ -576,19 +622,29 @@ export class StreamClient {
      * `tokenExpiring`. On a live connection the server checks it like a join
      * token (`bad-token`, or `token-mismatch` for another room or identity; the
      * session then keeps its token); otherwise it is kept for the next join,
-     * which checks it there. Resolves to when it expires (unix ms), when known.
+     * which checks it there. Resolves to when the token now held expires (unix
+     * ms), when known. A newer token that arrives while this waits is kept
+     * instead of this one: the server's (its own refresh, or a promotion's,
+     * which carries the new role) or a later updateToken()'s.
      */
     async updateToken(token) {
         if (typeof token !== 'string' || token.trim() === '')
             throw new TypeError('updateToken needs a token');
         if (this.state === 'closed')
             throw new RpcError('not-connected', 'this session is closed; create a new client');
+        const request = ++this.tokenRequests;
+        const revision = this.serverTokenRevision;
+        const keep = (expiresAt) => {
+            if (revision === this.serverTokenRevision && request > this.tokenRequestHeld) {
+                this.tokenRequestHeld = request;
+                this.setToken(token, expiresAt);
+            }
+            return { expiresAt: this.tokenExpiry };
+        };
         if (this.state === 'connected' && this.ws?.readyState === WebSocket.OPEN) {
             try {
                 const res = (await this.rpc('refreshToken', { token }));
-                const at = typeof res?.expiresAt === 'number' && res.expiresAt > 0 ? res.expiresAt * 1000 : null;
-                this.setToken(token, at);
-                return { expiresAt: this.tokenExpiry };
+                return keep(typeof res?.expiresAt === 'number' && res.expiresAt > 0 ? res.expiresAt * 1000 : null);
             }
             catch (err) {
                 // An older server has no refreshToken, and a socket that dropped
@@ -598,8 +654,7 @@ export class StreamClient {
                     throw err;
             }
         }
-        this.setToken(token, null);
-        return { expiresAt: this.tokenExpiry };
+        return keep(null);
     }
     /** The token reconnects use from now on, with its expiry (read from the token when not given). */
     setToken(token, expiresAt) {
@@ -660,10 +715,20 @@ export class StreamClient {
                 this.pending.delete(id);
                 reject(new RpcError('timeout', `${method} timed out`));
             }, RPC_TIMEOUT_MS);
-            this.pending.set(id, { resolve, reject, timer });
+            this.pending.set(id, { resolve, reject, timer, ws: this.ws });
             this.ws.send(JSON.stringify({ id, method, params }));
         });
     }
+    /** Fail what was sent on `ws` and is still waiting. */
+    failPending(ws, err) {
+        for (const [id, p] of this.pending) {
+            if (p.ws !== ws)
+                continue;
+            clearTimeout(p.timer);
+            this.pending.delete(id);
+            p.reject(err);
+        }
+    }
     failAllPending(err) {
         for (const p of this.pending.values()) {
             clearTimeout(p.timer);
@@ -708,23 +773,21 @@ export class StreamClient {
                 break;
             case 'producerClosed': {
                 const { producerId, identity } = data;
+                this.subscriptions.delete(producerId);
                 this.preferredLayers.delete(producerId);
                 this.receiveQualities.delete(producerId);
                 this.remoteVideoLayers.delete(producerId);
                 this.skippedVideos.delete(producerId);
                 const consumer = this.consumers.get(producerId);
-                if (!consumer)
-                    break; // never consumed it, or already cleaned up
-                this.videoSlots.delete(producerId);
-                consumer.close();
+                consumer?.close();
                 this.consumers.delete(producerId);
                 this.remoteSources.delete(producerId);
                 this.remoteInfo.delete(producerId);
-                this.emit('trackEnded', { producerId, identity });
+                if (consumer)
+                    this.emit('trackEnded', { producerId, identity });
                 // A video slot opened under the fan-out limit: the oldest video left
                 // waiting takes it.
-                if (consumer.kind === 'video')
-                    void this.consumeSkipped().catch((err) => this.emit('error', err));
+                this.releaseVideoSlot(producerId);
                 break;
             }
             case 'producerPaused': {
@@ -822,15 +885,19 @@ export class StreamClient {
                 // fresh one periodically so a reconnect at any point still works --
                 // without this, any disconnect after the token's lifetime is terminal.
                 const e = data;
-                if (e.token)
+                if (e.token) {
+                    this.serverTokenRevision += 1;
                     this.setToken(e.token, typeof e.expiresAt === 'number' && e.expiresAt > 0 ? e.expiresAt * 1000 : null);
+                }
                 break;
             }
             case 'mustReconnect': {
                 const e = data;
                 // A promotion hands us a fresh token carrying the new role.
-                if (e.token)
+                if (e.token) {
+                    this.serverTokenRevision += 1;
                     this.setToken(e.token, null);
+                }
                 this.emit('mustReconnect', e);
                 if (e.retry) {
                     this.teardownMedia();
@@ -1594,8 +1661,11 @@ export class StreamClient {
                     await this.stopScreen('stopped');
                 this.emit('error', err);
             });
-        if (this.music)
-            await this.produceMusic(this.music, generation).catch((err) => this.emit('error', err));
+        if (this.music) {
+            const music = this.music;
+            const operation = this.musicOperation;
+            await this.musicTask(() => this.produceMusic(music, generation, operation)).catch((err) => this.emit('error', err));
+        }
         if (generation !== this.publishGeneration)
             return;
         let stream = this.localStream;
@@ -1829,28 +1899,43 @@ export class StreamClient {
         if (!this.mediaPermissions.audio)
             throw new RpcError('media-disabled', 'audio is switched off for this project');
         const generation = this.publishGeneration;
-        if (this.music)
-            await this.stopMusic();
-        const music = new MusicSource(input, options);
-        try {
-            await this.produceMusic(music, generation);
-            // Checked again here: an unpublish() after the producer was kept has
-            // already closed it, and the music must not be remembered for a
-            // reconnect to publish again.
-            if (generation !== this.publishGeneration)
+        // Taken now, in call order: a music publish still under way is over, and
+        // a stopMusic() from here on ends this one.
+        const operation = ++this.musicOperation;
+        await this.musicTask(async () => {
+            if (generation !== this.publishGeneration || operation !== this.musicOperation)
                 throw unpublishedWhile('music');
-        }
-        catch (err) {
-            music.close();
-            throw err;
-        }
-        this.music = music;
-        this.wasPublishing = true;
-        this.emitLocalMedia();
+            if (this.music)
+                await this.closeMusic();
+            const music = new MusicSource(input, options);
+            try {
+                await this.produceMusic(music, generation, operation);
+                // Checked again here: an unpublish() or stopMusic() after the
+                // producer was kept has already closed it, and the music must not be
+                // remembered for a reconnect to publish again.
+                if (generation !== this.publishGeneration || operation !== this.musicOperation)
+                    throw unpublishedWhile('music');
+            }
+            catch (err) {
+                music.close();
+                throw err;
+            }
+            this.music = music;
+            this.wasPublishing = true;
+            this.emitLocalMedia();
+        });
     }
-    async produceMusic(music, generation) {
+    musicTask(task) {
+        const run = this.musicQueue.then(task, task);
+        this.musicQueue = run.catch(() => undefined);
+        return run;
+    }
+    async produceMusic(music, generation, operation) {
+        // unpublish(), stopMusic() or a newer publishMusic() can run at any wait
+        // below, and wins.
+        const current = () => generation === this.publishGeneration && operation === this.musicOperation;
         const transport = await this.ensureSendTransport();
-        if (generation !== this.publishGeneration)
+        if (!current())
             throw unpublishedWhile('music');
         const producer = await transport.produce({
             track: music.track,
@@ -1860,7 +1945,14 @@ export class StreamClient {
             codecOptions: { opusStereo: true, opusDtx: false, opusFec: true, opusMaxAverageBitrate: 128_000 },
             appData: { source: 'music' },
         });
-        await this.keepProducer(producer, generation, 'music');
+        if (!current()) {
+            producer.close();
+            await this.rpc('closeProducer', { producerId: producer.id }).catch(() => undefined);
+            throw unpublishedWhile('music');
+        }
+        // Kept and named the music in one step, with no wait between: stopMusic()
+        // finds the music producer by that name.
+        this.producers.set(producer.id, producer);
         this.musicProducerId = producer.id;
         // Music switched off before a reconnect comes back paused here.
         await this.pauseOnServer(producer);
@@ -1889,8 +1981,17 @@ export class StreamClient {
         await this.rpc('pauseProducer', { producerId: producer.id, paused: !enabled });
         this.emitLocalMedia();
     }
-    /** Stop publishing music. The element or stream it came from is left as it was. */
+    /**
+     * Stop publishing music. The element or stream it came from is left as it
+     * was. A publishMusic() still under way is stopped too: it rejects with
+     * `unpublished` and publishes nothing.
+     */
     async stopMusic() {
+        this.musicOperation += 1;
+        await this.closeMusic();
+    }
+    /** Close the music being published, here and at the server. */
+    async closeMusic() {
         const id = this.musicProducerId;
         this.musicProducerId = null;
         this.music?.close();
@@ -1910,9 +2011,11 @@ export class StreamClient {
         });
     }
     async consume(remote) {
+        if (this.closedByUs)
+            return;
         if (!this.device)
             throw new RpcError('not-connected', 'not connected');
-        if (this.consumers.has(remote.producerId))
+        if (this.subscriptions.has(remote.producerId))
             return;
         // Your own camera is already local; pulling it back off the SFU wastes a
         // consumer and shows you a delayed copy of yourself.
@@ -1932,35 +2035,69 @@ export class StreamClient {
             }
             this.videoSlots.add(remote.producerId);
         }
+        const operation = {};
+        this.subscriptions.set(remote.producerId, operation);
         try {
-            await this.consumeNow(remote);
+            await this.consumeNow(remote, operation);
         }
         catch (err) {
-            if (!this.consumers.has(remote.producerId))
-                this.videoSlots.delete(remote.producerId);
+            // A closed producer or replaced session has already released its slot.
+            // Its late failure must neither release a newer slot nor report a ghost error.
+            if (this.subscriptions.get(remote.producerId) !== operation)
+                return;
+            this.subscriptions.delete(remote.producerId);
+            this.consumers.get(remote.producerId)?.close();
+            this.consumers.delete(remote.producerId);
+            this.remoteVideoLayers.delete(remote.producerId);
+            this.remoteSources.delete(remote.producerId);
+            this.remoteInfo.delete(remote.producerId);
+            this.releaseVideoSlot(remote.producerId);
             throw err;
         }
     }
+    /**
+     * Free a video slot, and let the oldest video waiting take it -- whatever
+     * freed it: an ended video, or a subscription that failed. Not while
+     * reconnecting: a failure caused by the socket dropping would otherwise
+     * start every waiting video on a dead connection, each failing with
+     * not-connected; the reconnect's join lists them all again anyway.
+     */
+    releaseVideoSlot(producerId) {
+        if (this.videoSlots.delete(producerId) && !this.closedByUs && this.state !== 'reconnecting')
+            this.consumeSkipped();
+    }
     /** The oldest videos left waiting at the fan-out limit take the slots that opened. */
-    async consumeSkipped() {
+    consumeSkipped() {
         for (const [producerId, remote] of this.skippedVideos) {
             const limit = this.mediaPermissions.maxVideoSubscriptions;
             if (limit !== null && this.videoSlots.size >= limit)
                 return;
             this.skippedVideos.delete(producerId);
-            await this.consume(remote);
+            // consume reserves synchronously, before its first await. Consecutive
+            // releases cannot admit the same producer or exceed the limit.
+            void this.consume(remote).catch((err) => this.emit('error', err));
         }
     }
-    async consumeNow(remote) {
+    async consumeNow(remote, operation) {
         if (!this.device)
             throw new RpcError('not-connected', 'not connected');
+        const device = this.device;
+        const current = (made) => {
+            if (!this.closedByUs && this.subscriptions.get(remote.producerId) === operation)
+                return;
+            made?.close();
+            throw new RpcError('not-connected', 'subscription ended during setup');
+        };
         const transport = await this.ensureRecvTransport();
+        current();
         const params = (await this.rpc('consume', {
             transportId: transport.id,
             producerId: remote.producerId,
-            rtpCapabilities: this.device.rtpCapabilities,
+            rtpCapabilities: device.rtpCapabilities,
         }));
+        current();
         const consumer = await transport.consume(params);
+        current(consumer);
         this.consumers.set(remote.producerId, consumer);
         this.remoteVideoLayers.set(remote.producerId, remote.videoLayers ?? remote.appData?.videoLayers ?? params.videoLayers ?? []);
         // Layers asked for before a reconnect: the new consumer gets them before
@@ -1980,9 +2117,11 @@ export class StreamClient {
         if (layers) {
             await this.rpc('setPreferredLayers', { consumerId: consumer.id, ...layers }).catch((err) => this.emit('error', err));
         }
+        current(consumer);
         // The server created it paused. Resume only now that our end exists,
         // otherwise the first frames arrive before there is anything to decode them.
         await this.rpc('resumeConsumer', { consumerId: consumer.id });
+        current(consumer);
         const kind = consumer.kind;
         const source = remote.source ?? defaultSource(kind);
         this.remoteSources.set(remote.producerId, source);