♻️ [PANA-5982] Make the serialization code more configurable and testable

packages/rum/src/domain/record/assembly.ts

@@ -1,17 +1,19 @@
+import type { TimeStamp } from '@datadog/browser-core'
 import { timeStampNow } from '@datadog/browser-core'
 import type { BrowserIncrementalData, BrowserIncrementalSnapshotRecord } from '../../types'
 import { RecordType } from '../../types'
 
 export function assembleIncrementalSnapshot<Data extends BrowserIncrementalData>(
   source: Data['source'],
-  data: Omit<Data, 'source'>
+  data: Omit<Data, 'source'>,
+  timestamp: TimeStamp = timeStampNow()
 ): BrowserIncrementalSnapshotRecord {
   return {
     data: {
       source,
       ...data,
     } as Data,
     type: RecordType.IncrementalSnapshot,
-    timestamp: timeStampNow(),
+    timestamp,
   }
 }

packages/rum/src/domain/record/index.ts

@@ -2,6 +2,6 @@ export { takeFullSnapshot, takeNodeSnapshot } from './internalApi'
 export { record } from './record'
 export type { SerializationMetric, SerializationStats } from './serialization'
 export { createSerializationStats, aggregateSerializationStats } from './serialization'
-export { serializeNode, serializeDocument } from './serialization'
+export { serializeNode } from './serialization'
 export { createElementsScrollPositions } from './elementsScrollPositions'
 export type { ShadowRootsController } from './shadowRootsController'

packages/rum/src/domain/record/serialization/index.ts

@@ -1,6 +1,8 @@
 export { createRootInsertionCursor } from './insertionCursor'
 export { getElementInputValue } from './serializationUtils'
-export { serializeDocument } from './serializeDocument'
+export { serializeFullSnapshot } from './serializeFullSnapshot'
+export { serializeFullSnapshotAsChange } from './serializeFullSnapshotAsChange'
+export { serializeMutations } from './serializeMutations'
 export { serializeNode } from './serializeNode'
 export { serializeNodeAsChange } from './serializeNodeAsChange'
 export { serializeAttribute } from './serializeAttribute'

packages/rum/src/domain/record/serialization/serializeFullSnapshot.ts

@@ -0,0 +1,38 @@
+import { getScrollX, getScrollY } from '@datadog/browser-rum-core'
+import type { TimeStamp } from '@datadog/browser-core'
+import type { BrowserFullSnapshotRecord } from '../../../types'
+import { RecordType } from '../../../types'
+import type { EmitRecordCallback, EmitStatsCallback } from '../record.types'
+import type { RecordingScope } from '../recordingScope'
+import { serializeNode } from './serializeNode'
+import { serializeInTransaction } from './serializationTransaction'
+import type { SerializationKind, SerializationTransaction } from './serializationTransaction'
+
+export function serializeFullSnapshot(
+  timestamp: TimeStamp,
+  kind: SerializationKind,
+  document: Document,
+  emitRecord: EmitRecordCallback,
+  emitStats: EmitStatsCallback,
+  scope: RecordingScope
+): void {
+  serializeInTransaction(kind, emitRecord, emitStats, scope, (transaction: SerializationTransaction) => {
+    const defaultPrivacyLevel = transaction.scope.configuration.defaultPrivacyLevel
+
+    // We are sure that Documents are never ignored, so this function never returns null.
+    const node = serializeNode(document, defaultPrivacyLevel, transaction)!
+
+    const record: BrowserFullSnapshotRecord = {
+      data: {
+        node,
+        initialOffset: {
+          left: getScrollX(),
+          top: getScrollY(),
+        },
+      },
+      type: RecordType.FullSnapshot,
+      timestamp,
+    }
+    transaction.add(record)
+  })
+}

packages/rum/src/domain/record/serialization/serializeFullSnapshotAsChange.ts

@@ -0,0 +1,33 @@
+import type { TimeStamp } from '@datadog/browser-core'
+import type { EmitRecordCallback, EmitStatsCallback } from '../record.types'
+import type { RecordingScope } from '../recordingScope'
+import { serializeChangesInTransaction } from './serializationTransaction'
+import type { ChangeSerializationTransaction, SerializationKind } from './serializationTransaction'
+import { serializeNodeAsChange } from './serializeNodeAsChange'
+import { createRootInsertionCursor } from './insertionCursor'
+
+export function serializeFullSnapshotAsChange(
+  timestamp: TimeStamp,
+  kind: SerializationKind,
+  document: Document,
+  emitRecord: EmitRecordCallback,
+  emitStats: EmitStatsCallback,
+  scope: RecordingScope
+): void {
+  scope.resetIds()
+  serializeChangesInTransaction(
+    kind,
+    emitRecord,
+    emitStats,
+    scope,
+    timestamp,
+    (transaction: ChangeSerializationTransaction) => {
+      serializeNodeAsChange(
+        createRootInsertionCursor(scope.nodeIds),
+        document,
+        scope.configuration.defaultPrivacyLevel,
+        transaction
+      )
+    }
+  )
+}

