🐛 ignore contenteditable elements for dead clicks

DataDog · Jan 30, 2023 · 8356e60 · 8356e60
1 parent 5ad73a0
commit 8356e60
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 3 deletions.
diff --git a/packages/rum-core/src/domain/rumEventsCollection/action/computeFrustration.spec.ts b/packages/rum-core/src/domain/rumEventsCollection/action/computeFrustration.spec.ts
@@ -1,4 +1,4 @@
-import { ONE_SECOND } from '@datadog/browser-core'
+import { ONE_SECOND, resetExperimentalFeatures, updateExperimentalFeatures } from '@datadog/browser-core'
 import { FrustrationType } from '../../../rawRumEvent.types'
 import type { Clock } from '../../../../../core/test/specHelper'
 import { mockClock } from '../../../../../core/test/specHelper'
@@ -137,10 +137,12 @@ describe('isDead', () => {
 
   beforeEach(() => {
     isolatedDom = createIsolatedDom()
+    updateExperimentalFeatures(['dead_click_fixes'])
   })
 
   afterEach(() => {
     isolatedDom.clear()
+    resetExperimentalFeatures()
   })
 
   it('considers as dead when the click has no page activity', () => {
@@ -164,6 +166,8 @@ describe('isDead', () => {
     { element: '<a id="foo">Foo</a>', expected: true },
     { element: '<a href="foo">Foo</a>', expected: false },
     { element: '<a href="foo">Foo<span target>bar</span></a>', expected: false },
+    { element: '<div contenteditable>Foo bar</div>', expected: false },
+    { element: '<div contenteditable>Foo<span target>bar</span></div>', expected: false },
   ]) {
     it(`does not consider as dead when the click target is ${element}`, () => {
       expect(

diff --git a/packages/rum-core/src/domain/rumEventsCollection/action/computeFrustration.ts b/packages/rum-core/src/domain/rumEventsCollection/action/computeFrustration.ts
@@ -1,4 +1,4 @@
-import { elementMatches, ONE_SECOND } from '@datadog/browser-core'
+import { elementMatches, isExperimentalFeatureEnabled, ONE_SECOND } from '@datadog/browser-core'
 import { FrustrationType } from '../../../rawRumEvent.types'
 import type { Click } from './trackClickActions'
 
@@ -64,5 +64,11 @@ export function isDead(click: Click) {
   if (click.hasPageActivity || click.getUserActivity().input) {
     return false
   }
-  return !elementMatches(click.event.target, DEAD_CLICK_EXCLUDE_SELECTOR)
+  return !elementMatches(
+    click.event.target,
+    isExperimentalFeatureEnabled('dead_click_fixes')
+      ? // contenteditable and their descendants don't always trigger meaningful changes when manipulated
+        `${DEAD_CLICK_EXCLUDE_SELECTOR},[contenteditable],[contenteditable] *`
+      : DEAD_CLICK_EXCLUDE_SELECTOR
+  )
 }