@rtcstats/rtcstats-js 2.3.0 → 2.5.0

package/README.md

@@ -9,6 +9,26 @@ an Experience Score, and a plain-English AI summary of what went wrong on the ca
 For a complete reference of every getStats() metric rtcstats collects and analyzes, see
 the [WebRTC Stats Reference](https://rtcstats.com/kb/webrtc-stats-reference-page).
 
+## Why rtcStats is built this way
+
+rtcStats keeps collecting session data, storing it, and analyzing it separate. The
+first two are open source and run in your stack. The third is optional and yours to
+trigger.
+
+- **Collection is a client SDK you control.** `rtcstats-js` runs in your client and
+  streams a dump of what WebRTC is doing to a server you run.
+- **Storage runs on your infrastructure.** `rtcstats-server` receives the stream and
+  writes each dump to your own storage. Session data lands and lives in your stack.
+- **Analysis is the layer you opt into.** You choose which stored dumps to send to
+  rtcstats.com: a random sample, per-user, per-region, a single dump when one call
+  goes bad, or none at all. rtcstats.com returns Observations, an Experience Score,
+  and a plain-English summary of what went wrong. It is the layer above
+  `webrtc-internals`, not a replacement for it.
+
+Send what you want, keep the rest.
+
+Start at https://rtcstats.com
+
 # rtcstats-js: A Javascript client SDK for monitoring WebRTC
 
 The Javascript SDK provides low-level logging on peerconnection API calls and periodic getStats calls for analytics/debugging purposes.
@@ -28,6 +48,7 @@ The main rtcstats.js exports a number of methods that facilitate this:
   object and generates traces using the supplied `trace` method.
 * `wrapGetUserMedia` and `wrapEnumerateDevices` do the same for the `getUserMedia`/`getDisplayMedia`,
   `enumerateDevices` and related APIs such as MediaStreamTracks and HTMLVideoElement.
+* `wrapSetSinkId` does the same for HTMLMediaElement's `setSinkId` method which changes the audio output device.
 
 Typical usage looks like this:
 ```

package/media.js

@@ -132,3 +132,30 @@ export function wrapEnumerateDevices(trace, {navigator}) {
     }
 }
 
+/**
+ * Wraps HTMLMediaElement.setSinkId for RTCStats.
+ *
+ * @param {function} trace - RTCStats trace callback.
+ * @param {object} window - window object with HTMLMediaElement.
+ */
+export function wrapSetSinkId(trace, {HTMLMediaElement}) {
+    if (!(HTMLMediaElement && HTMLMediaElement.prototype.setSinkId)) {
+        return;
+    }
+    if (HTMLMediaElement.prototype.setSinkId.__rtcStats) {
+        // Prevent double-wrapping.
+        return;
+    }
+    const origMethod = HTMLMediaElement.prototype.setSinkId;
+    const wrappedMethod = function(...args) {
+        trace('HTMLMediaElement.setSinkId', null, args[0]);
+        return origMethod.apply(this, args)
+            .then((result) => result, (err) => {
+                trace('HTMLMediaElement.setSinkIdOnFailure', null, err.toString(), args[0]);
+                return Promise.reject(err);
+            });
+    };
+    wrappedMethod.__rtcStats = true;
+    HTMLMediaElement.prototype.setSinkId = wrappedMethod;
+}
+

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rtcstats/rtcstats-js",
-  "version": "2.3.0",
+  "version": "2.5.0",
   "description": "gather WebRTC API traces and statistics",
   "main": "rtcstats.js",
   "type": "module",

package/peerconnection.js

@@ -92,8 +92,7 @@ export function wrapRTCPeerConnection(trace, window, {getStatsInterval}) {
     let lastComputePressureRecord;
     if (window.PressureObserver && getStatsInterval) {
         const observer = new window.PressureObserver((records) => {
-            const lastRecord = records[records.length - 1]; // Usually only one record.
-            lastComputePressureRecord = [Date.now(), lastRecord];
+            lastComputePressureRecord = records[records.length - 1]; // Usually only one record.
         });
         observer.observe('cpu', {sampleInterval: getStatsInterval});
     }
@@ -148,11 +147,6 @@ export function wrapRTCPeerConnection(trace, window, {getStatsInterval}) {
             e.track.addEventListener('mute', () => {
                 trace('MediaStreamTrack.onmute', pcId, e.track.id);
             });
-            if (e.transceiver) {
-                e.transceiver.__rtcStatsId = pcId;
-                e.transceiver.sender.__rtcStatsId = pcId;
-                e.transceiver.sender.__rtcStatsSenderId = e.track.id;
-            }
             if (e.track.kind === 'video' && window.document?.querySelectorAll) {
                 setTimeout(() => {
                     window.document.querySelectorAll('video').forEach(el => {
@@ -199,10 +193,10 @@ export function wrapRTCPeerConnection(trace, window, {getStatsInterval}) {
                 return;
             }
             if (lastComputePressureRecord) {
-                const [timestamp, record] = lastComputePressureRecord;
+                const record = lastComputePressureRecord;
                 stats['rtcStatsComputePressure'] = {
                     type: 'compute-pressure',
-                    timestamp,
+                    timestamp: window.performance.timeOrigin + record.time,
                     cpuState: computePressureTable[record.state] || record.state,
                 };
             }
@@ -376,6 +370,11 @@ export function wrapRTCPeerConnection(trace, window, {getStatsInterval}) {
 
             return nativeMethod.apply(this, [description, ...args])
                 .then(() => {
+                    this.getTransceivers().forEach((transceiver) => {
+                        transceiver.__rtcStatsId = this.__rtcStatsId;
+                        transceiver.sender.__rtcStatsId = this.__rtcStatsId;
+                        transceiver.sender.__rtcStatsSenderId = transceiver.receiver.track.id;
+                    });
                     trace(method + 'OnSuccess', this.__rtcStatsId, undefined,
                         trackingId);
                 }, (err) => {

package/rtcstats.js

@@ -1,5 +1,5 @@
 import {wrapRTCPeerConnection} from './peerconnection.js';
-import {wrapGetUserMedia, wrapEnumerateDevices} from './media.js';
+import {wrapGetUserMedia, wrapEnumerateDevices, wrapSetSinkId} from './media.js';
 import {WebSocketTrace} from './trace-websocket.js';
 
 /**
@@ -16,6 +16,8 @@ export function wrapRTCStatsWithDefaultOptions(config = {getStatsInterval: 1000}
     wrapGetUserMedia(trace, target);
     // Wrap enumerateDevices.
     wrapEnumerateDevices(trace, target);
+    // Wrap HTMLMediaElement.setSinkId.
+    wrapSetSinkId(trace, target);
 
     return trace;
 }
@@ -24,5 +26,6 @@ export {
     wrapRTCPeerConnection,
     wrapGetUserMedia,
     wrapEnumerateDevices,
+    wrapSetSinkId,
     WebSocketTrace,
 };

package/trace-websocket.js

@@ -44,7 +44,6 @@ export function WebSocketTrace(config = {}) {
             buffer.push(args);
         }
     };
-
     trace.close = () => {
         if (window.sessionStorage && config.countReloads) {
             // A clean disconnect clears the reload count.
@@ -67,6 +66,7 @@ export function WebSocketTrace(config = {}) {
             hardwareConcurrency: navigator.hardwareConcurrency,
             userAgentData: navigator.userAgentData,
             deviceMemory: navigator.deviceMemory,
+            cpuPerformance: navigator.cpuPerformance,
             screen: {
                 width: window.screen?.availWidth,
                 height: window.screen?.availHeight,