packages/rum/src/domain/record/serialization/serializeMutations.spec.ts

@@ -0,0 +1,113 @@
+import type { RecordingScope } from '../recordingScope'
+import { createRecordingScopeForTesting } from '../test/recordingScope.specHelper'
+import { idsAreAssignedForNodeAndAncestors, sortAddedAndMovedNodes } from './serializeMutations'
+
+describe('idsAreAssignedForNodeAndAncestors', () => {
+  let scope: RecordingScope
+
+  beforeEach(() => {
+    scope = createRecordingScopeForTesting()
+  })
+
+  it('returns false for DOM Nodes that have not been assigned an id', () => {
+    expect(idsAreAssignedForNodeAndAncestors(document.createElement('div'), scope.nodeIds)).toBe(false)
+  })
+
+  it('returns true for DOM Nodes that have been assigned an id', () => {
+    const node = document.createElement('div')
+    scope.nodeIds.getOrInsert(node)
+    expect(idsAreAssignedForNodeAndAncestors(node, scope.nodeIds)).toBe(true)
+  })
+
+  it('returns false for DOM Nodes when an ancestor has not been assigned an id', () => {
+    const node = document.createElement('div')
+    scope.nodeIds.getOrInsert(node)
+
+    const parent = document.createElement('div')
+    parent.appendChild(node)
+    scope.nodeIds.getOrInsert(parent)
+
+    const grandparent = document.createElement('div')
+    grandparent.appendChild(parent)
+
+    expect(idsAreAssignedForNodeAndAncestors(node, scope.nodeIds)).toBe(false)
+  })
+
+  it('returns true for DOM Nodes when all ancestors have been assigned an id', () => {
+    const node = document.createElement('div')
+    scope.nodeIds.getOrInsert(node)
+
+    const parent = document.createElement('div')
+    parent.appendChild(node)
+    scope.nodeIds.getOrInsert(parent)
+
+    const grandparent = document.createElement('div')
+    grandparent.appendChild(parent)
+    scope.nodeIds.getOrInsert(grandparent)
+
+    expect(idsAreAssignedForNodeAndAncestors(node, scope.nodeIds)).toBe(true)
+  })
+
+  it('returns true for DOM Nodes in shadow subtrees', () => {
+    const node = document.createElement('div')
+    scope.nodeIds.getOrInsert(node)
+
+    const parent = document.createElement('div')
+    parent.appendChild(node)
+    scope.nodeIds.getOrInsert(parent)
+
+    const grandparent = document.createElement('div')
+    const shadowRoot = grandparent.attachShadow({ mode: 'open' })
+    shadowRoot.appendChild(parent)
+    scope.nodeIds.getOrInsert(grandparent)
+
+    expect(idsAreAssignedForNodeAndAncestors(node, scope.nodeIds)).toBe(true)
+  })
+})
+
+describe('sortAddedAndMovedNodes', () => {
+  let parent: Node
+  let a: Node
+  let aa: Node
+  let b: Node
+  let c: Node
+  let d: Node
+
+  beforeEach(() => {
+    // Create a tree like this:
+    //     parent
+    //     / | \ \
+    //    a  b c d
+    //    |
+    //    aa
+    a = document.createElement('a')
+    aa = document.createElement('aa')
+    b = document.createElement('b')
+    c = document.createElement('c')
+    d = document.createElement('d')
+    parent = document.createElement('parent')
+    parent.appendChild(a)
+    a.appendChild(aa)
+    parent.appendChild(b)
+    parent.appendChild(c)
+    parent.appendChild(d)
+  })
+
+  it('sorts siblings in reverse order', () => {
+    const nodes = [c, b, d, a]
+    sortAddedAndMovedNodes(nodes)
+    expect(nodes).toEqual([d, c, b, a])
+  })
+
+  it('sorts parents', () => {
+    const nodes = [a, parent, aa]
+    sortAddedAndMovedNodes(nodes)
+    expect(nodes).toEqual([parent, a, aa])
+  })
+
+  it('sorts parents first then siblings', () => {
+    const nodes = [c, aa, b, parent, d, a]
+    sortAddedAndMovedNodes(nodes)
+    expect(nodes).toEqual([parent, d, c, b, a, aa])
+  })
+})