[REPLAY] Fix serialization for checkbox & radio

DataDog · Feb 17, 2023 · 157f74f · 157f74f
1 parent a483e80
commit 157f74f
Show file tree

Hide file tree

Showing 3 changed files with 61 additions and 5 deletions.
diff --git a/packages/rum/src/domain/record/serialize.spec.ts b/packages/rum/src/domain/record/serialize.spec.ts
@@ -359,6 +359,66 @@ describe('serializeNodeWithId', () => {
       )
     })
 
+    it('serializes <input type="radio"> elements checked state', () => {
+      const radio = document.createElement('input')
+      radio.type = 'radio'
+      expect(serializeNodeWithId(radio, DEFAULT_OPTIONS)! as ElementNode).toEqual(
+        jasmine.objectContaining({
+          attributes: {
+            type: 'radio',
+            value: 'on',
+            checked: false,
+          },
+        })
+      )
+
+      radio.checked = true
+
+      expect(serializeNodeWithId(radio, DEFAULT_OPTIONS)! as ElementNode).toEqual(
+        jasmine.objectContaining({
+          attributes: {
+            type: 'radio',
+            value: 'on',
+            checked: true,
+          },
+        })
+      )
+    })
+
+    it('serializes <input type="radio"> elements checked state with mask serialization', () => {
+      const radio = document.createElement('input')
+      radio.type = 'radio'
+      expect(
+        serializeNodeWithId(radio, {
+          ...DEFAULT_OPTIONS,
+          parentNodePrivacyLevel: NodePrivacyLevel.MASK_USER_INPUT,
+        })! as ElementNode
+      ).toEqual(
+        jasmine.objectContaining({
+          attributes: {
+            type: 'radio',
+            value: '***',
+          },
+        })
+      )
+
+      radio.checked = true
+
+      expect(
+        serializeNodeWithId(radio, {
+          ...DEFAULT_OPTIONS,
+          parentNodePrivacyLevel: NodePrivacyLevel.MASK_USER_INPUT,
+        })! as ElementNode
+      ).toEqual(
+        jasmine.objectContaining({
+          attributes: {
+            type: 'radio',
+            value: '***',
+          },
+        })
+      )
+    })
+
     it('serializes <audio> elements paused state', () => {
       const audio = document.createElement('audio')
 

diff --git a/packages/rum/src/domain/record/serialize.ts b/packages/rum/src/domain/record/serialize.ts
@@ -460,7 +460,7 @@ function getAttributesForPrivacyLevel(
     if (nodePrivacyLevel === NodePrivacyLevel.ALLOW) {
       safeAttrs.checked = !!inputElement.checked
     } else if (shouldMaskNode(inputElement, nodePrivacyLevel)) {
-      safeAttrs.checked = CENSORED_STRING_MARK
+      delete safeAttrs.checked
     }
   }
 

diff --git a/packages/rum/test/htmlAst.ts b/packages/rum/test/htmlAst.ts
@@ -340,7 +340,6 @@ export const AST_MASK = {
                 type: 'checkbox',
                 name: 'inputFoo',
                 value: '***',
-                checked: '***',
               },
               childNodes: [],
             },
@@ -372,7 +371,6 @@ export const AST_MASK = {
                 type: 'radio',
                 name: 'radioGroup',
                 value: '***',
-                checked: '***',
               },
               childNodes: [],
             },
@@ -655,7 +653,6 @@ export const AST_MASK_USER_INPUT = {
                 type: 'checkbox',
                 name: 'inputFoo',
                 value: '***',
-                checked: '***',
               },
               childNodes: [],
             },
@@ -687,7 +684,6 @@ export const AST_MASK_USER_INPUT = {
                 type: 'radio',
                 name: 'radioGroup',
                 value: '***',
-                checked: '***',
               },
               childNodes: [],
             },