rrweb-snapshot - npm Package Compare versions

Comparing version 0.5.1 to 0.5.2

dist/browser.js

@@ -178,9 +178,2 @@ var rrwebSnapshot = (function (exports) {
       map[serializedNode.id] = n;
-      return serializedNode;
-  }
-  function _snapshot(n, doc, map) {
-      var serializedNode = serializeNodeWithId(n, doc, map);
-      if (!serializedNode) {
-          return null;
-      }
       if (serializedNode.type === exports.NodeType.Document ||
@@ -190,3 +183,3 @@ serializedNode.type === exports.NodeType.Element) {
               var childN = _a[_i];
-              var serializedChildNode = _snapshot(childN, doc, map);
+              var serializedChildNode = serializeNodeWithId(childN, doc, map);
               if (serializedChildNode) {
@@ -202,5 +195,100 @@ serializedNode.childNodes.push(serializedChildNode);
       var idNodeMap = {};
-      return [_snapshot(n, n, idNodeMap), idNodeMap];
+      return [serializeNodeWithId(n, n, idNodeMap), idNodeMap];
   }
 
+  var svgTags = [
+      'altGlyph',
+      'altGlyphDef',
+      'altGlyphItem',
+      'animate',
+      'animateColor',
+      'animateMotion',
+      'animateTransform',
+      'animation',
+      'circle',
+      'clipPath',
+      'color-profile',
+      'cursor',
+      'defs',
+      'desc',
+      'discard',
+      'ellipse',
+      'feBlend',
+      'feColorMatrix',
+      'feComponentTransfer',
+      'feComposite',
+      'feConvolveMatrix',
+      'feDiffuseLighting',
+      'feDisplacementMap',
+      'feDistantLight',
+      'feDropShadow',
+      'feFlood',
+      'feFuncA',
+      'feFuncB',
+      'feFuncG',
+      'feFuncR',
+      'feGaussianBlur',
+      'feImage',
+      'feMerge',
+      'feMergeNode',
+      'feMorphology',
+      'feOffset',
+      'fePointLight',
+      'feSpecularLighting',
+      'feSpotLight',
+      'feTile',
+      'feTurbulence',
+      'filter',
+      'font',
+      'font-face',
+      'font-face-format',
+      'font-face-name',
+      'font-face-src',
+      'font-face-uri',
+      'foreignObject',
+      'g',
+      'glyph',
+      'glyphRef',
+      'handler',
+      'hatch',
+      'hatchpath',
+      'hkern',
+      'image',
+      'line',
+      'linearGradient',
+      'listener',
+      'marker',
+      'mask',
+      'mesh',
+      'meshgradient',
+      'meshpatch',
+      'meshrow',
+      'metadata',
+      'missing-glyph',
+      'mpath',
+      'path',
+      'pattern',
+      'polygon',
+      'polyline',
+      'prefetch',
+      'radialGradient',
+      'rect',
+      'set',
+      'solidColor',
+      'solidcolor',
+      'stop',
+      'svg',
+      'switch',
+      'symbol',
+      'tbreak',
+      'text',
+      'textArea',
+      'textPath',
+      'tref',
+      'tspan',
+      'unknown',
+      'use',
+      'view',
+      'vkern',
+  ];
   var tagMap = {
@@ -224,4 +312,9 @@ script: 'noscript'
               var tagName = getTagName(n);
-              var node = doc.createElement(tagName);
-              var extraChildIndexes = [];
+              var node = void 0;
+              if (svgTags.indexOf(tagName) < 0) {
+                  node = doc.createElement(tagName);
+              }
+              else {
+                  node = doc.createElementNS('http://www.w3.org/2000/svg', tagName);
+              }
               for (var name in n.attributes) {
@@ -235,5 +328,3 @@ if (n.attributes.hasOwnProperty(name)) {
                           var child = doc.createTextNode(value);
-                          extraChildIndexes.push(node.childNodes.length);
                           node.appendChild(child);
-                          continue;
                       }
@@ -247,5 +338,2 @@ try {
               }
-              if (extraChildIndexes.length) {
-                  node.setAttribute('data-extra-child-index', JSON.stringify(extraChildIndexes));
-              }
               return node;
@@ -262,14 +350,17 @@ case exports.NodeType.Text:
   }
-  function rebuild(n, doc) {
-      var root = buildNode(n, doc);
-      if (!root) {
+  function buildNodeWithSN(n, doc, map) {
+      var node = buildNode(n, doc);
+      if (!node) {
           return null;
       }
-      if (n.type === exports.NodeType.Element) {
-          root.setAttribute('data-rrid', String(n.id));
+      if (n.type === exports.NodeType.Document) {
+          doc.open();
+          node = doc;
       }
+      node.__sn = n;
+      map[n.id] = node;
       if (n.type === exports.NodeType.Document || n.type === exports.NodeType.Element) {
           for (var _i = 0, _a = n.childNodes; _i < _a.length; _i++) {
               var childN = _a[_i];
-              var childNode = rebuild(childN, doc);
+              var childNode = buildNodeWithSN(childN, doc, map);
               if (!childNode) {
@@ -279,8 +370,12 @@ console.warn('Failed to rebuild', childN);
               else {
-                  root.appendChild(childNode);
+                  node.appendChild(childNode);
               }
           }
       }
-      return root;
+      return node;
   }
+  function rebuild(n, doc) {
+      var idNodeMap = {};
+      return [buildNodeWithSN(n, doc, idNodeMap), idNodeMap];
+  }
 
@@ -291,2 +386,3 @@ exports.snapshot = snapshot;
   exports.rebuild = rebuild;
+  exports.buildNodeWithSN = buildNodeWithSN;
 
@@ -293,0 +389,0 @@ return exports;

dist/index.js

@@ -179,9 +179,2 @@ 'use strict';
     map[serializedNode.id] = n;
-    return serializedNode;
-}
-function _snapshot(n, doc, map) {
-    var serializedNode = serializeNodeWithId(n, doc, map);
-    if (!serializedNode) {
-        return null;
-    }
     if (serializedNode.type === exports.NodeType.Document ||
@@ -191,3 +184,3 @@ serializedNode.type === exports.NodeType.Element) {
             var childN = _a[_i];
-            var serializedChildNode = _snapshot(childN, doc, map);
+            var serializedChildNode = serializeNodeWithId(childN, doc, map);
             if (serializedChildNode) {
@@ -203,5 +196,100 @@ serializedNode.childNodes.push(serializedChildNode);
     var idNodeMap = {};
-    return [_snapshot(n, n, idNodeMap), idNodeMap];
+    return [serializeNodeWithId(n, n, idNodeMap), idNodeMap];
 }
 
+var svgTags = [
+    'altGlyph',
+    'altGlyphDef',
+    'altGlyphItem',
+    'animate',
+    'animateColor',
+    'animateMotion',
+    'animateTransform',
+    'animation',
+    'circle',
+    'clipPath',
+    'color-profile',
+    'cursor',
+    'defs',
+    'desc',
+    'discard',
+    'ellipse',
+    'feBlend',
+    'feColorMatrix',
+    'feComponentTransfer',
+    'feComposite',
+    'feConvolveMatrix',
+    'feDiffuseLighting',
+    'feDisplacementMap',
+    'feDistantLight',
+    'feDropShadow',
+    'feFlood',
+    'feFuncA',
+    'feFuncB',
+    'feFuncG',
+    'feFuncR',
+    'feGaussianBlur',
+    'feImage',
+    'feMerge',
+    'feMergeNode',
+    'feMorphology',
+    'feOffset',
+    'fePointLight',
+    'feSpecularLighting',
+    'feSpotLight',
+    'feTile',
+    'feTurbulence',
+    'filter',
+    'font',
+    'font-face',
+    'font-face-format',
+    'font-face-name',
+    'font-face-src',
+    'font-face-uri',
+    'foreignObject',
+    'g',
+    'glyph',
+    'glyphRef',
+    'handler',
+    'hatch',
+    'hatchpath',
+    'hkern',
+    'image',
+    'line',
+    'linearGradient',
+    'listener',
+    'marker',
+    'mask',
+    'mesh',
+    'meshgradient',
+    'meshpatch',
+    'meshrow',
+    'metadata',
+    'missing-glyph',
+    'mpath',
+    'path',
+    'pattern',
+    'polygon',
+    'polyline',
+    'prefetch',
+    'radialGradient',
+    'rect',
+    'set',
+    'solidColor',
+    'solidcolor',
+    'stop',
+    'svg',
+    'switch',
+    'symbol',
+    'tbreak',
+    'text',
+    'textArea',
+    'textPath',
+    'tref',
+    'tspan',
+    'unknown',
+    'use',
+    'view',
+    'vkern',
+];
 var tagMap = {
@@ -225,4 +313,9 @@ script: 'noscript'
             var tagName = getTagName(n);
-            var node = doc.createElement(tagName);
-            var extraChildIndexes = [];
+            var node = void 0;
+            if (svgTags.indexOf(tagName) < 0) {
+                node = doc.createElement(tagName);
+            }
+            else {
+                node = doc.createElementNS('http://www.w3.org/2000/svg', tagName);
+            }
             for (var name in n.attributes) {
@@ -236,5 +329,3 @@ if (n.attributes.hasOwnProperty(name)) {
                         var child = doc.createTextNode(value);
-                        extraChildIndexes.push(node.childNodes.length);
                         node.appendChild(child);
-                        continue;
                     }
@@ -248,5 +339,2 @@ try {
             }
-            if (extraChildIndexes.length) {
-                node.setAttribute('data-extra-child-index', JSON.stringify(extraChildIndexes));
-            }
             return node;
@@ -263,14 +351,17 @@ case exports.NodeType.Text:
 }
-function rebuild(n, doc) {
-    var root = buildNode(n, doc);
-    if (!root) {
+function buildNodeWithSN(n, doc, map) {
+    var node = buildNode(n, doc);
+    if (!node) {
         return null;
     }
-    if (n.type === exports.NodeType.Element) {
-        root.setAttribute('data-rrid', String(n.id));
+    if (n.type === exports.NodeType.Document) {
+        doc.open();
+        node = doc;
     }
+    node.__sn = n;
+    map[n.id] = node;
     if (n.type === exports.NodeType.Document || n.type === exports.NodeType.Element) {
         for (var _i = 0, _a = n.childNodes; _i < _a.length; _i++) {
             var childN = _a[_i];
-            var childNode = rebuild(childN, doc);
+            var childNode = buildNodeWithSN(childN, doc, map);
             if (!childNode) {
@@ -280,8 +371,12 @@ console.warn('Failed to rebuild', childN);
             else {
-                root.appendChild(childNode);
+                node.appendChild(childNode);
             }
         }
     }
-    return root;
+    return node;
 }
+function rebuild(n, doc) {
+    var idNodeMap = {};
+    return [buildNodeWithSN(n, doc, idNodeMap), idNodeMap];
+}
 
@@ -292,1 +387,2 @@ exports.snapshot = snapshot;
 exports.rebuild = rebuild;
+exports.buildNodeWithSN = buildNodeWithSN;

dist/module.js

@@ -176,9 +176,2 @@ var NodeType;
     map[serializedNode.id] = n;
-    return serializedNode;
-}
-function _snapshot(n, doc, map) {
-    var serializedNode = serializeNodeWithId(n, doc, map);
-    if (!serializedNode) {
-        return null;
-    }
     if (serializedNode.type === NodeType.Document ||
@@ -188,3 +181,3 @@ serializedNode.type === NodeType.Element) {
             var childN = _a[_i];
-            var serializedChildNode = _snapshot(childN, doc, map);
+            var serializedChildNode = serializeNodeWithId(childN, doc, map);
             if (serializedChildNode) {
@@ -200,5 +193,100 @@ serializedNode.childNodes.push(serializedChildNode);
     var idNodeMap = {};
-    return [_snapshot(n, n, idNodeMap), idNodeMap];
+    return [serializeNodeWithId(n, n, idNodeMap), idNodeMap];
 }
 
+var svgTags = [
+    'altGlyph',
+    'altGlyphDef',
+    'altGlyphItem',
+    'animate',
+    'animateColor',
+    'animateMotion',
+    'animateTransform',
+    'animation',
+    'circle',
+    'clipPath',
+    'color-profile',
+    'cursor',
+    'defs',
+    'desc',
+    'discard',
+    'ellipse',
+    'feBlend',
+    'feColorMatrix',
+    'feComponentTransfer',
+    'feComposite',
+    'feConvolveMatrix',
+    'feDiffuseLighting',
+    'feDisplacementMap',
+    'feDistantLight',
+    'feDropShadow',
+    'feFlood',
+    'feFuncA',
+    'feFuncB',
+    'feFuncG',
+    'feFuncR',
+    'feGaussianBlur',
+    'feImage',
+    'feMerge',
+    'feMergeNode',
+    'feMorphology',
+    'feOffset',
+    'fePointLight',
+    'feSpecularLighting',
+    'feSpotLight',
+    'feTile',
+    'feTurbulence',
+    'filter',
+    'font',
+    'font-face',
+    'font-face-format',
+    'font-face-name',
+    'font-face-src',
+    'font-face-uri',
+    'foreignObject',
+    'g',
+    'glyph',
+    'glyphRef',
+    'handler',
+    'hatch',
+    'hatchpath',
+    'hkern',
+    'image',
+    'line',
+    'linearGradient',
+    'listener',
+    'marker',
+    'mask',
+    'mesh',
+    'meshgradient',
+    'meshpatch',
+    'meshrow',
+    'metadata',
+    'missing-glyph',
+    'mpath',
+    'path',
+    'pattern',
+    'polygon',
+    'polyline',
+    'prefetch',
+    'radialGradient',
+    'rect',
+    'set',
+    'solidColor',
+    'solidcolor',
+    'stop',
+    'svg',
+    'switch',
+    'symbol',
+    'tbreak',
+    'text',
+    'textArea',
+    'textPath',
+    'tref',
+    'tspan',
+    'unknown',
+    'use',
+    'view',
+    'vkern',
+];
 var tagMap = {
@@ -222,4 +310,9 @@ script: 'noscript'
             var tagName = getTagName(n);
-            var node = doc.createElement(tagName);
-            var extraChildIndexes = [];
+            var node = void 0;
+            if (svgTags.indexOf(tagName) < 0) {
+                node = doc.createElement(tagName);
+            }
+            else {
+                node = doc.createElementNS('http://www.w3.org/2000/svg', tagName);
+            }
             for (var name in n.attributes) {
@@ -233,5 +326,3 @@ if (n.attributes.hasOwnProperty(name)) {
                         var child = doc.createTextNode(value);
-                        extraChildIndexes.push(node.childNodes.length);
                         node.appendChild(child);
-                        continue;
                     }
@@ -245,5 +336,2 @@ try {
             }
-            if (extraChildIndexes.length) {
-                node.setAttribute('data-extra-child-index', JSON.stringify(extraChildIndexes));
-            }
             return node;
@@ -260,14 +348,17 @@ case NodeType.Text:
 }
-function rebuild(n, doc) {
-    var root = buildNode(n, doc);
-    if (!root) {
+function buildNodeWithSN(n, doc, map) {
+    var node = buildNode(n, doc);
+    if (!node) {
         return null;
     }
-    if (n.type === NodeType.Element) {
-        root.setAttribute('data-rrid', String(n.id));
+    if (n.type === NodeType.Document) {
+        doc.open();
+        node = doc;
     }
+    node.__sn = n;
+    map[n.id] = node;
     if (n.type === NodeType.Document || n.type === NodeType.Element) {
         for (var _i = 0, _a = n.childNodes; _i < _a.length; _i++) {
             var childN = _a[_i];
-            var childNode = rebuild(childN, doc);
+            var childNode = buildNodeWithSN(childN, doc, map);
             if (!childNode) {
@@ -277,9 +368,13 @@ console.warn('Failed to rebuild', childN);
             else {
-                root.appendChild(childNode);
+                node.appendChild(childNode);
             }
         }
     }
-    return root;
+    return node;
 }
+function rebuild(n, doc) {
+    var idNodeMap = {};
+    return [buildNodeWithSN(n, doc, idNodeMap), idNodeMap];
+}
 
-export { snapshot, serializeNodeWithId, resetId, rebuild, NodeType };
+export { snapshot, serializeNodeWithId, resetId, rebuild, buildNodeWithSN, NodeType };

index.d.ts

@@ -1,6 +0,9 @@
-import { serializedNodeWithId, idNodeMap } from './src/types';
+import { serializedNodeWithId, idNodeMap, INode } from './src/types';
 export * from './src/types';
 
 export function snapshot(n: Document): [serializedNodeWithId | null, idNodeMap];
-export function rebuild(n: serializedNodeWithId, doc: Document): Node | null;
+export function rebuild(
+  n: serializedNodeWithId,
+  doc: Document,
+): [Node | null, idNodeMap];
 export function serializeNodeWithId(
@@ -12,1 +15,6 @@ n: Node,
 export function resetId(): void;
+export function buildNodeWithSN(
+  n: serializedNodeWithId,
+  doc: Document,
+  map: idNodeMap,
+): INode | null;

package.json

 {
   "name": "rrweb-snapshot",
-  "version": "0.5.1",
+  "version": "0.5.2",
   "description": "rrweb's component to take a snapshot of DOM, aka DOM serializer",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

README.md

@@ -10,3 +10,3 @@ # rrweb-snapshot
 
-This module export 3 methods:
+This module export following methods:
 
@@ -38,1 +38,5 @@ ### snapshot
 `serializeNodeWithId` can serialize a node into snapshot format with id.
+
+#### buildNodeWithSN
+
+`buildNodeWithSN` will build DOM from serialized node and store serialized information in `__sn` property.

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

37214

increased by15.56%

Lines of code

1193

increased by32.85%

Number of lines in readme file

41

increased by10.81%

No dependency changes