fix duplicate shadow doms in the recorder (#1002)

* fix: some shadow doms are observed multiple times and cause duplicate elements in the replayer

* fix: in the live mode, the page https://bugs.chromium.org/p/chromium/issues/detail?id=1352333 has duplicate shadow doms in the replayer
This commit is contained in:
Yun Feng
2022-09-17 14:41:44 +10:00
committed by GitHub
parent 60072666d7
commit 96b7466465
2 changed files with 7 additions and 0 deletions

View File

@@ -227,6 +227,9 @@ void (async () => {
'window.__IS_RECORDING__', 'window.__IS_RECORDING__',
); );
if (!isRecording) { if (!isRecording) {
// When the page navigates, I notice this event is emitted twice so that there are two recording processes running in a single page.
// Set recording flag True ASAP to prevent recording twice.
await recordedPage.evaluate('window.__IS_RECORDING__ = true');
await startRecording(recordedPage, serverURL); await startRecording(recordedPage, serverURL);
} }
}); });

View File

@@ -17,6 +17,7 @@ type BypassOptions = Omit<
}; };
export class ShadowDomManager { export class ShadowDomManager {
private shadowDoms = new WeakSet<ShadowRoot>();
private mutationCb: mutationCallBack; private mutationCb: mutationCallBack;
private scrollCb: scrollCallback; private scrollCb: scrollCallback;
private bypassOptions: BypassOptions; private bypassOptions: BypassOptions;
@@ -55,6 +56,8 @@ export class ShadowDomManager {
public addShadowRoot(shadowRoot: ShadowRoot, doc: Document) { public addShadowRoot(shadowRoot: ShadowRoot, doc: Document) {
if (!isNativeShadowDom(shadowRoot)) return; if (!isNativeShadowDom(shadowRoot)) return;
if (this.shadowDoms.has(shadowRoot)) return;
this.shadowDoms.add(shadowRoot);
initMutationObserver( initMutationObserver(
{ {
...this.bypassOptions, ...this.bypassOptions,
@@ -106,5 +109,6 @@ export class ShadowDomManager {
public reset() { public reset() {
this.restorePatches.forEach((restorePatch) => restorePatch()); this.restorePatches.forEach((restorePatch) => restorePatch());
this.shadowDoms = new WeakSet();
} }
} }