Apply suggestions from code review

1. add an enum type for NodeType 2. rename nodeType from rrweb-snapshot to RRNodeType 3. rename notSerializedId to unserializedId 4. add comments for some confusing variables
rrweb-io · Mar 21, 2022 · d69970d · d69970d
1 parent 23c53e1
commit d69970d
Show file tree

Hide file tree

Showing 12 changed files with 166 additions and 137 deletions.
diff --git a/packages/rrdom/src/diff.ts b/packages/rrdom/src/diff.ts
@@ -1,4 +1,4 @@
-import { elementNode, INode, NodeType } from 'rrweb-snapshot';
+import { elementNode, INode, NodeType as RRNodeType } from 'rrweb-snapshot';
 import type {
   canvasMutationData,
   incrementalSnapshotEvent,
@@ -92,11 +92,11 @@ export function diff(
   let inputDataToApply = null,
     scrollDataToApply = null;
   switch (newTree.RRNodeType) {
-    case NodeType.Document:
+    case RRNodeType.Document:
       const newRRDocument = newTree as IRRDocument;
       scrollDataToApply = (newRRDocument as RRDocument).scrollData;
       break;
-    case NodeType.Element:
+    case RRNodeType.Element:
       const oldElement = (oldTree as Node) as HTMLElement;
       const newRRElement = newTree as IRRElement;
       diffProps(oldElement, newRRElement);
@@ -148,9 +148,9 @@ export function diff(
           );
       }
       break;
-    case NodeType.Text:
-    case NodeType.Comment:
-    case NodeType.CDATA:
+    case RRNodeType.Text:
+    case RRNodeType.Comment:
+    case RRNodeType.CDATA:
       if (
         oldTree.textContent !==
         (newTree as IRRText | IRRComment | IRRCDATASection).data
@@ -174,7 +174,7 @@ export function diff(
   }
   // IFrame element doesn't have child nodes.
   if (
-    newTree.RRNodeType === NodeType.Element &&
+    newTree.RRNodeType === RRNodeType.Element &&
     (newTree as IRRElement).tagName === 'IFRAME'
   ) {
     const oldContentDocument = (((oldTree as Node) as HTMLIFrameElement)
@@ -288,8 +288,8 @@ function diffChildren(
          * We should delete it before insert a serialized one. Otherwise, an error 'Only one element on document allowed' will be thrown.
          */
         if (
-          parentNode.__sn.type === NodeType.Document &&
-          newNode.__sn.type === NodeType.Element &&
+          parentNode.__sn.type === RRNodeType.Document &&
+          newNode.__sn.type === RRNodeType.Element &&
           ((parentNode as Node) as Document).documentElement
         ) {
           parentNode.removeChild(
@@ -335,17 +335,17 @@ export function createOrGetNode(rrNode: IRRNode, mirror: Mirror): INode {
   let node = mirror.getNode(rrNode.__sn.id);
   if (node !== null) return node;
   switch (rrNode.RRNodeType) {
-    case NodeType.Document:
+    case RRNodeType.Document:
       node = (new Document() as unknown) as INode;
       break;
-    case NodeType.DocumentType:
+    case RRNodeType.DocumentType:
       node = (document.implementation.createDocumentType(
         (rrNode as IRRDocumentType).name,
         (rrNode as IRRDocumentType).publicId,
         (rrNode as IRRDocumentType).systemId,
       ) as unknown) as INode;
       break;
-    case NodeType.Element:
+    case RRNodeType.Element:
       let tagName = (rrNode as IRRElement).tagName.toLowerCase();
       tagName = SVGTagMap[tagName] || tagName;
       if ((rrNode.__sn as elementNode).isSVG) {
@@ -358,17 +358,17 @@ export function createOrGetNode(rrNode: IRRNode, mirror: Mirror): INode {
           (rrNode as IRRElement).tagName,
         ) as unknown) as INode;
       break;
-    case NodeType.Text:
+    case RRNodeType.Text:
       node = (document.createTextNode(
         (rrNode as IRRText).data,
       ) as unknown) as INode;
       break;
-    case NodeType.Comment:
+    case RRNodeType.Comment:
       node = (document.createComment(
         (rrNode as IRRComment).data,
       ) as unknown) as INode;
       break;
-    case NodeType.CDATA:
+    case RRNodeType.CDATA:
       node = (document.createCDATASection(
         (rrNode as IRRCDATASection).data,
       ) as unknown) as INode;

diff --git a/packages/rrdom/src/document-nodejs.ts b/packages/rrdom/src/document-nodejs.ts
@@ -1,4 +1,4 @@
-import { NodeType } from 'rrweb-snapshot';
+import { NodeType as RRNodeType } from 'rrweb-snapshot';
 import { NWSAPI } from 'nwsapi';
 import type { CSSStyleDeclaration as CSSStyleDeclarationType } from 'cssstyle';
 import {
@@ -53,15 +53,13 @@ export class RRDocument
   }
 
   get documentElement(): RRElement | null {
-    return super.documentElement as RRElement | null;
-  }
-
-  get body(): RRElement | null {
-    return super.body as RRElement | null;
-  }
-
-  get head() {
-    return super.head as RRElement | null;
+    return (
+      (this.childNodes.find(
+        (node) =>
+          node.RRNodeType === RRNodeType.Element &&
+          (node as RRElement).tagName === 'HTML',
+      ) as RRElement) || null
+    );
   }
 
   get implementation(): RRDocument {
@@ -231,7 +229,7 @@ export class RRElement extends BaseRRElementImpl(RRNode) {
 
   get firstElementChild(): RRElement | null {
     for (let child of this.childNodes)
-      if (child.RRNodeType === NodeType.Element) return child as RRElement;
+      if (child.RRNodeType === RRNodeType.Element) return child as RRElement;
     return null;
   }
 
@@ -327,7 +325,7 @@ export class RRStyleElement extends RRElement {
     if (!this._sheet) {
       let result = '';
       for (let child of this.childNodes)
-        if (child.nodeType === NodeType.Text)
+        if (child.RRNodeType === RRNodeType.Text)
           result += (child as RRText).textContent;
       this._sheet = cssom.parse(result);
     }