add isShadow flag if a node is under shadow root

src/index.ts

@@ -7,6 +7,7 @@ import snapshot, {
 } from './snapshot';
 import rebuild, { buildNodeWithSN, addHoverClass } from './rebuild';
 export * from './types';
+export * from './utils';
 
 export {
   snapshot,

src/snapshot.ts

@@ -8,7 +8,7 @@ import {
   MaskInputOptions,
   SlimDOMOptions,
 } from './types';
-import { isElement } from './utils';
+import { isElement, isShadowRoot } from './utils';
 
 let _id = 1;
 const tagNameRegex = RegExp('[^a-z0-9-_]');
@@ -657,6 +657,10 @@ export function serializeNodeWithId(
     }
   }
 
+  if (n.parentNode && isShadowRoot(n.parentNode)) {
+    serializedNode.isShadow = true;
+  }
+
   if (
     serializedNode.type === NodeType.Element &&
     serializedNode.tagName === 'iframe'

src/utils.ts

@@ -3,3 +3,8 @@ import { INode } from './types';
 export function isElement(n: Node | INode): n is Element {
   return n.nodeType === n.ELEMENT_NODE;
 }
+
+export function isShadowRoot(n: Node): n is ShadowRoot {
+  const host: Element | null = (n as ShadowRoot)?.host;
+  return Boolean(host && host.shadowRoot && host.shadowRoot === n);
+}

typings/index.d.ts

@@ -1,4 +1,5 @@
 import snapshot, { serializeNodeWithId, transformAttribute, visitSnapshot, cleanupSnapshot, IGNORED_NODE } from './snapshot';
 import rebuild, { buildNodeWithSN, addHoverClass } from './rebuild';
 export * from './types';
+export * from './utils';
 export { snapshot, serializeNodeWithId, rebuild, buildNodeWithSN, addHoverClass, transformAttribute, visitSnapshot, cleanupSnapshot, IGNORED_NODE, };

typings/utils.d.ts

@@ -1,2 +1,3 @@
 import { INode } from './types';
 export declare function isElement(n: Node | INode): n is Element;
+export declare function isShadowRoot(n: Node): n is ShadowRoot;