From 2e37a9e1312b2917d6a5f9986da990006b6929c1 Mon Sep 17 00:00:00 2001
From: Simon Knott <info@simonknott.de>
Date: Mon, 16 Sep 2024 17:57:06 +0200
Subject: [PATCH] move into recorder

---
 .../playwright-core/src/server/injected/highlight.ts   | 10 ++--------
 .../src/server/injected/recorder/recorder.ts           |  6 ++++++
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/packages/playwright-core/src/server/injected/highlight.ts b/packages/playwright-core/src/server/injected/highlight.ts
index 79817b96bd..c89df54a6f 100644
--- a/packages/playwright-core/src/server/injected/highlight.ts
+++ b/packages/playwright-core/src/server/injected/highlight.ts
@@ -42,7 +42,6 @@ export type HighlightOptions = {
 export class Highlight {
   private _glassPaneElement: HTMLElement;
   private _glassPaneShadow: ShadowRoot;
-  private _glassPaneInterval?: NodeJS.Timeout;
   private _highlightEntries: HighlightEntry[] = [];
   private _highlightOptions: HighlightOptions = {};
   private _actionPointElement: HTMLElement;
@@ -91,12 +90,8 @@ export class Highlight {
   }
 
   install() {
-    this._injectedScript.document.documentElement.appendChild(this._glassPaneElement);
-
-    this._glassPaneInterval = setInterval(() => {
-      if (!this._injectedScript.document.documentElement.contains(this._glassPaneElement))
-        this._injectedScript.document.documentElement.appendChild(this._glassPaneElement);
-    }, 500);
+    if (!this._injectedScript.document.documentElement.contains(this._glassPaneElement))
+      this._injectedScript.document.documentElement.appendChild(this._glassPaneElement);
   }
 
   setLanguage(language: Language) {
@@ -113,7 +108,6 @@ export class Highlight {
   uninstall() {
     if (this._rafRequest)
       cancelAnimationFrame(this._rafRequest);
-    clearInterval(this._glassPaneInterval);
     this._glassPaneElement.remove();
   }
 
diff --git a/packages/playwright-core/src/server/injected/recorder/recorder.ts b/packages/playwright-core/src/server/injected/recorder/recorder.ts
index 48639fefc8..351bcd2a65 100644
--- a/packages/playwright-core/src/server/injected/recorder/recorder.ts
+++ b/packages/playwright-core/src/server/injected/recorder/recorder.ts
@@ -1036,7 +1036,13 @@ export class Recorder {
       addEventListener(this.document, 'focus', event => this._onFocus(event), true),
       addEventListener(this.document, 'scroll', event => this._onScroll(event), true),
     ];
+
     this.highlight.install();
+    const recreationInterval = setInterval(() => {
+      this.highlight.install();
+    }, 500);
+    this._listeners.push(() => clearInterval(recreationInterval));
+
     this.overlay?.install();
     this.document.adoptedStyleSheets.push(this._stylesheet);
   }