rrdom - npm Package Compare versions

Comparing version 0.1.3 to 0.1.4

dist/index.d.ts

@@ -254,2 +254,3 @@ import { NodeType as RRNodeType } from 'rrweb-snapshot';
 export declare class RRCanvasElement extends RRElement implements IRRElement {
+    rr_dataURL: string | null;
     canvasMutations: {
@@ -256,0 +257,0 @@ event: canvasEventWithTime;

dist/rrdom.js

@@ -602,3 +602,16 @@ var rrdom = (function (exports) {
                     case 'CANVAS':
-                        newTree.canvasMutations.forEach((canvasMutation) => replayer.applyCanvas(canvasMutation.event, canvasMutation.mutation, oldTree));
+                        {
+                            const rrCanvasElement = newTree;
+                            if (rrCanvasElement.rr_dataURL !== null) {
+                                const image = document.createElement('img');
+                                image.onload = () => {
+                                    const ctx = oldElement.getContext('2d');
+                                    if (ctx) {
+                                        ctx.drawImage(image, 0, 0, image.width, image.height);
+                                    }
+                                };
+                                image.src = rrCanvasElement.rr_dataURL;
+                            }
+                            rrCanvasElement.canvasMutations.forEach((canvasMutation) => replayer.applyCanvas(canvasMutation.event, canvasMutation.mutation, oldTree));
+                        }
                         break;
@@ -939,2 +952,3 @@ case 'STYLE':
             super(...arguments);
+            this.rr_dataURL = null;
             this.canvasMutations = [];
@@ -941,0 +955,0 @@ }

dist/rrdom.min.js

@@ -1,2 +0,2 @@
-var rrdom=function(e){"use strict";var t;!function(e){e[e.Document=0]="Document",e[e.DocumentType=1]="DocumentType",e[e.Element=2]="Element",e[e.Text=3]="Text",e[e.CDATA=4]="CDATA",e[e.Comment=5]="Comment"}(t||(t={}));var o=function(){function e(){this.idNodeMap=new Map,this.nodeMetaMap=new WeakMap}return e.prototype.getId=function(e){var t;if(!e)return-1;var o=null===(t=this.getMeta(e))||void 0===t?void 0:t.id;return null!=o?o:-1},e.prototype.getNode=function(e){return this.idNodeMap.get(e)||null},e.prototype.getIds=function(){return Array.from(this.idNodeMap.keys())},e.prototype.getMeta=function(e){return this.nodeMetaMap.get(e)||null},e.prototype.removeNodeFromMap=function(e){var t=this,o=this.getId(e);this.idNodeMap.delete(o),e.childNodes&&e.childNodes.forEach((function(e){return t.removeNodeFromMap(e)}))},e.prototype.has=function(e){return this.idNodeMap.has(e)},e.prototype.hasNode=function(e){return this.nodeMetaMap.has(e)},e.prototype.add=function(e,t){var o=t.id;this.idNodeMap.set(o,e),this.nodeMetaMap.set(e,t)},e.prototype.replace=function(e,t){this.idNodeMap.set(e,t)},e.prototype.reset=function(){this.idNodeMap=new Map,this.nodeMetaMap=new WeakMap},e}();function n(e){const t=[];for(const o in e){const n=e[o];if("string"!=typeof n)continue;const r=d(o);t.push(`${r}: ${n};`)}return t.join(" ")}const r=/-([a-z])/g,s=/^--[a-zA-Z0-9-]+$/,i=e=>s.test(e)?e:e.replace(r,((e,t)=>t?t.toUpperCase():"")),a=/\B([A-Z])/g,d=e=>e.replace(a,"-$1").toLowerCase();class c{constructor(...t){this.childNodes=[],this.parentElement=null,this.parentNode=null,this.ELEMENT_NODE=e.NodeType.ELEMENT_NODE,this.TEXT_NODE=e.NodeType.TEXT_NODE}get firstChild(){return this.childNodes[0]||null}get lastChild(){return this.childNodes[this.childNodes.length-1]||null}get nextSibling(){const e=this.parentNode;if(!e)return null;const t=e.childNodes,o=t.indexOf(this);return t[o+1]||null}contains(e){if(e===this)return!0;for(const t of this.childNodes)if(t.contains(e))return!0;return!1}appendChild(e){throw new Error("RRDomException: Failed to execute 'appendChild' on 'RRNode': This RRNode type does not support this method.")}insertBefore(e,t){throw new Error("RRDomException: Failed to execute 'insertBefore' on 'RRNode': This RRNode type does not support this method.")}removeChild(e){throw new Error("RRDomException: Failed to execute 'removeChild' on 'RRNode': This RRNode type does not support this method.")}toString(){return"RRNode"}}function l(o){return class n extends o{constructor(){super(...arguments),this.nodeType=e.NodeType.DOCUMENT_NODE,this.nodeName="#document",this.compatMode="CSS1Compat",this.RRNodeType=t.Document,this.textContent=null}get documentElement(){return this.childNodes.find((e=>e.RRNodeType===t.Element&&"HTML"===e.tagName))||null}get body(){var e;return(null===(e=this.documentElement)||void 0===e?void 0:e.childNodes.find((e=>e.RRNodeType===t.Element&&"BODY"===e.tagName)))||null}get head(){var e;return(null===(e=this.documentElement)||void 0===e?void 0:e.childNodes.find((e=>e.RRNodeType===t.Element&&"HEAD"===e.tagName)))||null}get implementation(){return this}get firstElementChild(){return this.documentElement}appendChild(e){const o=e.RRNodeType;if((o===t.Element||o===t.DocumentType)&&this.childNodes.some((e=>e.RRNodeType===o)))throw new Error(`RRDomException: Failed to execute 'appendChild' on 'RRNode': Only one ${o===t.Element?"RRElement":"RRDoctype"} on RRDocument allowed.`);return e.parentElement=null,e.parentNode=this,this.childNodes.push(e),e}insertBefore(e,o){const n=e.RRNodeType;if((n===t.Element||n===t.DocumentType)&&this.childNodes.some((e=>e.RRNodeType===n)))throw new Error(`RRDomException: Failed to execute 'insertBefore' on 'RRNode': Only one ${n===t.Element?"RRElement":"RRDoctype"} on RRDocument allowed.`);if(null===o)return this.appendChild(e);const r=this.childNodes.indexOf(o);if(-1==r)throw new Error("Failed to execute 'insertBefore' on 'RRNode': The RRNode before which the new node is to be inserted is not a child of this RRNode.");return this.childNodes.splice(r,0,e),e.parentElement=null,e.parentNode=this,e}removeChild(e){const t=this.childNodes.indexOf(e);if(-1===t)throw new Error("Failed to execute 'removeChild' on 'RRDocument': The RRNode to be removed is not a child of this RRNode.");return this.childNodes.splice(t,1),e.parentElement=null,e.parentNode=null,e}open(){this.childNodes=[]}close(){}write(e){let t;if('<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">'===e?t="-//W3C//DTD XHTML 1.0 Transitional//EN":'<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "">'===e&&(t="-//W3C//DTD HTML 4.0 Transitional//EN"),t){const e=this.createDocumentType("html",t,"");this.open(),this.appendChild(e)}}createDocument(e,t,o){return new n}createDocumentType(e,t,o){const n=new(u(c))(e,t,o);return n.ownerDocument=this,n}createElement(e){const t=new(h(c))(e);return t.ownerDocument=this,t}createElementNS(e,t){return this.createElement(t)}createTextNode(e){const t=new(m(c))(e);return t.ownerDocument=this,t}createComment(e){const t=new(N(c))(e);return t.ownerDocument=this,t}createCDATASection(e){const t=new(f(c))(e);return t.ownerDocument=this,t}toString(){return"RRDocument"}}}function u(o){return class extends o{constructor(o,n,r){super(),this.nodeType=e.NodeType.DOCUMENT_TYPE_NODE,this.RRNodeType=t.DocumentType,this.textContent=null,this.name=o,this.publicId=n,this.systemId=r,this.nodeName=o}toString(){return"RRDocumentType"}}}function h(o){return class extends o{constructor(o){super(),this.nodeType=e.NodeType.ELEMENT_NODE,this.RRNodeType=t.Element,this.attributes={},this.shadowRoot=null,this.tagName=o.toUpperCase(),this.nodeName=o.toUpperCase()}get textContent(){let e="";return this.childNodes.forEach((t=>e+=t.textContent)),e}set textContent(e){this.childNodes=[this.ownerDocument.createTextNode(e)]}get classList(){return new R(this.attributes.class,(e=>{this.attributes.class=e}))}get id(){return this.attributes.id||""}get className(){return this.attributes.class||""}get style(){const e=this.attributes.style?function(e){const t={},o=/:(.+)/;return e.replace(/\/\*.*?\*\//g,"").split(/;(?![^(]*\))/g).forEach((function(e){if(e){const n=e.split(o);n.length>1&&(t[i(n[0].trim())]=n[1].trim())}})),t}(this.attributes.style):{},t=/\B([A-Z])/g;return e.setProperty=(o,r,s)=>{if(t.test(o))return;const a=i(o);r?e[a]=r:delete e[a],"important"===s&&(e[a]+=" !important"),this.attributes.style=n(e)},e.removeProperty=o=>{if(t.test(o))return"";const r=i(o),s=e[r]||"";return delete e[r],this.attributes.style=n(e),s},e}getAttribute(e){return this.attributes[e]||null}setAttribute(e,t){this.attributes[e]=t}setAttributeNS(e,t,o){this.setAttribute(t,o)}removeAttribute(e){delete this.attributes[e]}appendChild(e){return this.childNodes.push(e),e.parentNode=this,e.parentElement=this,e}insertBefore(e,t){if(null===t)return this.appendChild(e);const o=this.childNodes.indexOf(t);if(-1==o)throw new Error("Failed to execute 'insertBefore' on 'RRNode': The RRNode before which the new node is to be inserted is not a child of this RRNode.");return this.childNodes.splice(o,0,e),e.parentElement=this,e.parentNode=this,e}removeChild(e){const t=this.childNodes.indexOf(e);if(-1===t)throw new Error("Failed to execute 'removeChild' on 'RRElement': The RRNode to be removed is not a child of this RRNode.");return this.childNodes.splice(t,1),e.parentElement=null,e.parentNode=null,e}attachShadow(e){const t=this.ownerDocument.createElement("SHADOWROOT");return this.shadowRoot=t,t}dispatchEvent(e){return!0}toString(){let e="";for(const t in this.attributes)e+=`${t}="${this.attributes[t]}" `;return`${this.tagName} ${e}`}}}function p(e){return class extends e{attachShadow(e){throw new Error("RRDomException: Failed to execute 'attachShadow' on 'RRElement': This RRElement does not support attachShadow")}play(){this.paused=!1}pause(){this.paused=!0}}}function m(o){return class extends o{constructor(o){super(),this.nodeType=e.NodeType.TEXT_NODE,this.nodeName="#text",this.RRNodeType=t.Text,this.data=o}get textContent(){return this.data}set textContent(e){this.data=e}toString(){return`RRText text=${JSON.stringify(this.data)}`}}}function N(o){return class extends o{constructor(o){super(),this.nodeType=e.NodeType.COMMENT_NODE,this.nodeName="#comment",this.RRNodeType=t.Comment,this.data=o}get textContent(){return this.data}set textContent(e){this.data=e}toString(){return`RRComment text=${JSON.stringify(this.data)}`}}}function f(o){return class extends o{constructor(o){super(),this.nodeName="#cdata-section",this.nodeType=e.NodeType.CDATA_SECTION_NODE,this.RRNodeType=t.CDATA,this.data=o}get textContent(){return this.data}set textContent(e){this.data=e}toString(){return`RRCDATASection data=${JSON.stringify(this.data)}`}}}class R{constructor(e,t){if(this.classes=[],this.add=(...e)=>{for(const t of e){const e=String(t);this.classes.indexOf(e)>=0||this.classes.push(e)}this.onChange&&this.onChange(this.classes.join(" "))},this.remove=(...e)=>{this.classes=this.classes.filter((t=>-1===e.indexOf(t))),this.onChange&&this.onChange(this.classes.join(" "))},e){const t=e.trim().split(/\s+/);this.classes.push(...t)}this.onChange=t}}e.NodeType=void 0,function(e){e[e.PLACEHOLDER=0]="PLACEHOLDER",e[e.ELEMENT_NODE=1]="ELEMENT_NODE",e[e.ATTRIBUTE_NODE=2]="ATTRIBUTE_NODE",e[e.TEXT_NODE=3]="TEXT_NODE",e[e.CDATA_SECTION_NODE=4]="CDATA_SECTION_NODE",e[e.ENTITY_REFERENCE_NODE=5]="ENTITY_REFERENCE_NODE",e[e.ENTITY_NODE=6]="ENTITY_NODE",e[e.PROCESSING_INSTRUCTION_NODE=7]="PROCESSING_INSTRUCTION_NODE",e[e.COMMENT_NODE=8]="COMMENT_NODE",e[e.DOCUMENT_NODE=9]="DOCUMENT_NODE",e[e.DOCUMENT_TYPE_NODE=10]="DOCUMENT_TYPE_NODE",e[e.DOCUMENT_FRAGMENT_NODE=11]="DOCUMENT_FRAGMENT_NODE"}(e.NodeType||(e.NodeType={}));const T={svg:"http://www.w3.org/2000/svg","xlink:href":"http://www.w3.org/1999/xlink",xmlns:"http://www.w3.org/2000/xmlns/"},E={altglyph:"altGlyph",altglyphdef:"altGlyphDef",altglyphitem:"altGlyphItem",animatecolor:"animateColor",animatemotion:"animateMotion",animatetransform:"animateTransform",clippath:"clipPath",feblend:"feBlend",fecolormatrix:"feColorMatrix",fecomponenttransfer:"feComponentTransfer",fecomposite:"feComposite",feconvolvematrix:"feConvolveMatrix",fediffuselighting:"feDiffuseLighting",fedisplacementmap:"feDisplacementMap",fedistantlight:"feDistantLight",fedropshadow:"feDropShadow",feflood:"feFlood",fefunca:"feFuncA",fefuncb:"feFuncB",fefuncg:"feFuncG",fefuncr:"feFuncR",fegaussianblur:"feGaussianBlur",feimage:"feImage",femerge:"feMerge",femergenode:"feMergeNode",femorphology:"feMorphology",feoffset:"feOffset",fepointlight:"fePointLight",fespecularlighting:"feSpecularLighting",fespotlight:"feSpotLight",fetile:"feTile",feturbulence:"feTurbulence",foreignobject:"foreignObject",glyphref:"glyphRef",lineargradient:"linearGradient",radialgradient:"radialGradient"};function y(o,n,r,s){const i=o.childNodes,a=n.childNodes;s=s||n.mirror||n.ownerDocument.mirror,(i.length>0||a.length>0)&&D(Array.from(i),a,o,r,s);let d=null,c=null;switch(n.RRNodeType){case t.Document:c=n.scrollData;break;case t.Element:{const t=o,i=n;switch(function(e,t,o){const n=e.attributes,r=t.attributes;for(const n in r){const s=r[n],i=o.getMeta(t);if(i&&"isSVG"in i&&i.isSVG&&T[n])e.setAttributeNS(T[n],n,s);else if("CANVAS"===t.tagName&&"rr_dataURL"===n){const t=document.createElement("img");t.src=s,t.onload=()=>{const o=e.getContext("2d");o&&o.drawImage(t,0,0,t.width,t.height)}}else e.setAttribute(n,s)}for(const{name:t}of Array.from(n))t in r||e.removeAttribute(t);t.scrollLeft&&(e.scrollLeft=t.scrollLeft),t.scrollTop&&(e.scrollTop=t.scrollTop)}(t,i,s),c=i.scrollData,d=i.inputData,i.tagName){case"AUDIO":case"VIDEO":{const e=o,t=i;void 0!==t.paused&&(t.paused?e.pause():e.play()),void 0!==t.muted&&(e.muted=t.muted),void 0!==t.volume&&(e.volume=t.volume),void 0!==t.currentTime&&(e.currentTime=t.currentTime);break}case"CANVAS":n.canvasMutations.forEach((e=>r.applyCanvas(e.event,e.mutation,o)));break;case"STYLE":!function(t,o){const n=t.sheet;o.forEach((t=>{if(t.type===e.StyleRuleType.Insert)try{if(Array.isArray(t.index)){const{positions:e,index:o}=w(t.index);C(n.cssRules,e).insertRule(t.cssText,o)}else n.insertRule(t.cssText,t.index)}catch(e){}else if(t.type===e.StyleRuleType.Remove)try{if(Array.isArray(t.index)){const{positions:e,index:o}=w(t.index);C(n.cssRules,e).deleteRule(o||0)}else n.deleteRule(t.index)}catch(e){}else if(t.type===e.StyleRuleType.SetProperty){C(n.cssRules,t.index).style.setProperty(t.property,t.value,t.priority)}else if(t.type===e.StyleRuleType.RemoveProperty){C(n.cssRules,t.index).style.removeProperty(t.property)}}))}(t,n.rules)}if(i.shadowRoot){t.shadowRoot||t.attachShadow({mode:"open"});const e=t.shadowRoot.childNodes,o=i.shadowRoot.childNodes;(e.length>0||o.length>0)&&D(Array.from(e),o,t.shadowRoot,r,s)}break}case t.Text:case t.Comment:case t.CDATA:o.textContent!==n.data&&(o.textContent=n.data)}if(c&&r.applyScroll(c,!0),d&&r.applyInput(d),"IFRAME"===n.nodeName){const e=o.contentDocument,t=n;if(e){const o=s.getMeta(t.contentDocument);o&&r.mirror.add(e,Object.assign({},o)),y(e,t.contentDocument,r,s)}}}function D(e,o,n,r,s){var i;let a,d,c=0,l=e.length-1,u=0,h=o.length-1,p=e[c],m=e[l],N=o[u],f=o[h];for(;c<=l&&u<=h;)if(void 0===p)p=e[++c];else if(void 0===m)m=e[--l];else if(r.mirror.getId(p)===s.getId(N))y(p,N,r,s),p=e[++c],N=o[++u];else if(r.mirror.getId(m)===s.getId(f))y(m,f,r,s),m=e[--l],f=o[--h];else if(r.mirror.getId(p)===s.getId(f))n.insertBefore(p,m.nextSibling),y(p,f,r,s),p=e[++c],f=o[--h];else if(r.mirror.getId(m)===s.getId(N))n.insertBefore(m,p),y(m,N,r,s),m=e[--l],N=o[++u];else{if(!a){a={};for(let t=c;t<=l;t++){const o=e[t];o&&r.mirror.hasNode(o)&&(a[r.mirror.getId(o)]=t)}}if(d=a[s.getId(N)],d){const t=e[d];n.insertBefore(t,p),y(t,N,r,s),e[d]=void 0}else{const o=g(N,r.mirror,s);"#document"===n.nodeName&&(null===(i=r.mirror.getMeta(o))||void 0===i?void 0:i.type)===t.Element&&n.documentElement&&(n.removeChild(n.documentElement),e[c]=void 0,p=void 0),n.insertBefore(o,p||null),y(o,N,r,s)}N=o[++u]}if(c>l){const e=o[h+1];let t=null;for(e&&n.childNodes.forEach((o=>{r.mirror.getId(o)===s.getId(e)&&(t=o)}));u<=h;++u){const e=g(o[u],r.mirror,s);n.insertBefore(e,t),y(e,o[u],r,s)}}else if(u>h)for(;c<=l;c++){const t=e[c];t&&(n.removeChild(t),r.mirror.removeNodeFromMap(t))}}function g(e,o,n){let r=o.getNode(n.getId(e));const s=n.getMeta(e);if(null!==r)return r;switch(e.RRNodeType){case t.Document:r=new Document;break;case t.DocumentType:r=document.implementation.createDocumentType(e.name,e.publicId,e.systemId);break;case t.Element:{let t=e.tagName.toLowerCase();t=E[t]||t,r=s&&"isSVG"in s&&(null==s?void 0:s.isSVG)?document.createElementNS(T.svg,t):document.createElement(e.tagName);break}case t.Text:r=document.createTextNode(e.data);break;case t.Comment:r=document.createComment(e.data);break;case t.CDATA:r=document.createCDATASection(e.data)}return s&&o.add(r,Object.assign({},s)),r}function C(e,t){const o=e[t[0]];return 1===t.length?o:C(o.cssRules[t[1]].cssRules,t.slice(2))}var M;function w(e){const t=[...e],o=t.pop();return{positions:t,index:o}}e.StyleRuleType=void 0,(M=e.StyleRuleType||(e.StyleRuleType={}))[M.Insert=0]="Insert",M[M.Remove=1]="Remove",M[M.Snapshot=2]="Snapshot",M[M.SetProperty=3]="SetProperty",M[M.RemoveProperty=4]="RemoveProperty";class O extends(l(c)){constructor(e){super(),this._unserializedId=-1,this.mirror=k(),this.scrollData=null,e&&(this.mirror=e)}get unserializedId(){return this._unserializedId--}createDocument(e,t,o){return new O}createDocumentType(e,t,o){const n=new x(e,t,o);return n.ownerDocument=this,n}createElement(e){const t=e.toUpperCase();let o;switch(t){case"AUDIO":case"VIDEO":o=new A(t);break;case"IFRAME":o=new S(t,this.mirror);break;case"CANVAS":o=new I(t);break;case"STYLE":o=new b(t);break;default:o=new v(t)}return o.ownerDocument=this,o}createComment(e){const t=new L(e);return t.ownerDocument=this,t}createCDATASection(e){const t=new F(e);return t.ownerDocument=this,t}createTextNode(e){const t=new _(e);return t.ownerDocument=this,t}destroyTree(){this.childNodes=[],this.mirror.reset()}open(){super.open(),this._unserializedId=-1}}const x=u(c);class v extends(h(c)){constructor(){super(...arguments),this.inputData=null,this.scrollData=null}}class A extends(p(v)){}class I extends v{constructor(){super(...arguments),this.canvasMutations=[]}getContext(){return null}}class b extends v{constructor(){super(...arguments),this.rules=[]}}class S extends v{constructor(e,t){super(e),this.contentDocument=new O,this.contentDocument.mirror=t}}const _=m(c),L=N(c),F=f(c);function B(t,o,n,r){let s;switch(t.nodeType){case e.NodeType.DOCUMENT_NODE:r&&"IFRAME"===r.nodeName?s=r.contentDocument:(s=o,s.compatMode=t.compatMode);break;case e.NodeType.DOCUMENT_TYPE_NODE:{const e=t;s=o.createDocumentType(e.name,e.publicId,e.systemId);break}case e.NodeType.ELEMENT_NODE:{const e=t,n=(i=e)instanceof HTMLFormElement?"FORM":i.tagName.toUpperCase();s=o.createElement(n);const r=s;for(const{name:t,value:o}of Array.from(e.attributes))r.attributes[t]=o;e.scrollLeft&&(r.scrollLeft=e.scrollLeft),e.scrollTop&&(r.scrollTop=e.scrollTop);break}case e.NodeType.TEXT_NODE:s=o.createTextNode(t.textContent||"");break;case e.NodeType.CDATA_SECTION_NODE:s=o.createCDATASection(t.data);break;case e.NodeType.COMMENT_NODE:s=o.createComment(t.textContent||"");break;case e.NodeType.DOCUMENT_FRAGMENT_NODE:s=r.attachShadow({mode:"open"});break;default:return null}var i;let a=n.getMeta(t);return o instanceof O&&(a||(a=P(s,o.unserializedId),n.add(t,a)),o.mirror.add(s,Object.assign({},a))),s}function k(){return new U}class U{constructor(){this.idNodeMap=new Map,this.nodeMetaMap=new WeakMap}getId(e){var t;if(!e)return-1;const o=null===(t=this.getMeta(e))||void 0===t?void 0:t.id;return null!=o?o:-1}getNode(e){return this.idNodeMap.get(e)||null}getIds(){return Array.from(this.idNodeMap.keys())}getMeta(e){return this.nodeMetaMap.get(e)||null}removeNodeFromMap(e){const t=this.getId(e);this.idNodeMap.delete(t),e.childNodes&&e.childNodes.forEach((e=>this.removeNodeFromMap(e)))}has(e){return this.idNodeMap.has(e)}hasNode(e){return this.nodeMetaMap.has(e)}add(e,t){const o=t.id;this.idNodeMap.set(o,e),this.nodeMetaMap.set(e,t)}replace(e,t){this.idNodeMap.set(e,t)}reset(){this.idNodeMap=new Map,this.nodeMetaMap=new WeakMap}}function P(e,o){switch(e.RRNodeType){case t.Document:return{id:o,type:e.RRNodeType,childNodes:[]};case t.DocumentType:{const t=e;return{id:o,type:e.RRNodeType,name:t.name,publicId:t.publicId,systemId:t.systemId}}case t.Element:return{id:o,type:e.RRNodeType,tagName:e.tagName.toLowerCase(),attributes:{},childNodes:[]};case t.Text:case t.Comment:return{id:o,type:e.RRNodeType,textContent:e.textContent||""};case t.CDATA:return{id:o,type:e.RRNodeType,textContent:""}}}function G(e,o,n){let r=`${n}${o.getId(e)} ${e.toString()}\n`;if(e.RRNodeType===t.Element){const t=e;t.shadowRoot&&(r+=G(t.shadowRoot,o,n+"  "))}for(const t of e.childNodes)r+=G(t,o,n+"  ");return"IFRAME"===e.nodeName&&(r+=G(e.contentDocument,o,n+"  ")),r}return e.BaseRRCDATASectionImpl=f,e.BaseRRCommentImpl=N,e.BaseRRDocumentImpl=l,e.BaseRRDocumentTypeImpl=u,e.BaseRRElementImpl=h,e.BaseRRMediaElementImpl=p,e.BaseRRNode=c,e.BaseRRTextImpl=m,e.ClassList=R,e.Mirror=U,e.RRCDATASection=F,e.RRCanvasElement=I,e.RRComment=L,e.RRDocument=O,e.RRDocumentType=x,e.RRElement=v,e.RRIFrameElement=S,e.RRMediaElement=A,e.RRNode=c,e.RRStyleElement=b,e.RRText=_,e.buildFromDom=function(t,n=function(){return new o}(),r=new O){return function t(o,s){const i=B(o,r,n,s);null!==i&&("IFRAME"!==(null==s?void 0:s.nodeName)&&o.nodeType!==e.NodeType.DOCUMENT_FRAGMENT_NODE&&(null==s||s.appendChild(i),i.parentNode=s,i.parentElement=s),"IFRAME"===o.nodeName?t(o.contentDocument,i):o.nodeType!==e.NodeType.DOCUMENT_NODE&&o.nodeType!==e.NodeType.ELEMENT_NODE&&o.nodeType!==e.NodeType.DOCUMENT_FRAGMENT_NODE||(o.nodeType===e.NodeType.ELEMENT_NODE&&o.shadowRoot&&t(o.shadowRoot,i),o.childNodes.forEach((e=>t(e,i)))))}(t,null),r},e.buildFromNode=B,e.createMirror=k,e.createOrGetNode=g,e.diff=y,e.getDefaultSN=P,e.printRRDom=function(e,t){return G(e,t,"")},Object.defineProperty(e,"__esModule",{value:!0}),e}({});
+var rrdom=function(e){"use strict";var t;!function(e){e[e.Document=0]="Document",e[e.DocumentType=1]="DocumentType",e[e.Element=2]="Element",e[e.Text=3]="Text",e[e.CDATA=4]="CDATA",e[e.Comment=5]="Comment"}(t||(t={}));var o=function(){function e(){this.idNodeMap=new Map,this.nodeMetaMap=new WeakMap}return e.prototype.getId=function(e){var t;if(!e)return-1;var o=null===(t=this.getMeta(e))||void 0===t?void 0:t.id;return null!=o?o:-1},e.prototype.getNode=function(e){return this.idNodeMap.get(e)||null},e.prototype.getIds=function(){return Array.from(this.idNodeMap.keys())},e.prototype.getMeta=function(e){return this.nodeMetaMap.get(e)||null},e.prototype.removeNodeFromMap=function(e){var t=this,o=this.getId(e);this.idNodeMap.delete(o),e.childNodes&&e.childNodes.forEach((function(e){return t.removeNodeFromMap(e)}))},e.prototype.has=function(e){return this.idNodeMap.has(e)},e.prototype.hasNode=function(e){return this.nodeMetaMap.has(e)},e.prototype.add=function(e,t){var o=t.id;this.idNodeMap.set(o,e),this.nodeMetaMap.set(e,t)},e.prototype.replace=function(e,t){this.idNodeMap.set(e,t)},e.prototype.reset=function(){this.idNodeMap=new Map,this.nodeMetaMap=new WeakMap},e}();function n(e){const t=[];for(const o in e){const n=e[o];if("string"!=typeof n)continue;const r=d(o);t.push(`${r}: ${n};`)}return t.join(" ")}const r=/-([a-z])/g,s=/^--[a-zA-Z0-9-]+$/,i=e=>s.test(e)?e:e.replace(r,((e,t)=>t?t.toUpperCase():"")),a=/\B([A-Z])/g,d=e=>e.replace(a,"-$1").toLowerCase();class c{constructor(...t){this.childNodes=[],this.parentElement=null,this.parentNode=null,this.ELEMENT_NODE=e.NodeType.ELEMENT_NODE,this.TEXT_NODE=e.NodeType.TEXT_NODE}get firstChild(){return this.childNodes[0]||null}get lastChild(){return this.childNodes[this.childNodes.length-1]||null}get nextSibling(){const e=this.parentNode;if(!e)return null;const t=e.childNodes,o=t.indexOf(this);return t[o+1]||null}contains(e){if(e===this)return!0;for(const t of this.childNodes)if(t.contains(e))return!0;return!1}appendChild(e){throw new Error("RRDomException: Failed to execute 'appendChild' on 'RRNode': This RRNode type does not support this method.")}insertBefore(e,t){throw new Error("RRDomException: Failed to execute 'insertBefore' on 'RRNode': This RRNode type does not support this method.")}removeChild(e){throw new Error("RRDomException: Failed to execute 'removeChild' on 'RRNode': This RRNode type does not support this method.")}toString(){return"RRNode"}}function l(o){return class n extends o{constructor(){super(...arguments),this.nodeType=e.NodeType.DOCUMENT_NODE,this.nodeName="#document",this.compatMode="CSS1Compat",this.RRNodeType=t.Document,this.textContent=null}get documentElement(){return this.childNodes.find((e=>e.RRNodeType===t.Element&&"HTML"===e.tagName))||null}get body(){var e;return(null===(e=this.documentElement)||void 0===e?void 0:e.childNodes.find((e=>e.RRNodeType===t.Element&&"BODY"===e.tagName)))||null}get head(){var e;return(null===(e=this.documentElement)||void 0===e?void 0:e.childNodes.find((e=>e.RRNodeType===t.Element&&"HEAD"===e.tagName)))||null}get implementation(){return this}get firstElementChild(){return this.documentElement}appendChild(e){const o=e.RRNodeType;if((o===t.Element||o===t.DocumentType)&&this.childNodes.some((e=>e.RRNodeType===o)))throw new Error(`RRDomException: Failed to execute 'appendChild' on 'RRNode': Only one ${o===t.Element?"RRElement":"RRDoctype"} on RRDocument allowed.`);return e.parentElement=null,e.parentNode=this,this.childNodes.push(e),e}insertBefore(e,o){const n=e.RRNodeType;if((n===t.Element||n===t.DocumentType)&&this.childNodes.some((e=>e.RRNodeType===n)))throw new Error(`RRDomException: Failed to execute 'insertBefore' on 'RRNode': Only one ${n===t.Element?"RRElement":"RRDoctype"} on RRDocument allowed.`);if(null===o)return this.appendChild(e);const r=this.childNodes.indexOf(o);if(-1==r)throw new Error("Failed to execute 'insertBefore' on 'RRNode': The RRNode before which the new node is to be inserted is not a child of this RRNode.");return this.childNodes.splice(r,0,e),e.parentElement=null,e.parentNode=this,e}removeChild(e){const t=this.childNodes.indexOf(e);if(-1===t)throw new Error("Failed to execute 'removeChild' on 'RRDocument': The RRNode to be removed is not a child of this RRNode.");return this.childNodes.splice(t,1),e.parentElement=null,e.parentNode=null,e}open(){this.childNodes=[]}close(){}write(e){let t;if('<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">'===e?t="-//W3C//DTD XHTML 1.0 Transitional//EN":'<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "">'===e&&(t="-//W3C//DTD HTML 4.0 Transitional//EN"),t){const e=this.createDocumentType("html",t,"");this.open(),this.appendChild(e)}}createDocument(e,t,o){return new n}createDocumentType(e,t,o){const n=new(u(c))(e,t,o);return n.ownerDocument=this,n}createElement(e){const t=new(h(c))(e);return t.ownerDocument=this,t}createElementNS(e,t){return this.createElement(t)}createTextNode(e){const t=new(m(c))(e);return t.ownerDocument=this,t}createComment(e){const t=new(N(c))(e);return t.ownerDocument=this,t}createCDATASection(e){const t=new(f(c))(e);return t.ownerDocument=this,t}toString(){return"RRDocument"}}}function u(o){return class extends o{constructor(o,n,r){super(),this.nodeType=e.NodeType.DOCUMENT_TYPE_NODE,this.RRNodeType=t.DocumentType,this.textContent=null,this.name=o,this.publicId=n,this.systemId=r,this.nodeName=o}toString(){return"RRDocumentType"}}}function h(o){return class extends o{constructor(o){super(),this.nodeType=e.NodeType.ELEMENT_NODE,this.RRNodeType=t.Element,this.attributes={},this.shadowRoot=null,this.tagName=o.toUpperCase(),this.nodeName=o.toUpperCase()}get textContent(){let e="";return this.childNodes.forEach((t=>e+=t.textContent)),e}set textContent(e){this.childNodes=[this.ownerDocument.createTextNode(e)]}get classList(){return new R(this.attributes.class,(e=>{this.attributes.class=e}))}get id(){return this.attributes.id||""}get className(){return this.attributes.class||""}get style(){const e=this.attributes.style?function(e){const t={},o=/:(.+)/;return e.replace(/\/\*.*?\*\//g,"").split(/;(?![^(]*\))/g).forEach((function(e){if(e){const n=e.split(o);n.length>1&&(t[i(n[0].trim())]=n[1].trim())}})),t}(this.attributes.style):{},t=/\B([A-Z])/g;return e.setProperty=(o,r,s)=>{if(t.test(o))return;const a=i(o);r?e[a]=r:delete e[a],"important"===s&&(e[a]+=" !important"),this.attributes.style=n(e)},e.removeProperty=o=>{if(t.test(o))return"";const r=i(o),s=e[r]||"";return delete e[r],this.attributes.style=n(e),s},e}getAttribute(e){return this.attributes[e]||null}setAttribute(e,t){this.attributes[e]=t}setAttributeNS(e,t,o){this.setAttribute(t,o)}removeAttribute(e){delete this.attributes[e]}appendChild(e){return this.childNodes.push(e),e.parentNode=this,e.parentElement=this,e}insertBefore(e,t){if(null===t)return this.appendChild(e);const o=this.childNodes.indexOf(t);if(-1==o)throw new Error("Failed to execute 'insertBefore' on 'RRNode': The RRNode before which the new node is to be inserted is not a child of this RRNode.");return this.childNodes.splice(o,0,e),e.parentElement=this,e.parentNode=this,e}removeChild(e){const t=this.childNodes.indexOf(e);if(-1===t)throw new Error("Failed to execute 'removeChild' on 'RRElement': The RRNode to be removed is not a child of this RRNode.");return this.childNodes.splice(t,1),e.parentElement=null,e.parentNode=null,e}attachShadow(e){const t=this.ownerDocument.createElement("SHADOWROOT");return this.shadowRoot=t,t}dispatchEvent(e){return!0}toString(){let e="";for(const t in this.attributes)e+=`${t}="${this.attributes[t]}" `;return`${this.tagName} ${e}`}}}function p(e){return class extends e{attachShadow(e){throw new Error("RRDomException: Failed to execute 'attachShadow' on 'RRElement': This RRElement does not support attachShadow")}play(){this.paused=!1}pause(){this.paused=!0}}}function m(o){return class extends o{constructor(o){super(),this.nodeType=e.NodeType.TEXT_NODE,this.nodeName="#text",this.RRNodeType=t.Text,this.data=o}get textContent(){return this.data}set textContent(e){this.data=e}toString(){return`RRText text=${JSON.stringify(this.data)}`}}}function N(o){return class extends o{constructor(o){super(),this.nodeType=e.NodeType.COMMENT_NODE,this.nodeName="#comment",this.RRNodeType=t.Comment,this.data=o}get textContent(){return this.data}set textContent(e){this.data=e}toString(){return`RRComment text=${JSON.stringify(this.data)}`}}}function f(o){return class extends o{constructor(o){super(),this.nodeName="#cdata-section",this.nodeType=e.NodeType.CDATA_SECTION_NODE,this.RRNodeType=t.CDATA,this.data=o}get textContent(){return this.data}set textContent(e){this.data=e}toString(){return`RRCDATASection data=${JSON.stringify(this.data)}`}}}class R{constructor(e,t){if(this.classes=[],this.add=(...e)=>{for(const t of e){const e=String(t);this.classes.indexOf(e)>=0||this.classes.push(e)}this.onChange&&this.onChange(this.classes.join(" "))},this.remove=(...e)=>{this.classes=this.classes.filter((t=>-1===e.indexOf(t))),this.onChange&&this.onChange(this.classes.join(" "))},e){const t=e.trim().split(/\s+/);this.classes.push(...t)}this.onChange=t}}e.NodeType=void 0,function(e){e[e.PLACEHOLDER=0]="PLACEHOLDER",e[e.ELEMENT_NODE=1]="ELEMENT_NODE",e[e.ATTRIBUTE_NODE=2]="ATTRIBUTE_NODE",e[e.TEXT_NODE=3]="TEXT_NODE",e[e.CDATA_SECTION_NODE=4]="CDATA_SECTION_NODE",e[e.ENTITY_REFERENCE_NODE=5]="ENTITY_REFERENCE_NODE",e[e.ENTITY_NODE=6]="ENTITY_NODE",e[e.PROCESSING_INSTRUCTION_NODE=7]="PROCESSING_INSTRUCTION_NODE",e[e.COMMENT_NODE=8]="COMMENT_NODE",e[e.DOCUMENT_NODE=9]="DOCUMENT_NODE",e[e.DOCUMENT_TYPE_NODE=10]="DOCUMENT_TYPE_NODE",e[e.DOCUMENT_FRAGMENT_NODE=11]="DOCUMENT_FRAGMENT_NODE"}(e.NodeType||(e.NodeType={}));const T={svg:"http://www.w3.org/2000/svg","xlink:href":"http://www.w3.org/1999/xlink",xmlns:"http://www.w3.org/2000/xmlns/"},E={altglyph:"altGlyph",altglyphdef:"altGlyphDef",altglyphitem:"altGlyphItem",animatecolor:"animateColor",animatemotion:"animateMotion",animatetransform:"animateTransform",clippath:"clipPath",feblend:"feBlend",fecolormatrix:"feColorMatrix",fecomponenttransfer:"feComponentTransfer",fecomposite:"feComposite",feconvolvematrix:"feConvolveMatrix",fediffuselighting:"feDiffuseLighting",fedisplacementmap:"feDisplacementMap",fedistantlight:"feDistantLight",fedropshadow:"feDropShadow",feflood:"feFlood",fefunca:"feFuncA",fefuncb:"feFuncB",fefuncg:"feFuncG",fefuncr:"feFuncR",fegaussianblur:"feGaussianBlur",feimage:"feImage",femerge:"feMerge",femergenode:"feMergeNode",femorphology:"feMorphology",feoffset:"feOffset",fepointlight:"fePointLight",fespecularlighting:"feSpecularLighting",fespotlight:"feSpotLight",fetile:"feTile",feturbulence:"feTurbulence",foreignobject:"foreignObject",glyphref:"glyphRef",lineargradient:"linearGradient",radialgradient:"radialGradient"};function y(o,n,r,s){const i=o.childNodes,a=n.childNodes;s=s||n.mirror||n.ownerDocument.mirror,(i.length>0||a.length>0)&&D(Array.from(i),a,o,r,s);let d=null,c=null;switch(n.RRNodeType){case t.Document:c=n.scrollData;break;case t.Element:{const t=o,i=n;switch(function(e,t,o){const n=e.attributes,r=t.attributes;for(const n in r){const s=r[n],i=o.getMeta(t);if(i&&"isSVG"in i&&i.isSVG&&T[n])e.setAttributeNS(T[n],n,s);else if("CANVAS"===t.tagName&&"rr_dataURL"===n){const t=document.createElement("img");t.src=s,t.onload=()=>{const o=e.getContext("2d");o&&o.drawImage(t,0,0,t.width,t.height)}}else e.setAttribute(n,s)}for(const{name:t}of Array.from(n))t in r||e.removeAttribute(t);t.scrollLeft&&(e.scrollLeft=t.scrollLeft),t.scrollTop&&(e.scrollTop=t.scrollTop)}(t,i,s),c=i.scrollData,d=i.inputData,i.tagName){case"AUDIO":case"VIDEO":{const e=o,t=i;void 0!==t.paused&&(t.paused?e.pause():e.play()),void 0!==t.muted&&(e.muted=t.muted),void 0!==t.volume&&(e.volume=t.volume),void 0!==t.currentTime&&(e.currentTime=t.currentTime);break}case"CANVAS":{const e=n;if(null!==e.rr_dataURL){const o=document.createElement("img");o.onload=()=>{const e=t.getContext("2d");e&&e.drawImage(o,0,0,o.width,o.height)},o.src=e.rr_dataURL}e.canvasMutations.forEach((e=>r.applyCanvas(e.event,e.mutation,o)))}break;case"STYLE":!function(t,o){const n=t.sheet;o.forEach((t=>{if(t.type===e.StyleRuleType.Insert)try{if(Array.isArray(t.index)){const{positions:e,index:o}=w(t.index);C(n.cssRules,e).insertRule(t.cssText,o)}else n.insertRule(t.cssText,t.index)}catch(e){}else if(t.type===e.StyleRuleType.Remove)try{if(Array.isArray(t.index)){const{positions:e,index:o}=w(t.index);C(n.cssRules,e).deleteRule(o||0)}else n.deleteRule(t.index)}catch(e){}else if(t.type===e.StyleRuleType.SetProperty){C(n.cssRules,t.index).style.setProperty(t.property,t.value,t.priority)}else if(t.type===e.StyleRuleType.RemoveProperty){C(n.cssRules,t.index).style.removeProperty(t.property)}}))}(t,n.rules)}if(i.shadowRoot){t.shadowRoot||t.attachShadow({mode:"open"});const e=t.shadowRoot.childNodes,o=i.shadowRoot.childNodes;(e.length>0||o.length>0)&&D(Array.from(e),o,t.shadowRoot,r,s)}break}case t.Text:case t.Comment:case t.CDATA:o.textContent!==n.data&&(o.textContent=n.data)}if(c&&r.applyScroll(c,!0),d&&r.applyInput(d),"IFRAME"===n.nodeName){const e=o.contentDocument,t=n;if(e){const o=s.getMeta(t.contentDocument);o&&r.mirror.add(e,Object.assign({},o)),y(e,t.contentDocument,r,s)}}}function D(e,o,n,r,s){var i;let a,d,c=0,l=e.length-1,u=0,h=o.length-1,p=e[c],m=e[l],N=o[u],f=o[h];for(;c<=l&&u<=h;)if(void 0===p)p=e[++c];else if(void 0===m)m=e[--l];else if(r.mirror.getId(p)===s.getId(N))y(p,N,r,s),p=e[++c],N=o[++u];else if(r.mirror.getId(m)===s.getId(f))y(m,f,r,s),m=e[--l],f=o[--h];else if(r.mirror.getId(p)===s.getId(f))n.insertBefore(p,m.nextSibling),y(p,f,r,s),p=e[++c],f=o[--h];else if(r.mirror.getId(m)===s.getId(N))n.insertBefore(m,p),y(m,N,r,s),m=e[--l],N=o[++u];else{if(!a){a={};for(let t=c;t<=l;t++){const o=e[t];o&&r.mirror.hasNode(o)&&(a[r.mirror.getId(o)]=t)}}if(d=a[s.getId(N)],d){const t=e[d];n.insertBefore(t,p),y(t,N,r,s),e[d]=void 0}else{const o=g(N,r.mirror,s);"#document"===n.nodeName&&(null===(i=r.mirror.getMeta(o))||void 0===i?void 0:i.type)===t.Element&&n.documentElement&&(n.removeChild(n.documentElement),e[c]=void 0,p=void 0),n.insertBefore(o,p||null),y(o,N,r,s)}N=o[++u]}if(c>l){const e=o[h+1];let t=null;for(e&&n.childNodes.forEach((o=>{r.mirror.getId(o)===s.getId(e)&&(t=o)}));u<=h;++u){const e=g(o[u],r.mirror,s);n.insertBefore(e,t),y(e,o[u],r,s)}}else if(u>h)for(;c<=l;c++){const t=e[c];t&&(n.removeChild(t),r.mirror.removeNodeFromMap(t))}}function g(e,o,n){let r=o.getNode(n.getId(e));const s=n.getMeta(e);if(null!==r)return r;switch(e.RRNodeType){case t.Document:r=new Document;break;case t.DocumentType:r=document.implementation.createDocumentType(e.name,e.publicId,e.systemId);break;case t.Element:{let t=e.tagName.toLowerCase();t=E[t]||t,r=s&&"isSVG"in s&&(null==s?void 0:s.isSVG)?document.createElementNS(T.svg,t):document.createElement(e.tagName);break}case t.Text:r=document.createTextNode(e.data);break;case t.Comment:r=document.createComment(e.data);break;case t.CDATA:r=document.createCDATASection(e.data)}return s&&o.add(r,Object.assign({},s)),r}function C(e,t){const o=e[t[0]];return 1===t.length?o:C(o.cssRules[t[1]].cssRules,t.slice(2))}var M;function w(e){const t=[...e],o=t.pop();return{positions:t,index:o}}e.StyleRuleType=void 0,(M=e.StyleRuleType||(e.StyleRuleType={}))[M.Insert=0]="Insert",M[M.Remove=1]="Remove",M[M.Snapshot=2]="Snapshot",M[M.SetProperty=3]="SetProperty",M[M.RemoveProperty=4]="RemoveProperty";class O extends(l(c)){constructor(e){super(),this._unserializedId=-1,this.mirror=B(),this.scrollData=null,e&&(this.mirror=e)}get unserializedId(){return this._unserializedId--}createDocument(e,t,o){return new O}createDocumentType(e,t,o){const n=new x(e,t,o);return n.ownerDocument=this,n}createElement(e){const t=e.toUpperCase();let o;switch(t){case"AUDIO":case"VIDEO":o=new A(t);break;case"IFRAME":o=new S(t,this.mirror);break;case"CANVAS":o=new I(t);break;case"STYLE":o=new b(t);break;default:o=new v(t)}return o.ownerDocument=this,o}createComment(e){const t=new L(e);return t.ownerDocument=this,t}createCDATASection(e){const t=new F(e);return t.ownerDocument=this,t}createTextNode(e){const t=new _(e);return t.ownerDocument=this,t}destroyTree(){this.childNodes=[],this.mirror.reset()}open(){super.open(),this._unserializedId=-1}}const x=u(c);class v extends(h(c)){constructor(){super(...arguments),this.inputData=null,this.scrollData=null}}class A extends(p(v)){}class I extends v{constructor(){super(...arguments),this.rr_dataURL=null,this.canvasMutations=[]}getContext(){return null}}class b extends v{constructor(){super(...arguments),this.rules=[]}}class S extends v{constructor(e,t){super(e),this.contentDocument=new O,this.contentDocument.mirror=t}}const _=m(c),L=N(c),F=f(c);function U(t,o,n,r){let s;switch(t.nodeType){case e.NodeType.DOCUMENT_NODE:r&&"IFRAME"===r.nodeName?s=r.contentDocument:(s=o,s.compatMode=t.compatMode);break;case e.NodeType.DOCUMENT_TYPE_NODE:{const e=t;s=o.createDocumentType(e.name,e.publicId,e.systemId);break}case e.NodeType.ELEMENT_NODE:{const e=t,n=(i=e)instanceof HTMLFormElement?"FORM":i.tagName.toUpperCase();s=o.createElement(n);const r=s;for(const{name:t,value:o}of Array.from(e.attributes))r.attributes[t]=o;e.scrollLeft&&(r.scrollLeft=e.scrollLeft),e.scrollTop&&(r.scrollTop=e.scrollTop);break}case e.NodeType.TEXT_NODE:s=o.createTextNode(t.textContent||"");break;case e.NodeType.CDATA_SECTION_NODE:s=o.createCDATASection(t.data);break;case e.NodeType.COMMENT_NODE:s=o.createComment(t.textContent||"");break;case e.NodeType.DOCUMENT_FRAGMENT_NODE:s=r.attachShadow({mode:"open"});break;default:return null}var i;let a=n.getMeta(t);return o instanceof O&&(a||(a=P(s,o.unserializedId),n.add(t,a)),o.mirror.add(s,Object.assign({},a))),s}function B(){return new k}class k{constructor(){this.idNodeMap=new Map,this.nodeMetaMap=new WeakMap}getId(e){var t;if(!e)return-1;const o=null===(t=this.getMeta(e))||void 0===t?void 0:t.id;return null!=o?o:-1}getNode(e){return this.idNodeMap.get(e)||null}getIds(){return Array.from(this.idNodeMap.keys())}getMeta(e){return this.nodeMetaMap.get(e)||null}removeNodeFromMap(e){const t=this.getId(e);this.idNodeMap.delete(t),e.childNodes&&e.childNodes.forEach((e=>this.removeNodeFromMap(e)))}has(e){return this.idNodeMap.has(e)}hasNode(e){return this.nodeMetaMap.has(e)}add(e,t){const o=t.id;this.idNodeMap.set(o,e),this.nodeMetaMap.set(e,t)}replace(e,t){this.idNodeMap.set(e,t)}reset(){this.idNodeMap=new Map,this.nodeMetaMap=new WeakMap}}function P(e,o){switch(e.RRNodeType){case t.Document:return{id:o,type:e.RRNodeType,childNodes:[]};case t.DocumentType:{const t=e;return{id:o,type:e.RRNodeType,name:t.name,publicId:t.publicId,systemId:t.systemId}}case t.Element:return{id:o,type:e.RRNodeType,tagName:e.tagName.toLowerCase(),attributes:{},childNodes:[]};case t.Text:case t.Comment:return{id:o,type:e.RRNodeType,textContent:e.textContent||""};case t.CDATA:return{id:o,type:e.RRNodeType,textContent:""}}}function G(e,o,n){let r=`${n}${o.getId(e)} ${e.toString()}\n`;if(e.RRNodeType===t.Element){const t=e;t.shadowRoot&&(r+=G(t.shadowRoot,o,n+"  "))}for(const t of e.childNodes)r+=G(t,o,n+"  ");return"IFRAME"===e.nodeName&&(r+=G(e.contentDocument,o,n+"  ")),r}return e.BaseRRCDATASectionImpl=f,e.BaseRRCommentImpl=N,e.BaseRRDocumentImpl=l,e.BaseRRDocumentTypeImpl=u,e.BaseRRElementImpl=h,e.BaseRRMediaElementImpl=p,e.BaseRRNode=c,e.BaseRRTextImpl=m,e.ClassList=R,e.Mirror=k,e.RRCDATASection=F,e.RRCanvasElement=I,e.RRComment=L,e.RRDocument=O,e.RRDocumentType=x,e.RRElement=v,e.RRIFrameElement=S,e.RRMediaElement=A,e.RRNode=c,e.RRStyleElement=b,e.RRText=_,e.buildFromDom=function(t,n=function(){return new o}(),r=new O){return function t(o,s){const i=U(o,r,n,s);null!==i&&("IFRAME"!==(null==s?void 0:s.nodeName)&&o.nodeType!==e.NodeType.DOCUMENT_FRAGMENT_NODE&&(null==s||s.appendChild(i),i.parentNode=s,i.parentElement=s),"IFRAME"===o.nodeName?t(o.contentDocument,i):o.nodeType!==e.NodeType.DOCUMENT_NODE&&o.nodeType!==e.NodeType.ELEMENT_NODE&&o.nodeType!==e.NodeType.DOCUMENT_FRAGMENT_NODE||(o.nodeType===e.NodeType.ELEMENT_NODE&&o.shadowRoot&&t(o.shadowRoot,i),o.childNodes.forEach((e=>t(e,i)))))}(t,null),r},e.buildFromNode=U,e.createMirror=B,e.createOrGetNode=g,e.diff=y,e.getDefaultSN=P,e.printRRDom=function(e,t){return G(e,t,"")},Object.defineProperty(e,"__esModule",{value:!0}),e}({});
 //# sourceMappingURL=rrdom.min.js.map

es/index.d.ts

@@ -254,2 +254,3 @@ import { NodeType as RRNodeType } from 'rrweb-snapshot';
 export declare class RRCanvasElement extends RRElement implements IRRElement {
+    rr_dataURL: string | null;
     canvasMutations: {
@@ -256,0 +257,0 @@ event: canvasEventWithTime;

es/rrdom.js

@@ -599,3 +599,16 @@ var NodeType$1;
                 case 'CANVAS':
-                    newTree.canvasMutations.forEach((canvasMutation) => replayer.applyCanvas(canvasMutation.event, canvasMutation.mutation, oldTree));
+                    {
+                        const rrCanvasElement = newTree;
+                        if (rrCanvasElement.rr_dataURL !== null) {
+                            const image = document.createElement('img');
+                            image.onload = () => {
+                                const ctx = oldElement.getContext('2d');
+                                if (ctx) {
+                                    ctx.drawImage(image, 0, 0, image.width, image.height);
+                                }
+                            };
+                            image.src = rrCanvasElement.rr_dataURL;
+                        }
+                        rrCanvasElement.canvasMutations.forEach((canvasMutation) => replayer.applyCanvas(canvasMutation.event, canvasMutation.mutation, oldTree));
+                    }
                     break;
@@ -936,2 +949,3 @@ case 'STYLE':
         super(...arguments);
+        this.rr_dataURL = null;
         this.canvasMutations = [];
@@ -938,0 +952,0 @@ }

es/rrdom.min.js

@@ -1,2 +0,2 @@
-var e;!function(e){e[e.Document=0]="Document",e[e.DocumentType=1]="DocumentType",e[e.Element=2]="Element",e[e.Text=3]="Text",e[e.CDATA=4]="CDATA",e[e.Comment=5]="Comment"}(e||(e={}));var t=function(){function e(){this.idNodeMap=new Map,this.nodeMetaMap=new WeakMap}return e.prototype.getId=function(e){var t;if(!e)return-1;var n=null===(t=this.getMeta(e))||void 0===t?void 0:t.id;return null!=n?n:-1},e.prototype.getNode=function(e){return this.idNodeMap.get(e)||null},e.prototype.getIds=function(){return Array.from(this.idNodeMap.keys())},e.prototype.getMeta=function(e){return this.nodeMetaMap.get(e)||null},e.prototype.removeNodeFromMap=function(e){var t=this,n=this.getId(e);this.idNodeMap.delete(n),e.childNodes&&e.childNodes.forEach((function(e){return t.removeNodeFromMap(e)}))},e.prototype.has=function(e){return this.idNodeMap.has(e)},e.prototype.hasNode=function(e){return this.nodeMetaMap.has(e)},e.prototype.add=function(e,t){var n=t.id;this.idNodeMap.set(n,e),this.nodeMetaMap.set(e,t)},e.prototype.replace=function(e,t){this.idNodeMap.set(e,t)},e.prototype.reset=function(){this.idNodeMap=new Map,this.nodeMetaMap=new WeakMap},e}();function n(e){const t=[];for(const n in e){const o=e[n];if("string"!=typeof o)continue;const r=a(n);t.push(`${r}: ${o};`)}return t.join(" ")}const o=/-([a-z])/g,r=/^--[a-zA-Z0-9-]+$/,s=e=>r.test(e)?e:e.replace(o,((e,t)=>t?t.toUpperCase():"")),i=/\B([A-Z])/g,a=e=>e.replace(i,"-$1").toLowerCase();class d{constructor(...e){this.childNodes=[],this.parentElement=null,this.parentNode=null,this.ELEMENT_NODE=E.ELEMENT_NODE,this.TEXT_NODE=E.TEXT_NODE}get firstChild(){return this.childNodes[0]||null}get lastChild(){return this.childNodes[this.childNodes.length-1]||null}get nextSibling(){const e=this.parentNode;if(!e)return null;const t=e.childNodes,n=t.indexOf(this);return t[n+1]||null}contains(e){if(e===this)return!0;for(const t of this.childNodes)if(t.contains(e))return!0;return!1}appendChild(e){throw new Error("RRDomException: Failed to execute 'appendChild' on 'RRNode': This RRNode type does not support this method.")}insertBefore(e,t){throw new Error("RRDomException: Failed to execute 'insertBefore' on 'RRNode': This RRNode type does not support this method.")}removeChild(e){throw new Error("RRDomException: Failed to execute 'removeChild' on 'RRNode': This RRNode type does not support this method.")}toString(){return"RRNode"}}function c(t){return class n extends t{constructor(){super(...arguments),this.nodeType=E.DOCUMENT_NODE,this.nodeName="#document",this.compatMode="CSS1Compat",this.RRNodeType=e.Document,this.textContent=null}get documentElement(){return this.childNodes.find((t=>t.RRNodeType===e.Element&&"HTML"===t.tagName))||null}get body(){var t;return(null===(t=this.documentElement)||void 0===t?void 0:t.childNodes.find((t=>t.RRNodeType===e.Element&&"BODY"===t.tagName)))||null}get head(){var t;return(null===(t=this.documentElement)||void 0===t?void 0:t.childNodes.find((t=>t.RRNodeType===e.Element&&"HEAD"===t.tagName)))||null}get implementation(){return this}get firstElementChild(){return this.documentElement}appendChild(t){const n=t.RRNodeType;if((n===e.Element||n===e.DocumentType)&&this.childNodes.some((e=>e.RRNodeType===n)))throw new Error(`RRDomException: Failed to execute 'appendChild' on 'RRNode': Only one ${n===e.Element?"RRElement":"RRDoctype"} on RRDocument allowed.`);return t.parentElement=null,t.parentNode=this,this.childNodes.push(t),t}insertBefore(t,n){const o=t.RRNodeType;if((o===e.Element||o===e.DocumentType)&&this.childNodes.some((e=>e.RRNodeType===o)))throw new Error(`RRDomException: Failed to execute 'insertBefore' on 'RRNode': Only one ${o===e.Element?"RRElement":"RRDoctype"} on RRDocument allowed.`);if(null===n)return this.appendChild(t);const r=this.childNodes.indexOf(n);if(-1==r)throw new Error("Failed to execute 'insertBefore' on 'RRNode': The RRNode before which the new node is to be inserted is not a child of this RRNode.");return this.childNodes.splice(r,0,t),t.parentElement=null,t.parentNode=this,t}removeChild(e){const t=this.childNodes.indexOf(e);if(-1===t)throw new Error("Failed to execute 'removeChild' on 'RRDocument': The RRNode to be removed is not a child of this RRNode.");return this.childNodes.splice(t,1),e.parentElement=null,e.parentNode=null,e}open(){this.childNodes=[]}close(){}write(e){let t;if('<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">'===e?t="-//W3C//DTD XHTML 1.0 Transitional//EN":'<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "">'===e&&(t="-//W3C//DTD HTML 4.0 Transitional//EN"),t){const e=this.createDocumentType("html",t,"");this.open(),this.appendChild(e)}}createDocument(e,t,o){return new n}createDocumentType(e,t,n){const o=new(l(d))(e,t,n);return o.ownerDocument=this,o}createElement(e){const t=new(u(d))(e);return t.ownerDocument=this,t}createElementNS(e,t){return this.createElement(t)}createTextNode(e){const t=new(p(d))(e);return t.ownerDocument=this,t}createComment(e){const t=new(m(d))(e);return t.ownerDocument=this,t}createCDATASection(e){const t=new(N(d))(e);return t.ownerDocument=this,t}toString(){return"RRDocument"}}}function l(t){return class extends t{constructor(t,n,o){super(),this.nodeType=E.DOCUMENT_TYPE_NODE,this.RRNodeType=e.DocumentType,this.textContent=null,this.name=t,this.publicId=n,this.systemId=o,this.nodeName=t}toString(){return"RRDocumentType"}}}function u(t){return class extends t{constructor(t){super(),this.nodeType=E.ELEMENT_NODE,this.RRNodeType=e.Element,this.attributes={},this.shadowRoot=null,this.tagName=t.toUpperCase(),this.nodeName=t.toUpperCase()}get textContent(){let e="";return this.childNodes.forEach((t=>e+=t.textContent)),e}set textContent(e){this.childNodes=[this.ownerDocument.createTextNode(e)]}get classList(){return new f(this.attributes.class,(e=>{this.attributes.class=e}))}get id(){return this.attributes.id||""}get className(){return this.attributes.class||""}get style(){const e=this.attributes.style?function(e){const t={},n=/:(.+)/;return e.replace(/\/\*.*?\*\//g,"").split(/;(?![^(]*\))/g).forEach((function(e){if(e){const o=e.split(n);o.length>1&&(t[s(o[0].trim())]=o[1].trim())}})),t}(this.attributes.style):{},t=/\B([A-Z])/g;return e.setProperty=(o,r,i)=>{if(t.test(o))return;const a=s(o);r?e[a]=r:delete e[a],"important"===i&&(e[a]+=" !important"),this.attributes.style=n(e)},e.removeProperty=o=>{if(t.test(o))return"";const r=s(o),i=e[r]||"";return delete e[r],this.attributes.style=n(e),i},e}getAttribute(e){return this.attributes[e]||null}setAttribute(e,t){this.attributes[e]=t}setAttributeNS(e,t,n){this.setAttribute(t,n)}removeAttribute(e){delete this.attributes[e]}appendChild(e){return this.childNodes.push(e),e.parentNode=this,e.parentElement=this,e}insertBefore(e,t){if(null===t)return this.appendChild(e);const n=this.childNodes.indexOf(t);if(-1==n)throw new Error("Failed to execute 'insertBefore' on 'RRNode': The RRNode before which the new node is to be inserted is not a child of this RRNode.");return this.childNodes.splice(n,0,e),e.parentElement=this,e.parentNode=this,e}removeChild(e){const t=this.childNodes.indexOf(e);if(-1===t)throw new Error("Failed to execute 'removeChild' on 'RRElement': The RRNode to be removed is not a child of this RRNode.");return this.childNodes.splice(t,1),e.parentElement=null,e.parentNode=null,e}attachShadow(e){const t=this.ownerDocument.createElement("SHADOWROOT");return this.shadowRoot=t,t}dispatchEvent(e){return!0}toString(){let e="";for(const t in this.attributes)e+=`${t}="${this.attributes[t]}" `;return`${this.tagName} ${e}`}}}function h(e){return class extends e{attachShadow(e){throw new Error("RRDomException: Failed to execute 'attachShadow' on 'RRElement': This RRElement does not support attachShadow")}play(){this.paused=!1}pause(){this.paused=!0}}}function p(t){return class extends t{constructor(t){super(),this.nodeType=E.TEXT_NODE,this.nodeName="#text",this.RRNodeType=e.Text,this.data=t}get textContent(){return this.data}set textContent(e){this.data=e}toString(){return`RRText text=${JSON.stringify(this.data)}`}}}function m(t){return class extends t{constructor(t){super(),this.nodeType=E.COMMENT_NODE,this.nodeName="#comment",this.RRNodeType=e.Comment,this.data=t}get textContent(){return this.data}set textContent(e){this.data=e}toString(){return`RRComment text=${JSON.stringify(this.data)}`}}}function N(t){return class extends t{constructor(t){super(),this.nodeName="#cdata-section",this.nodeType=E.CDATA_SECTION_NODE,this.RRNodeType=e.CDATA,this.data=t}get textContent(){return this.data}set textContent(e){this.data=e}toString(){return`RRCDATASection data=${JSON.stringify(this.data)}`}}}class f{constructor(e,t){if(this.classes=[],this.add=(...e)=>{for(const t of e){const e=String(t);this.classes.indexOf(e)>=0||this.classes.push(e)}this.onChange&&this.onChange(this.classes.join(" "))},this.remove=(...e)=>{this.classes=this.classes.filter((t=>-1===e.indexOf(t))),this.onChange&&this.onChange(this.classes.join(" "))},e){const t=e.trim().split(/\s+/);this.classes.push(...t)}this.onChange=t}}var E;!function(e){e[e.PLACEHOLDER=0]="PLACEHOLDER",e[e.ELEMENT_NODE=1]="ELEMENT_NODE",e[e.ATTRIBUTE_NODE=2]="ATTRIBUTE_NODE",e[e.TEXT_NODE=3]="TEXT_NODE",e[e.CDATA_SECTION_NODE=4]="CDATA_SECTION_NODE",e[e.ENTITY_REFERENCE_NODE=5]="ENTITY_REFERENCE_NODE",e[e.ENTITY_NODE=6]="ENTITY_NODE",e[e.PROCESSING_INSTRUCTION_NODE=7]="PROCESSING_INSTRUCTION_NODE",e[e.COMMENT_NODE=8]="COMMENT_NODE",e[e.DOCUMENT_NODE=9]="DOCUMENT_NODE",e[e.DOCUMENT_TYPE_NODE=10]="DOCUMENT_TYPE_NODE",e[e.DOCUMENT_FRAGMENT_NODE=11]="DOCUMENT_FRAGMENT_NODE"}(E||(E={}));const T={svg:"http://www.w3.org/2000/svg","xlink:href":"http://www.w3.org/1999/xlink",xmlns:"http://www.w3.org/2000/xmlns/"},R={altglyph:"altGlyph",altglyphdef:"altGlyphDef",altglyphitem:"altGlyphItem",animatecolor:"animateColor",animatemotion:"animateMotion",animatetransform:"animateTransform",clippath:"clipPath",feblend:"feBlend",fecolormatrix:"feColorMatrix",fecomponenttransfer:"feComponentTransfer",fecomposite:"feComposite",feconvolvematrix:"feConvolveMatrix",fediffuselighting:"feDiffuseLighting",fedisplacementmap:"feDisplacementMap",fedistantlight:"feDistantLight",fedropshadow:"feDropShadow",feflood:"feFlood",fefunca:"feFuncA",fefuncb:"feFuncB",fefuncg:"feFuncG",fefuncr:"feFuncR",fegaussianblur:"feGaussianBlur",feimage:"feImage",femerge:"feMerge",femergenode:"feMergeNode",femorphology:"feMorphology",feoffset:"feOffset",fepointlight:"fePointLight",fespecularlighting:"feSpecularLighting",fespotlight:"feSpotLight",fetile:"feTile",feturbulence:"feTurbulence",foreignobject:"foreignObject",glyphref:"glyphRef",lineargradient:"linearGradient",radialgradient:"radialGradient"};function D(t,n,o,r){const s=t.childNodes,i=n.childNodes;r=r||n.mirror||n.ownerDocument.mirror,(s.length>0||i.length>0)&&g(Array.from(s),i,t,o,r);let a=null,d=null;switch(n.RRNodeType){case e.Document:d=n.scrollData;break;case e.Element:{const e=t,s=n;switch(function(e,t,n){const o=e.attributes,r=t.attributes;for(const o in r){const s=r[o],i=n.getMeta(t);if(i&&"isSVG"in i&&i.isSVG&&T[o])e.setAttributeNS(T[o],o,s);else if("CANVAS"===t.tagName&&"rr_dataURL"===o){const t=document.createElement("img");t.src=s,t.onload=()=>{const n=e.getContext("2d");n&&n.drawImage(t,0,0,t.width,t.height)}}else e.setAttribute(o,s)}for(const{name:t}of Array.from(o))t in r||e.removeAttribute(t);t.scrollLeft&&(e.scrollLeft=t.scrollLeft),t.scrollTop&&(e.scrollTop=t.scrollTop)}(e,s,r),d=s.scrollData,a=s.inputData,s.tagName){case"AUDIO":case"VIDEO":{const e=t,n=s;void 0!==n.paused&&(n.paused?e.pause():e.play()),void 0!==n.muted&&(e.muted=n.muted),void 0!==n.volume&&(e.volume=n.volume),void 0!==n.currentTime&&(e.currentTime=n.currentTime);break}case"CANVAS":n.canvasMutations.forEach((e=>o.applyCanvas(e.event,e.mutation,t)));break;case"STYLE":!function(e,t){const n=e.sheet;t.forEach((e=>{if(e.type===M.Insert)try{if(Array.isArray(e.index)){const{positions:t,index:o}=w(e.index);C(n.cssRules,t).insertRule(e.cssText,o)}else n.insertRule(e.cssText,e.index)}catch(e){}else if(e.type===M.Remove)try{if(Array.isArray(e.index)){const{positions:t,index:o}=w(e.index);C(n.cssRules,t).deleteRule(o||0)}else n.deleteRule(e.index)}catch(e){}else if(e.type===M.SetProperty){C(n.cssRules,e.index).style.setProperty(e.property,e.value,e.priority)}else if(e.type===M.RemoveProperty){C(n.cssRules,e.index).style.removeProperty(e.property)}}))}(e,n.rules)}if(s.shadowRoot){e.shadowRoot||e.attachShadow({mode:"open"});const t=e.shadowRoot.childNodes,n=s.shadowRoot.childNodes;(t.length>0||n.length>0)&&g(Array.from(t),n,e.shadowRoot,o,r)}break}case e.Text:case e.Comment:case e.CDATA:t.textContent!==n.data&&(t.textContent=n.data)}if(d&&o.applyScroll(d,!0),a&&o.applyInput(a),"IFRAME"===n.nodeName){const e=t.contentDocument,s=n;if(e){const t=r.getMeta(s.contentDocument);t&&o.mirror.add(e,Object.assign({},t)),D(e,s.contentDocument,o,r)}}}function g(t,n,o,r,s){var i;let a,d,c=0,l=t.length-1,u=0,h=n.length-1,p=t[c],m=t[l],N=n[u],f=n[h];for(;c<=l&&u<=h;)if(void 0===p)p=t[++c];else if(void 0===m)m=t[--l];else if(r.mirror.getId(p)===s.getId(N))D(p,N,r,s),p=t[++c],N=n[++u];else if(r.mirror.getId(m)===s.getId(f))D(m,f,r,s),m=t[--l],f=n[--h];else if(r.mirror.getId(p)===s.getId(f))o.insertBefore(p,m.nextSibling),D(p,f,r,s),p=t[++c],f=n[--h];else if(r.mirror.getId(m)===s.getId(N))o.insertBefore(m,p),D(m,N,r,s),m=t[--l],N=n[++u];else{if(!a){a={};for(let e=c;e<=l;e++){const n=t[e];n&&r.mirror.hasNode(n)&&(a[r.mirror.getId(n)]=e)}}if(d=a[s.getId(N)],d){const e=t[d];o.insertBefore(e,p),D(e,N,r,s),t[d]=void 0}else{const n=y(N,r.mirror,s);"#document"===o.nodeName&&(null===(i=r.mirror.getMeta(n))||void 0===i?void 0:i.type)===e.Element&&o.documentElement&&(o.removeChild(o.documentElement),t[c]=void 0,p=void 0),o.insertBefore(n,p||null),D(n,N,r,s)}N=n[++u]}if(c>l){const e=n[h+1];let t=null;for(e&&o.childNodes.forEach((n=>{r.mirror.getId(n)===s.getId(e)&&(t=n)}));u<=h;++u){const e=y(n[u],r.mirror,s);o.insertBefore(e,t),D(e,n[u],r,s)}}else if(u>h)for(;c<=l;c++){const e=t[c];e&&(o.removeChild(e),r.mirror.removeNodeFromMap(e))}}function y(t,n,o){let r=n.getNode(o.getId(t));const s=o.getMeta(t);if(null!==r)return r;switch(t.RRNodeType){case e.Document:r=new Document;break;case e.DocumentType:r=document.implementation.createDocumentType(t.name,t.publicId,t.systemId);break;case e.Element:{let e=t.tagName.toLowerCase();e=R[e]||e,r=s&&"isSVG"in s&&(null==s?void 0:s.isSVG)?document.createElementNS(T.svg,e):document.createElement(t.tagName);break}case e.Text:r=document.createTextNode(t.data);break;case e.Comment:r=document.createComment(t.data);break;case e.CDATA:r=document.createCDATASection(t.data)}return s&&n.add(r,Object.assign({},s)),r}function C(e,t){const n=e[t[0]];return 1===t.length?n:C(n.cssRules[t[1]].cssRules,t.slice(2))}var M;function w(e){const t=[...e],n=t.pop();return{positions:t,index:n}}!function(e){e[e.Insert=0]="Insert",e[e.Remove=1]="Remove",e[e.Snapshot=2]="Snapshot",e[e.SetProperty=3]="SetProperty",e[e.RemoveProperty=4]="RemoveProperty"}(M||(M={}));class O extends(c(d)){constructor(e){super(),this._unserializedId=-1,this.mirror=P(),this.scrollData=null,e&&(this.mirror=e)}get unserializedId(){return this._unserializedId--}createDocument(e,t,n){return new O}createDocumentType(e,t,n){const o=new x(e,t,n);return o.ownerDocument=this,o}createElement(e){const t=e.toUpperCase();let n;switch(t){case"AUDIO":case"VIDEO":n=new A(t);break;case"IFRAME":n=new _(t,this.mirror);break;case"CANVAS":n=new b(t);break;case"STYLE":n=new I(t);break;default:n=new v(t)}return n.ownerDocument=this,n}createComment(e){const t=new L(e);return t.ownerDocument=this,t}createCDATASection(e){const t=new F(e);return t.ownerDocument=this,t}createTextNode(e){const t=new S(e);return t.ownerDocument=this,t}destroyTree(){this.childNodes=[],this.mirror.reset()}open(){super.open(),this._unserializedId=-1}}const x=l(d);class v extends(u(d)){constructor(){super(...arguments),this.inputData=null,this.scrollData=null}}class A extends(h(v)){}class b extends v{constructor(){super(...arguments),this.canvasMutations=[]}getContext(){return null}}class I extends v{constructor(){super(...arguments),this.rules=[]}}class _ extends v{constructor(e,t){super(e),this.contentDocument=new O,this.contentDocument.mirror=t}}const S=p(d),L=m(d),F=N(d);function k(e,t,n,o){let r;switch(e.nodeType){case E.DOCUMENT_NODE:o&&"IFRAME"===o.nodeName?r=o.contentDocument:(r=t,r.compatMode=e.compatMode);break;case E.DOCUMENT_TYPE_NODE:{const n=e;r=t.createDocumentType(n.name,n.publicId,n.systemId);break}case E.ELEMENT_NODE:{const n=e,o=(s=n)instanceof HTMLFormElement?"FORM":s.tagName.toUpperCase();r=t.createElement(o);const i=r;for(const{name:e,value:t}of Array.from(n.attributes))i.attributes[e]=t;n.scrollLeft&&(i.scrollLeft=n.scrollLeft),n.scrollTop&&(i.scrollTop=n.scrollTop);break}case E.TEXT_NODE:r=t.createTextNode(e.textContent||"");break;case E.CDATA_SECTION_NODE:r=t.createCDATASection(e.data);break;case E.COMMENT_NODE:r=t.createComment(e.textContent||"");break;case E.DOCUMENT_FRAGMENT_NODE:r=o.attachShadow({mode:"open"});break;default:return null}var s;let i=n.getMeta(e);return t instanceof O&&(i||(i=G(r,t.unserializedId),n.add(e,i)),t.mirror.add(r,Object.assign({},i))),r}function U(e,n=function(){return new t}(),o=new O){return function e(t,r){const s=k(t,o,n,r);null!==s&&("IFRAME"!==(null==r?void 0:r.nodeName)&&t.nodeType!==E.DOCUMENT_FRAGMENT_NODE&&(null==r||r.appendChild(s),s.parentNode=r,s.parentElement=r),"IFRAME"===t.nodeName?e(t.contentDocument,s):t.nodeType!==E.DOCUMENT_NODE&&t.nodeType!==E.ELEMENT_NODE&&t.nodeType!==E.DOCUMENT_FRAGMENT_NODE||(t.nodeType===E.ELEMENT_NODE&&t.shadowRoot&&e(t.shadowRoot,s),t.childNodes.forEach((t=>e(t,s)))))}(e,null),o}function P(){return new B}class B{constructor(){this.idNodeMap=new Map,this.nodeMetaMap=new WeakMap}getId(e){var t;if(!e)return-1;const n=null===(t=this.getMeta(e))||void 0===t?void 0:t.id;return null!=n?n:-1}getNode(e){return this.idNodeMap.get(e)||null}getIds(){return Array.from(this.idNodeMap.keys())}getMeta(e){return this.nodeMetaMap.get(e)||null}removeNodeFromMap(e){const t=this.getId(e);this.idNodeMap.delete(t),e.childNodes&&e.childNodes.forEach((e=>this.removeNodeFromMap(e)))}has(e){return this.idNodeMap.has(e)}hasNode(e){return this.nodeMetaMap.has(e)}add(e,t){const n=t.id;this.idNodeMap.set(n,e),this.nodeMetaMap.set(e,t)}replace(e,t){this.idNodeMap.set(e,t)}reset(){this.idNodeMap=new Map,this.nodeMetaMap=new WeakMap}}function G(t,n){switch(t.RRNodeType){case e.Document:return{id:n,type:t.RRNodeType,childNodes:[]};case e.DocumentType:{const e=t;return{id:n,type:t.RRNodeType,name:e.name,publicId:e.publicId,systemId:e.systemId}}case e.Element:return{id:n,type:t.RRNodeType,tagName:t.tagName.toLowerCase(),attributes:{},childNodes:[]};case e.Text:case e.Comment:return{id:n,type:t.RRNodeType,textContent:t.textContent||""};case e.CDATA:return{id:n,type:t.RRNodeType,textContent:""}}}function $(e,t){return Y(e,t,"")}function Y(t,n,o){let r=`${o}${n.getId(t)} ${t.toString()}\n`;if(t.RRNodeType===e.Element){const e=t;e.shadowRoot&&(r+=Y(e.shadowRoot,n,o+"  "))}for(const e of t.childNodes)r+=Y(e,n,o+"  ");return"IFRAME"===t.nodeName&&(r+=Y(t.contentDocument,n,o+"  ")),r}export{N as BaseRRCDATASectionImpl,m as BaseRRCommentImpl,c as BaseRRDocumentImpl,l as BaseRRDocumentTypeImpl,u as BaseRRElementImpl,h as BaseRRMediaElementImpl,d as BaseRRNode,p as BaseRRTextImpl,f as ClassList,B as Mirror,E as NodeType,F as RRCDATASection,b as RRCanvasElement,L as RRComment,O as RRDocument,x as RRDocumentType,v as RRElement,_ as RRIFrameElement,A as RRMediaElement,d as RRNode,I as RRStyleElement,S as RRText,M as StyleRuleType,U as buildFromDom,k as buildFromNode,P as createMirror,y as createOrGetNode,D as diff,G as getDefaultSN,$ as printRRDom};
+var e;!function(e){e[e.Document=0]="Document",e[e.DocumentType=1]="DocumentType",e[e.Element=2]="Element",e[e.Text=3]="Text",e[e.CDATA=4]="CDATA",e[e.Comment=5]="Comment"}(e||(e={}));var t=function(){function e(){this.idNodeMap=new Map,this.nodeMetaMap=new WeakMap}return e.prototype.getId=function(e){var t;if(!e)return-1;var n=null===(t=this.getMeta(e))||void 0===t?void 0:t.id;return null!=n?n:-1},e.prototype.getNode=function(e){return this.idNodeMap.get(e)||null},e.prototype.getIds=function(){return Array.from(this.idNodeMap.keys())},e.prototype.getMeta=function(e){return this.nodeMetaMap.get(e)||null},e.prototype.removeNodeFromMap=function(e){var t=this,n=this.getId(e);this.idNodeMap.delete(n),e.childNodes&&e.childNodes.forEach((function(e){return t.removeNodeFromMap(e)}))},e.prototype.has=function(e){return this.idNodeMap.has(e)},e.prototype.hasNode=function(e){return this.nodeMetaMap.has(e)},e.prototype.add=function(e,t){var n=t.id;this.idNodeMap.set(n,e),this.nodeMetaMap.set(e,t)},e.prototype.replace=function(e,t){this.idNodeMap.set(e,t)},e.prototype.reset=function(){this.idNodeMap=new Map,this.nodeMetaMap=new WeakMap},e}();function n(e){const t=[];for(const n in e){const o=e[n];if("string"!=typeof o)continue;const r=a(n);t.push(`${r}: ${o};`)}return t.join(" ")}const o=/-([a-z])/g,r=/^--[a-zA-Z0-9-]+$/,s=e=>r.test(e)?e:e.replace(o,((e,t)=>t?t.toUpperCase():"")),i=/\B([A-Z])/g,a=e=>e.replace(i,"-$1").toLowerCase();class d{constructor(...e){this.childNodes=[],this.parentElement=null,this.parentNode=null,this.ELEMENT_NODE=E.ELEMENT_NODE,this.TEXT_NODE=E.TEXT_NODE}get firstChild(){return this.childNodes[0]||null}get lastChild(){return this.childNodes[this.childNodes.length-1]||null}get nextSibling(){const e=this.parentNode;if(!e)return null;const t=e.childNodes,n=t.indexOf(this);return t[n+1]||null}contains(e){if(e===this)return!0;for(const t of this.childNodes)if(t.contains(e))return!0;return!1}appendChild(e){throw new Error("RRDomException: Failed to execute 'appendChild' on 'RRNode': This RRNode type does not support this method.")}insertBefore(e,t){throw new Error("RRDomException: Failed to execute 'insertBefore' on 'RRNode': This RRNode type does not support this method.")}removeChild(e){throw new Error("RRDomException: Failed to execute 'removeChild' on 'RRNode': This RRNode type does not support this method.")}toString(){return"RRNode"}}function c(t){return class n extends t{constructor(){super(...arguments),this.nodeType=E.DOCUMENT_NODE,this.nodeName="#document",this.compatMode="CSS1Compat",this.RRNodeType=e.Document,this.textContent=null}get documentElement(){return this.childNodes.find((t=>t.RRNodeType===e.Element&&"HTML"===t.tagName))||null}get body(){var t;return(null===(t=this.documentElement)||void 0===t?void 0:t.childNodes.find((t=>t.RRNodeType===e.Element&&"BODY"===t.tagName)))||null}get head(){var t;return(null===(t=this.documentElement)||void 0===t?void 0:t.childNodes.find((t=>t.RRNodeType===e.Element&&"HEAD"===t.tagName)))||null}get implementation(){return this}get firstElementChild(){return this.documentElement}appendChild(t){const n=t.RRNodeType;if((n===e.Element||n===e.DocumentType)&&this.childNodes.some((e=>e.RRNodeType===n)))throw new Error(`RRDomException: Failed to execute 'appendChild' on 'RRNode': Only one ${n===e.Element?"RRElement":"RRDoctype"} on RRDocument allowed.`);return t.parentElement=null,t.parentNode=this,this.childNodes.push(t),t}insertBefore(t,n){const o=t.RRNodeType;if((o===e.Element||o===e.DocumentType)&&this.childNodes.some((e=>e.RRNodeType===o)))throw new Error(`RRDomException: Failed to execute 'insertBefore' on 'RRNode': Only one ${o===e.Element?"RRElement":"RRDoctype"} on RRDocument allowed.`);if(null===n)return this.appendChild(t);const r=this.childNodes.indexOf(n);if(-1==r)throw new Error("Failed to execute 'insertBefore' on 'RRNode': The RRNode before which the new node is to be inserted is not a child of this RRNode.");return this.childNodes.splice(r,0,t),t.parentElement=null,t.parentNode=this,t}removeChild(e){const t=this.childNodes.indexOf(e);if(-1===t)throw new Error("Failed to execute 'removeChild' on 'RRDocument': The RRNode to be removed is not a child of this RRNode.");return this.childNodes.splice(t,1),e.parentElement=null,e.parentNode=null,e}open(){this.childNodes=[]}close(){}write(e){let t;if('<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">'===e?t="-//W3C//DTD XHTML 1.0 Transitional//EN":'<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "">'===e&&(t="-//W3C//DTD HTML 4.0 Transitional//EN"),t){const e=this.createDocumentType("html",t,"");this.open(),this.appendChild(e)}}createDocument(e,t,o){return new n}createDocumentType(e,t,n){const o=new(l(d))(e,t,n);return o.ownerDocument=this,o}createElement(e){const t=new(u(d))(e);return t.ownerDocument=this,t}createElementNS(e,t){return this.createElement(t)}createTextNode(e){const t=new(p(d))(e);return t.ownerDocument=this,t}createComment(e){const t=new(m(d))(e);return t.ownerDocument=this,t}createCDATASection(e){const t=new(N(d))(e);return t.ownerDocument=this,t}toString(){return"RRDocument"}}}function l(t){return class extends t{constructor(t,n,o){super(),this.nodeType=E.DOCUMENT_TYPE_NODE,this.RRNodeType=e.DocumentType,this.textContent=null,this.name=t,this.publicId=n,this.systemId=o,this.nodeName=t}toString(){return"RRDocumentType"}}}function u(t){return class extends t{constructor(t){super(),this.nodeType=E.ELEMENT_NODE,this.RRNodeType=e.Element,this.attributes={},this.shadowRoot=null,this.tagName=t.toUpperCase(),this.nodeName=t.toUpperCase()}get textContent(){let e="";return this.childNodes.forEach((t=>e+=t.textContent)),e}set textContent(e){this.childNodes=[this.ownerDocument.createTextNode(e)]}get classList(){return new f(this.attributes.class,(e=>{this.attributes.class=e}))}get id(){return this.attributes.id||""}get className(){return this.attributes.class||""}get style(){const e=this.attributes.style?function(e){const t={},n=/:(.+)/;return e.replace(/\/\*.*?\*\//g,"").split(/;(?![^(]*\))/g).forEach((function(e){if(e){const o=e.split(n);o.length>1&&(t[s(o[0].trim())]=o[1].trim())}})),t}(this.attributes.style):{},t=/\B([A-Z])/g;return e.setProperty=(o,r,i)=>{if(t.test(o))return;const a=s(o);r?e[a]=r:delete e[a],"important"===i&&(e[a]+=" !important"),this.attributes.style=n(e)},e.removeProperty=o=>{if(t.test(o))return"";const r=s(o),i=e[r]||"";return delete e[r],this.attributes.style=n(e),i},e}getAttribute(e){return this.attributes[e]||null}setAttribute(e,t){this.attributes[e]=t}setAttributeNS(e,t,n){this.setAttribute(t,n)}removeAttribute(e){delete this.attributes[e]}appendChild(e){return this.childNodes.push(e),e.parentNode=this,e.parentElement=this,e}insertBefore(e,t){if(null===t)return this.appendChild(e);const n=this.childNodes.indexOf(t);if(-1==n)throw new Error("Failed to execute 'insertBefore' on 'RRNode': The RRNode before which the new node is to be inserted is not a child of this RRNode.");return this.childNodes.splice(n,0,e),e.parentElement=this,e.parentNode=this,e}removeChild(e){const t=this.childNodes.indexOf(e);if(-1===t)throw new Error("Failed to execute 'removeChild' on 'RRElement': The RRNode to be removed is not a child of this RRNode.");return this.childNodes.splice(t,1),e.parentElement=null,e.parentNode=null,e}attachShadow(e){const t=this.ownerDocument.createElement("SHADOWROOT");return this.shadowRoot=t,t}dispatchEvent(e){return!0}toString(){let e="";for(const t in this.attributes)e+=`${t}="${this.attributes[t]}" `;return`${this.tagName} ${e}`}}}function h(e){return class extends e{attachShadow(e){throw new Error("RRDomException: Failed to execute 'attachShadow' on 'RRElement': This RRElement does not support attachShadow")}play(){this.paused=!1}pause(){this.paused=!0}}}function p(t){return class extends t{constructor(t){super(),this.nodeType=E.TEXT_NODE,this.nodeName="#text",this.RRNodeType=e.Text,this.data=t}get textContent(){return this.data}set textContent(e){this.data=e}toString(){return`RRText text=${JSON.stringify(this.data)}`}}}function m(t){return class extends t{constructor(t){super(),this.nodeType=E.COMMENT_NODE,this.nodeName="#comment",this.RRNodeType=e.Comment,this.data=t}get textContent(){return this.data}set textContent(e){this.data=e}toString(){return`RRComment text=${JSON.stringify(this.data)}`}}}function N(t){return class extends t{constructor(t){super(),this.nodeName="#cdata-section",this.nodeType=E.CDATA_SECTION_NODE,this.RRNodeType=e.CDATA,this.data=t}get textContent(){return this.data}set textContent(e){this.data=e}toString(){return`RRCDATASection data=${JSON.stringify(this.data)}`}}}class f{constructor(e,t){if(this.classes=[],this.add=(...e)=>{for(const t of e){const e=String(t);this.classes.indexOf(e)>=0||this.classes.push(e)}this.onChange&&this.onChange(this.classes.join(" "))},this.remove=(...e)=>{this.classes=this.classes.filter((t=>-1===e.indexOf(t))),this.onChange&&this.onChange(this.classes.join(" "))},e){const t=e.trim().split(/\s+/);this.classes.push(...t)}this.onChange=t}}var E;!function(e){e[e.PLACEHOLDER=0]="PLACEHOLDER",e[e.ELEMENT_NODE=1]="ELEMENT_NODE",e[e.ATTRIBUTE_NODE=2]="ATTRIBUTE_NODE",e[e.TEXT_NODE=3]="TEXT_NODE",e[e.CDATA_SECTION_NODE=4]="CDATA_SECTION_NODE",e[e.ENTITY_REFERENCE_NODE=5]="ENTITY_REFERENCE_NODE",e[e.ENTITY_NODE=6]="ENTITY_NODE",e[e.PROCESSING_INSTRUCTION_NODE=7]="PROCESSING_INSTRUCTION_NODE",e[e.COMMENT_NODE=8]="COMMENT_NODE",e[e.DOCUMENT_NODE=9]="DOCUMENT_NODE",e[e.DOCUMENT_TYPE_NODE=10]="DOCUMENT_TYPE_NODE",e[e.DOCUMENT_FRAGMENT_NODE=11]="DOCUMENT_FRAGMENT_NODE"}(E||(E={}));const T={svg:"http://www.w3.org/2000/svg","xlink:href":"http://www.w3.org/1999/xlink",xmlns:"http://www.w3.org/2000/xmlns/"},R={altglyph:"altGlyph",altglyphdef:"altGlyphDef",altglyphitem:"altGlyphItem",animatecolor:"animateColor",animatemotion:"animateMotion",animatetransform:"animateTransform",clippath:"clipPath",feblend:"feBlend",fecolormatrix:"feColorMatrix",fecomponenttransfer:"feComponentTransfer",fecomposite:"feComposite",feconvolvematrix:"feConvolveMatrix",fediffuselighting:"feDiffuseLighting",fedisplacementmap:"feDisplacementMap",fedistantlight:"feDistantLight",fedropshadow:"feDropShadow",feflood:"feFlood",fefunca:"feFuncA",fefuncb:"feFuncB",fefuncg:"feFuncG",fefuncr:"feFuncR",fegaussianblur:"feGaussianBlur",feimage:"feImage",femerge:"feMerge",femergenode:"feMergeNode",femorphology:"feMorphology",feoffset:"feOffset",fepointlight:"fePointLight",fespecularlighting:"feSpecularLighting",fespotlight:"feSpotLight",fetile:"feTile",feturbulence:"feTurbulence",foreignobject:"foreignObject",glyphref:"glyphRef",lineargradient:"linearGradient",radialgradient:"radialGradient"};function D(t,n,o,r){const s=t.childNodes,i=n.childNodes;r=r||n.mirror||n.ownerDocument.mirror,(s.length>0||i.length>0)&&g(Array.from(s),i,t,o,r);let a=null,d=null;switch(n.RRNodeType){case e.Document:d=n.scrollData;break;case e.Element:{const e=t,s=n;switch(function(e,t,n){const o=e.attributes,r=t.attributes;for(const o in r){const s=r[o],i=n.getMeta(t);if(i&&"isSVG"in i&&i.isSVG&&T[o])e.setAttributeNS(T[o],o,s);else if("CANVAS"===t.tagName&&"rr_dataURL"===o){const t=document.createElement("img");t.src=s,t.onload=()=>{const n=e.getContext("2d");n&&n.drawImage(t,0,0,t.width,t.height)}}else e.setAttribute(o,s)}for(const{name:t}of Array.from(o))t in r||e.removeAttribute(t);t.scrollLeft&&(e.scrollLeft=t.scrollLeft),t.scrollTop&&(e.scrollTop=t.scrollTop)}(e,s,r),d=s.scrollData,a=s.inputData,s.tagName){case"AUDIO":case"VIDEO":{const e=t,n=s;void 0!==n.paused&&(n.paused?e.pause():e.play()),void 0!==n.muted&&(e.muted=n.muted),void 0!==n.volume&&(e.volume=n.volume),void 0!==n.currentTime&&(e.currentTime=n.currentTime);break}case"CANVAS":{const r=n;if(null!==r.rr_dataURL){const t=document.createElement("img");t.onload=()=>{const n=e.getContext("2d");n&&n.drawImage(t,0,0,t.width,t.height)},t.src=r.rr_dataURL}r.canvasMutations.forEach((e=>o.applyCanvas(e.event,e.mutation,t)))}break;case"STYLE":!function(e,t){const n=e.sheet;t.forEach((e=>{if(e.type===M.Insert)try{if(Array.isArray(e.index)){const{positions:t,index:o}=w(e.index);C(n.cssRules,t).insertRule(e.cssText,o)}else n.insertRule(e.cssText,e.index)}catch(e){}else if(e.type===M.Remove)try{if(Array.isArray(e.index)){const{positions:t,index:o}=w(e.index);C(n.cssRules,t).deleteRule(o||0)}else n.deleteRule(e.index)}catch(e){}else if(e.type===M.SetProperty){C(n.cssRules,e.index).style.setProperty(e.property,e.value,e.priority)}else if(e.type===M.RemoveProperty){C(n.cssRules,e.index).style.removeProperty(e.property)}}))}(e,n.rules)}if(s.shadowRoot){e.shadowRoot||e.attachShadow({mode:"open"});const t=e.shadowRoot.childNodes,n=s.shadowRoot.childNodes;(t.length>0||n.length>0)&&g(Array.from(t),n,e.shadowRoot,o,r)}break}case e.Text:case e.Comment:case e.CDATA:t.textContent!==n.data&&(t.textContent=n.data)}if(d&&o.applyScroll(d,!0),a&&o.applyInput(a),"IFRAME"===n.nodeName){const e=t.contentDocument,s=n;if(e){const t=r.getMeta(s.contentDocument);t&&o.mirror.add(e,Object.assign({},t)),D(e,s.contentDocument,o,r)}}}function g(t,n,o,r,s){var i;let a,d,c=0,l=t.length-1,u=0,h=n.length-1,p=t[c],m=t[l],N=n[u],f=n[h];for(;c<=l&&u<=h;)if(void 0===p)p=t[++c];else if(void 0===m)m=t[--l];else if(r.mirror.getId(p)===s.getId(N))D(p,N,r,s),p=t[++c],N=n[++u];else if(r.mirror.getId(m)===s.getId(f))D(m,f,r,s),m=t[--l],f=n[--h];else if(r.mirror.getId(p)===s.getId(f))o.insertBefore(p,m.nextSibling),D(p,f,r,s),p=t[++c],f=n[--h];else if(r.mirror.getId(m)===s.getId(N))o.insertBefore(m,p),D(m,N,r,s),m=t[--l],N=n[++u];else{if(!a){a={};for(let e=c;e<=l;e++){const n=t[e];n&&r.mirror.hasNode(n)&&(a[r.mirror.getId(n)]=e)}}if(d=a[s.getId(N)],d){const e=t[d];o.insertBefore(e,p),D(e,N,r,s),t[d]=void 0}else{const n=y(N,r.mirror,s);"#document"===o.nodeName&&(null===(i=r.mirror.getMeta(n))||void 0===i?void 0:i.type)===e.Element&&o.documentElement&&(o.removeChild(o.documentElement),t[c]=void 0,p=void 0),o.insertBefore(n,p||null),D(n,N,r,s)}N=n[++u]}if(c>l){const e=n[h+1];let t=null;for(e&&o.childNodes.forEach((n=>{r.mirror.getId(n)===s.getId(e)&&(t=n)}));u<=h;++u){const e=y(n[u],r.mirror,s);o.insertBefore(e,t),D(e,n[u],r,s)}}else if(u>h)for(;c<=l;c++){const e=t[c];e&&(o.removeChild(e),r.mirror.removeNodeFromMap(e))}}function y(t,n,o){let r=n.getNode(o.getId(t));const s=o.getMeta(t);if(null!==r)return r;switch(t.RRNodeType){case e.Document:r=new Document;break;case e.DocumentType:r=document.implementation.createDocumentType(t.name,t.publicId,t.systemId);break;case e.Element:{let e=t.tagName.toLowerCase();e=R[e]||e,r=s&&"isSVG"in s&&(null==s?void 0:s.isSVG)?document.createElementNS(T.svg,e):document.createElement(t.tagName);break}case e.Text:r=document.createTextNode(t.data);break;case e.Comment:r=document.createComment(t.data);break;case e.CDATA:r=document.createCDATASection(t.data)}return s&&n.add(r,Object.assign({},s)),r}function C(e,t){const n=e[t[0]];return 1===t.length?n:C(n.cssRules[t[1]].cssRules,t.slice(2))}var M;function w(e){const t=[...e],n=t.pop();return{positions:t,index:n}}!function(e){e[e.Insert=0]="Insert",e[e.Remove=1]="Remove",e[e.Snapshot=2]="Snapshot",e[e.SetProperty=3]="SetProperty",e[e.RemoveProperty=4]="RemoveProperty"}(M||(M={}));class O extends(c(d)){constructor(e){super(),this._unserializedId=-1,this.mirror=P(),this.scrollData=null,e&&(this.mirror=e)}get unserializedId(){return this._unserializedId--}createDocument(e,t,n){return new O}createDocumentType(e,t,n){const o=new x(e,t,n);return o.ownerDocument=this,o}createElement(e){const t=e.toUpperCase();let n;switch(t){case"AUDIO":case"VIDEO":n=new A(t);break;case"IFRAME":n=new _(t,this.mirror);break;case"CANVAS":n=new b(t);break;case"STYLE":n=new I(t);break;default:n=new v(t)}return n.ownerDocument=this,n}createComment(e){const t=new L(e);return t.ownerDocument=this,t}createCDATASection(e){const t=new F(e);return t.ownerDocument=this,t}createTextNode(e){const t=new S(e);return t.ownerDocument=this,t}destroyTree(){this.childNodes=[],this.mirror.reset()}open(){super.open(),this._unserializedId=-1}}const x=l(d);class v extends(u(d)){constructor(){super(...arguments),this.inputData=null,this.scrollData=null}}class A extends(h(v)){}class b extends v{constructor(){super(...arguments),this.rr_dataURL=null,this.canvasMutations=[]}getContext(){return null}}class I extends v{constructor(){super(...arguments),this.rules=[]}}class _ extends v{constructor(e,t){super(e),this.contentDocument=new O,this.contentDocument.mirror=t}}const S=p(d),L=m(d),F=N(d);function U(e,t,n,o){let r;switch(e.nodeType){case E.DOCUMENT_NODE:o&&"IFRAME"===o.nodeName?r=o.contentDocument:(r=t,r.compatMode=e.compatMode);break;case E.DOCUMENT_TYPE_NODE:{const n=e;r=t.createDocumentType(n.name,n.publicId,n.systemId);break}case E.ELEMENT_NODE:{const n=e,o=(s=n)instanceof HTMLFormElement?"FORM":s.tagName.toUpperCase();r=t.createElement(o);const i=r;for(const{name:e,value:t}of Array.from(n.attributes))i.attributes[e]=t;n.scrollLeft&&(i.scrollLeft=n.scrollLeft),n.scrollTop&&(i.scrollTop=n.scrollTop);break}case E.TEXT_NODE:r=t.createTextNode(e.textContent||"");break;case E.CDATA_SECTION_NODE:r=t.createCDATASection(e.data);break;case E.COMMENT_NODE:r=t.createComment(e.textContent||"");break;case E.DOCUMENT_FRAGMENT_NODE:r=o.attachShadow({mode:"open"});break;default:return null}var s;let i=n.getMeta(e);return t instanceof O&&(i||(i=G(r,t.unserializedId),n.add(e,i)),t.mirror.add(r,Object.assign({},i))),r}function k(e,n=function(){return new t}(),o=new O){return function e(t,r){const s=U(t,o,n,r);null!==s&&("IFRAME"!==(null==r?void 0:r.nodeName)&&t.nodeType!==E.DOCUMENT_FRAGMENT_NODE&&(null==r||r.appendChild(s),s.parentNode=r,s.parentElement=r),"IFRAME"===t.nodeName?e(t.contentDocument,s):t.nodeType!==E.DOCUMENT_NODE&&t.nodeType!==E.ELEMENT_NODE&&t.nodeType!==E.DOCUMENT_FRAGMENT_NODE||(t.nodeType===E.ELEMENT_NODE&&t.shadowRoot&&e(t.shadowRoot,s),t.childNodes.forEach((t=>e(t,s)))))}(e,null),o}function P(){return new B}class B{constructor(){this.idNodeMap=new Map,this.nodeMetaMap=new WeakMap}getId(e){var t;if(!e)return-1;const n=null===(t=this.getMeta(e))||void 0===t?void 0:t.id;return null!=n?n:-1}getNode(e){return this.idNodeMap.get(e)||null}getIds(){return Array.from(this.idNodeMap.keys())}getMeta(e){return this.nodeMetaMap.get(e)||null}removeNodeFromMap(e){const t=this.getId(e);this.idNodeMap.delete(t),e.childNodes&&e.childNodes.forEach((e=>this.removeNodeFromMap(e)))}has(e){return this.idNodeMap.has(e)}hasNode(e){return this.nodeMetaMap.has(e)}add(e,t){const n=t.id;this.idNodeMap.set(n,e),this.nodeMetaMap.set(e,t)}replace(e,t){this.idNodeMap.set(e,t)}reset(){this.idNodeMap=new Map,this.nodeMetaMap=new WeakMap}}function G(t,n){switch(t.RRNodeType){case e.Document:return{id:n,type:t.RRNodeType,childNodes:[]};case e.DocumentType:{const e=t;return{id:n,type:t.RRNodeType,name:e.name,publicId:e.publicId,systemId:e.systemId}}case e.Element:return{id:n,type:t.RRNodeType,tagName:t.tagName.toLowerCase(),attributes:{},childNodes:[]};case e.Text:case e.Comment:return{id:n,type:t.RRNodeType,textContent:t.textContent||""};case e.CDATA:return{id:n,type:t.RRNodeType,textContent:""}}}function $(e,t){return Y(e,t,"")}function Y(t,n,o){let r=`${o}${n.getId(t)} ${t.toString()}\n`;if(t.RRNodeType===e.Element){const e=t;e.shadowRoot&&(r+=Y(e.shadowRoot,n,o+"  "))}for(const e of t.childNodes)r+=Y(e,n,o+"  ");return"IFRAME"===t.nodeName&&(r+=Y(t.contentDocument,n,o+"  ")),r}export{N as BaseRRCDATASectionImpl,m as BaseRRCommentImpl,c as BaseRRDocumentImpl,l as BaseRRDocumentTypeImpl,u as BaseRRElementImpl,h as BaseRRMediaElementImpl,d as BaseRRNode,p as BaseRRTextImpl,f as ClassList,B as Mirror,E as NodeType,F as RRCDATASection,b as RRCanvasElement,L as RRComment,O as RRDocument,x as RRDocumentType,v as RRElement,_ as RRIFrameElement,A as RRMediaElement,d as RRNode,I as RRStyleElement,S as RRText,M as StyleRuleType,k as buildFromDom,U as buildFromNode,P as createMirror,y as createOrGetNode,D as diff,G as getDefaultSN,$ as printRRDom};
 //# sourceMappingURL=rrdom.min.js.map

lib/index.d.ts

@@ -254,2 +254,3 @@ import { NodeType as RRNodeType } from 'rrweb-snapshot';
 export declare class RRCanvasElement extends RRElement implements IRRElement {
+    rr_dataURL: string | null;
     canvasMutations: {
@@ -256,0 +257,0 @@ event: canvasEventWithTime;

lib/rrdom.js

@@ -603,3 +603,16 @@ 'use strict';
                 case 'CANVAS':
-                    newTree.canvasMutations.forEach((canvasMutation) => replayer.applyCanvas(canvasMutation.event, canvasMutation.mutation, oldTree));
+                    {
+                        const rrCanvasElement = newTree;
+                        if (rrCanvasElement.rr_dataURL !== null) {
+                            const image = document.createElement('img');
+                            image.onload = () => {
+                                const ctx = oldElement.getContext('2d');
+                                if (ctx) {
+                                    ctx.drawImage(image, 0, 0, image.width, image.height);
+                                }
+                            };
+                            image.src = rrCanvasElement.rr_dataURL;
+                        }
+                        rrCanvasElement.canvasMutations.forEach((canvasMutation) => replayer.applyCanvas(canvasMutation.event, canvasMutation.mutation, oldTree));
+                    }
                     break;
@@ -940,2 +953,3 @@ case 'STYLE':
         super(...arguments);
+        this.rr_dataURL = null;
         this.canvasMutations = [];
@@ -942,0 +956,0 @@ }

package.json

 {
   "name": "rrdom",
-  "version": "0.1.3",
+  "version": "0.1.4",
   "homepage": "https://github.com/rrweb-io/rrweb/tree/main/packages/rrdom#readme",
@@ -49,5 +49,5 @@ "license": "MIT",
   "dependencies": {
-    "rrweb-snapshot": "^2.0.0-alpha.0"
+    "rrweb-snapshot": "^2.0.0-alpha.1"
   },
-  "gitHead": "2d4dd2296670387c7a7d652c1dd5e66fad8d64c1"
+  "gitHead": "abc035fd00972c3ffa1a9cf379b46f53cb74d394"
 }

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

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1460065

increased by0.39%

Lines of code

13748

increased by0.34%

Number of medium supply chain risk alerts

0

decreased by-100%

Dependency changes

• Updatedrrweb-snapshot@^2.0.0-alpha.1