Merge pull request #1611 from vector-im/dbkr/depthlimit

Re-enable livekit rageshake logging & with depth limit

src/livekit/useLiveKit.ts

@@ -20,7 +20,6 @@ import {
   ExternalE2EEKeyProvider,
   Room,
   RoomOptions,
-  setLogLevel,
 } from "livekit-client";
 import { useLiveKitRoom } from "@livekit/components-react";
 import { useEffect, useMemo, useRef, useState } from "react";
@@ -44,8 +43,6 @@ export type E2EEConfig = {
   sharedKey: string;
 };
 
-setLogLevel("debug");
-
 interface UseLivekitResult {
   livekitRoom?: Room;
   connState: ECConnectionState;

src/main.tsx

@@ -25,12 +25,18 @@ import { createRoot } from "react-dom/client";
 import { createBrowserHistory } from "history";
 import "./index.css";
 import { logger } from "matrix-js-sdk/src/logger";
+import {
+  setLogExtension as setLKLogExtension,
+  setLogLevel,
+} from "livekit-client";
 
 import App from "./App";
 import { init as initRageshake } from "./settings/rageshake";
 import { Initializer } from "./initializer";
 
 initRageshake();
+setLogLevel("debug");
+setLKLogExtension(global.mx_rage_logger.log);
 
 logger.info(`Element Call ${import.meta.env.VITE_APP_VERSION || "dev"}`);
 

src/settings/rageshake.ts

@@ -50,6 +50,9 @@ const MAX_LOG_SIZE = 1024 * 1024 * 5; // 5 MB
 // we can batch the writes a little.
 const MAX_FLUSH_INTERVAL_MS = 2 * 1000;
 
+// only descend this far into nested object trees
+const DEPTH_LIMIT = 3;
+
 enum ConsoleLoggerEvent {
   Log = "log",
 }
@@ -67,7 +70,7 @@ class ConsoleLogger extends EventEmitter {
 
   public log = (
     level: LogLevel,
-    ...args: (Error | DOMException | object | string)[]
+    ...args: (Error | DOMException | object | string | undefined)[]
   ): void => {
     // We don't know what locale the user may be running so use ISO strings
     const ts = new Date().toISOString();
@@ -550,12 +553,21 @@ type StringifyReplacer = (
 // Injects `<$ cycle-trimmed $>` wherever it cuts a cyclical object relationship
 const getCircularReplacer = (): StringifyReplacer => {
   const seen = new WeakSet();
-  return (key: string, value: unknown): unknown => {
+  const depthMap = new WeakMap<object, number>();
+  return function (this: unknown, key: string, value: unknown): unknown {
     if (typeof value === "object" && value !== null) {
       if (seen.has(value)) {
         return "<$ cycle-trimmed $>";
       }
       seen.add(value);
+
+      let depth = 0;
+      if (this) {
+        depth = depthMap.get(this) ?? 0;
+      }
+      depthMap.set(value, depth + 1);
+
+      if (depth > DEPTH_LIMIT) return "<$ object-pruned $>";
     }
     return value;
   };