From 25e98de6e2c0300b962a6e2ed74191308eb66a38 Mon Sep 17 00:00:00 2001
From: nick-delirium <nikita@openreplay.com>
Date: Fri, 30 May 2025 10:59:22 +0200
Subject: [PATCH] tracker: optimize tag watcher intervals

---
 .../svg/icons/{play-v2.svg => play-new.svg}   |  0
 tracker/tracker/package.json                  |  2 +-
 .../tracker/src/main/modules/tagWatcher.ts    | 27 ++++++++++---------
 tracker/tracker/src/tests/tagWatcher.test.ts  | 10 +++----
 4 files changed, 20 insertions(+), 19 deletions(-)
 rename frontend/app/svg/icons/{play-v2.svg => play-new.svg} (100%)

diff --git a/frontend/app/svg/icons/play-v2.svg b/frontend/app/svg/icons/play-new.svg
similarity index 100%
rename from frontend/app/svg/icons/play-v2.svg
rename to frontend/app/svg/icons/play-new.svg
diff --git a/tracker/tracker/package.json b/tracker/tracker/package.json
index 6487154fe..5ed723567 100644
--- a/tracker/tracker/package.json
+++ b/tracker/tracker/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@openreplay/tracker",
   "description": "The OpenReplay tracker main package",
-  "version": "17.0.0",
+  "version": "17.0.0-beta.0",
   "keywords": [
     "logging",
     "replay"
diff --git a/tracker/tracker/src/main/modules/tagWatcher.ts b/tracker/tracker/src/main/modules/tagWatcher.ts
index 4899c2073..4608f0b1e 100644
--- a/tracker/tracker/src/main/modules/tagWatcher.ts
+++ b/tracker/tracker/src/main/modules/tagWatcher.ts
@@ -1,7 +1,7 @@
 export const WATCHED_TAGS_KEY = '__or__watched_tags__'
 
 class TagWatcher {
-  intervals: Record<string, ReturnType<typeof setInterval>> = {}
+  interval: ReturnType<typeof setInterval> | null = null
   tags: { id: number; selector: string }[] = []
   observer: IntersectionObserver
   private readonly sessionStorage: Storage
@@ -57,9 +57,12 @@ class TagWatcher {
 
   setTags(tags: { id: number; selector: string }[]) {
     this.tags = tags
-    this.intervals = {}
-    tags.forEach((tag) => {
-      this.intervals[tag.id] = setInterval(() => {
+    if (this.interval) {
+      clearInterval(this.interval)
+      this.interval = null
+    }
+    this.interval = setInterval(() => {
+      this.tags.forEach((tag) => {
         const possibleEls = document.querySelectorAll(tag.selector)
         if (possibleEls.length > 0) {
           const el = possibleEls[0]
@@ -67,23 +70,23 @@ class TagWatcher {
           el.__or_watcher_tagname = tag.id
           this.observer.observe(el)
         }
-      }, 500)
-    })
+      })
+    }, 500)
   }
 
   onTagRendered(tagId: number) {
-    if (this.intervals[tagId]) {
-      clearInterval(this.intervals[tagId])
+    if (this.tags.findIndex(t => t.id === tagId)) {
+      this.tags = this.tags.filter((tag) => tag.id !== tagId)
     }
     this.onTag(tagId)
   }
 
   clear() {
-    this.tags.forEach((tag) => {
-      clearInterval(this.intervals[tag.id])
-    })
     this.tags = []
-    this.intervals = {}
+    if (this.interval) {
+      clearInterval(this.interval)
+      this.interval = null
+    }
     this.observer.disconnect()
   }
 }
diff --git a/tracker/tracker/src/tests/tagWatcher.test.ts b/tracker/tracker/src/tests/tagWatcher.test.ts
index 35491a9d2..a9f2c564b 100644
--- a/tracker/tracker/src/tests/tagWatcher.test.ts
+++ b/tracker/tracker/src/tests/tagWatcher.test.ts
@@ -52,8 +52,7 @@ describe('TagWatcher', () => {
       { id: 1, selector: 'div' },
       { id: 2, selector: 'span' },
     ])
-    expect(watcher.intervals).toHaveProperty('1')
-    expect(watcher.intervals).toHaveProperty('2')
+    expect(watcher.interval).not.toBeNull()
   })
 
   test('fetchTags sets tags and updates sessionStorage', async () => {
@@ -85,7 +84,7 @@ describe('TagWatcher', () => {
     )
   })
 
-  test('setTags sets intervals for each tag', () => {
+  test('setTags sets interval', () => {
     const watcher = new TagWatcher({
       sessionStorage: sessionStorageMock, errLog: errLogMock, onTag
     })
@@ -93,8 +92,7 @@ describe('TagWatcher', () => {
       { id: 1, selector: 'div' },
       { id: 2, selector: 'p' },
     ])
-    expect(watcher.intervals).toHaveProperty('1')
-    expect(watcher.intervals).toHaveProperty('2')
+    expect(watcher.interval).not.toBeNull();
     expect(mockObserve).not.toHaveBeenCalled() // No elements to observe initially
   })
 
@@ -121,7 +119,7 @@ describe('TagWatcher', () => {
     ])
     watcher.clear()
     expect(watcher.tags).toEqual([])
-    expect(watcher.intervals).toEqual({})
+    expect(watcher.interval).toBeNull()
     expect(watcher.observer.disconnect).toHaveBeenCalled()
   })
 })