🐛 [REPLAY-312] use unpatched MutationObserver object (#866)

DataDog · May 27, 2021 · 468d3d4 · 468d3d4
1 parent 4b7f047
commit 468d3d4
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 3 deletions.
diff --git a/packages/rum-core/src/browser/domMutationCollection.ts b/packages/rum-core/src/browser/domMutationCollection.ts
@@ -10,11 +10,11 @@ interface BrowserWindow extends Window {
   }
 }
 
-function getMutationObserverConstructor(): MutationObserverConstructor | undefined {
+export function getMutationObserverConstructor(): MutationObserverConstructor | undefined {
   let constructor: MutationObserverConstructor | undefined
   const browserWindow: BrowserWindow = window
 
-  // Angular uses Zone.js to provide a context persisting accross async tasks.  Zone.js replaces the
+  // Angular uses Zone.js to provide a context persisting across async tasks.  Zone.js replaces the
   // global MutationObserver constructor with a patched version to support the context propagation.
   // There is an ongoing issue[1][2] with this setup when using a MutationObserver within a Angular
   // component: on some occasions, the callback is being called in an infinite loop, causing the

diff --git a/packages/rum-core/src/index.ts b/packages/rum-core/src/index.ts
@@ -14,3 +14,4 @@ export { startRum } from './boot/rum'
 export { LifeCycle, LifeCycleEventType } from './domain/lifeCycle'
 export { ParentContexts } from './domain/parentContexts'
 export { RumSession } from './domain/rumSession'
+export { getMutationObserverConstructor } from './browser/domMutationCollection'
diff --git a/packages/rum-recorder/src/domain/record/mutationObserver.ts b/packages/rum-recorder/src/domain/record/mutationObserver.ts
@@ -1,4 +1,5 @@
-import { monitor } from '@datadog/browser-core'
+import { monitor, noop } from '@datadog/browser-core'
+import { getMutationObserverConstructor } from '@datadog/browser-rum-core'
 import { getNodeOrAncestorsInputPrivacyMode, nodeOrAncestorsShouldBeHidden } from './privacy'
 import {
   getElementInputValue,
@@ -29,6 +30,10 @@ type WithSerializedTarget<T> = T & { target: NodeWithSerializedNode }
  * Buffers and aggregate mutations generated by a MutationObserver into MutationPayload
  */
 export function startMutationObserver(controller: MutationController, mutationCallback: MutationCallBack) {
+  const MutationObserver = getMutationObserverConstructor()
+  if (!MutationObserver) {
+    return { stop: noop }
+  }
   const mutationBatch = createMutationBatch((mutations) => {
     processMutations(mutations.concat(observer.takeRecords() as RumMutationRecord[]), mutationCallback)
   })