feat tracker: socket only mode (EE) (#2216)

* feat tracker: socket only mode

* fix ui: hide timeline for live sessions if socket only

* feat tracker: socket mode sync with backend, add flag onstart

* feat tracker: keep socket mode

frontend/app/components/Session/Player/LivePlayer/LiveControls.tsx

@@ -94,7 +94,7 @@ function Controls(props: any) {
 
   return (
     <div className={styles.controls}>
-      <Timeline />
+      {session.liveOnly ? null : <Timeline />}
       {!noControls ?
         <div className={cn(styles.buttons, '!px-5 !pt-0')} data-is-live style={{ height: noGrid ? '40px' : ''}}>
           <div className="flex items-center">

frontend/app/player/web/managers/DOM/DOMManager.ts

@@ -118,7 +118,8 @@ export default class DOMManager extends ListWalker<Message> {
     return this.vElements.get(id) || this.vTexts.get(id)
   }
 
-  private insertNode({ parentID, id, index }: { parentID: number, id: number, index: number }): void {
+  private insertNode(msg: { parentID: number, id: number, index: number }): void {
+    const { parentID, id, index } = msg
     const child = this.vElements.get(id) || this.vTexts.get(id)
     if (!child) {
       logger.error("Insert error. Node not found", id);
@@ -126,7 +127,7 @@ export default class DOMManager extends ListWalker<Message> {
     }
     const parent = this.vElements.get(parentID) || this.olVRoots.get(parentID)
     if (!parent) {
-      logger.error(`${id} Insert error. Parent vNode ${parentID} not found`, this.vElements, this.olVRoots);
+      logger.error(`${id} Insert error. Parent vNode ${parentID} not found`, msg, this.vElements, this.olVRoots);
       return;
     }
 

frontend/app/types/session/session.ts

@@ -226,6 +226,7 @@ export default class Session {
 
   fileKey: ISession['fileKey'];
   durationSeconds: number;
+  liveOnly: boolean;
 
   constructor(plainSession?: ISession) {
     const sessionData = plainSession || (emptyValues as unknown as ISession);
@@ -346,6 +347,7 @@ export default class Session {
       uxtVideo: uxtVideo[0],
       durationMs: session.duration,
       audio: session.audio,
+      liveOnly: true,
     });
   }
 

tracker/tracker/CHANGELOG.md

@@ -1,3 +1,7 @@
+# 13.0.0
+
+- `assistOnly` flag for tracker options (EE only feature)
+
 # 12.0.12
 
 - fix for potential redux plugin issues after .11 ...

tracker/tracker/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@openreplay/tracker",
   "description": "The OpenReplay tracker main package",
-  "version": "12.0.13-0",
+  "version": "12.0.13-2",
   "keywords": [
     "logging",
     "replay"

tracker/tracker/src/main/app/index.ts

@@ -52,6 +52,7 @@ export interface StartOptions {
   metadata?: Record<string, string>
   forceNew?: boolean
   sessionHash?: string
+  assistOnly?: boolean
 }
 
 interface OnStartInfo {
@@ -183,6 +184,7 @@ export default class App {
   private conditionsManager: ConditionsManager | null = null
   public featureFlags: FeatureFlags
   private tagWatcher: TagWatcher
+  private socketMode = false
 
   constructor(
     projectKey: string,
@@ -215,6 +217,7 @@ export default class App {
         assistSocketHost: '',
         fixedCanvasScaling: false,
         disableCanvas: false,
+        assistOnly: false,
       },
       options,
     )
@@ -410,6 +413,13 @@ export default class App {
    * every ~30ms
    * */
   private _nCommit(): void {
+    if (this.socketMode) {
+      this.messages.unshift(TabData(this.session.getTabId()))
+      this.messages.unshift(Timestamp(this.timestamp()))
+      this.commitCallbacks.forEach((cb) => cb(this.messages))
+      this.messages.length = 0
+      return
+    }
     if (this.worker !== undefined && this.messages.length) {
       try {
         requestIdleCb(() => {
@@ -969,6 +979,7 @@ export default class App {
           jsHeapSizeLimit,
           timezone: getTimezone(),
           condition: conditionName,
+          assistOnly: startOpts.assistOnly ?? this.socketMode,
         }),
       })
       .then((r) => {
@@ -1013,6 +1024,7 @@ export default class App {
           canvasEnabled,
           canvasQuality,
           canvasFPS,
+          assistOnly: socketOnly,
         } = r
         if (
           typeof token !== 'string' ||
@@ -1042,11 +1054,16 @@ export default class App {
           projectID,
         })
 
-        this.worker.postMessage({
-          type: 'auth',
-          token,
-          beaconSizeLimit,
-        })
+        if (socketOnly) {
+          this.socketMode = true
+          this.worker.postMessage('stop')
+        } else {
+          this.worker.postMessage({
+            type: 'auth',
+            token,
+            beaconSizeLimit,
+          })
+        }
 
         if (!isNewSession && token === sessionToken) {
           this.debug.log('continuing session on new tab', this.session.getTabId())