add inline option which can bypass the inline stylesheet

package.json

@@ -36,12 +36,12 @@
     "@types/chai": "^4.1.4",
     "@types/mocha": "^5.2.5",
     "@types/node": "^10.11.3",
-    "@types/puppeteer": "^1.8.0",
+    "@types/puppeteer": "^1.12.4",
     "chai": "^4.1.2",
     "cross-env": "^5.2.0",
     "jest-snapshot": "^23.6.0",
     "mocha": "^5.2.0",
-    "puppeteer": "^1.10.0",
+    "puppeteer": "^1.15.0",
     "rollup": "^0.66.4",
     "rollup-plugin-terser": "^3.0.0",
     "rollup-plugin-typescript": "^1.0.0",

src/snapshot.ts

@@ -21,7 +21,10 @@ function getCssRulesString(s: CSSStyleSheet): string | null {
   try {
     const rules = s.rules || s.cssRules;
     return rules
-      ? Array.from(rules).reduce((prev, cur) => prev + getCssRuleString(cur), '')
+      ? Array.from(rules).reduce(
+          (prev, cur) => prev + getCssRuleString(cur),
+          '',
+        )
       : null;
   } catch (error) {
     return null;
@@ -29,7 +32,9 @@ function getCssRulesString(s: CSSStyleSheet): string | null {
 }
 
 function getCssRuleString(rule: CSSRule): string {
-  return isCSSImportRule(rule) ? getCssRulesString(rule.styleSheet) || '' : rule.cssText;
+  return isCSSImportRule(rule)
+    ? getCssRulesString(rule.styleSheet) || ''
+    : rule.cssText;
 }
 
 function isCSSImportRule(rule: CSSRule): rule is CSSImportRule {
@@ -98,6 +103,7 @@ function serializeNode(
   n: Node,
   doc: Document,
   blockClass: string | RegExp,
+  inlineStylesheet: boolean,
 ): serializedNode | false {
   switch (n.nodeType) {
     case n.DOCUMENT_NODE:
@@ -136,7 +142,7 @@ function serializeNode(
         }
       }
       // remote css
-      if (tagName === 'link') {
+      if (tagName === 'link' && inlineStylesheet) {
         const stylesheet = Array.from(doc.styleSheets).find(s => {
           return s.href === (n as HTMLLinkElement).href;
         });
@@ -238,8 +244,9 @@ export function serializeNodeWithId(
   map: idNodeMap,
   blockClass: string | RegExp,
   skipChild = false,
+  inlineStylesheet = true,
 ): serializedNodeWithId | null {
-  const _serializedNode = serializeNode(n, doc, blockClass);
+  const _serializedNode = serializeNode(n, doc, blockClass, inlineStylesheet);
   if (!_serializedNode) {
     // TODO: dev only
     console.warn(n, 'not serialized');
@@ -279,10 +286,14 @@ export function serializeNodeWithId(
 function snapshot(
   n: Document,
   blockClass: string | RegExp = 'rr-block',
+  inlineStylesheet = true,
 ): [serializedNodeWithId | null, idNodeMap] {
   resetId();
   const idNodeMap: idNodeMap = {};
-  return [serializeNodeWithId(n, n, idNodeMap, blockClass), idNodeMap];
+  return [
+    serializeNodeWithId(n, n, idNodeMap, blockClass, false, inlineStylesheet),
+    idNodeMap,
+  ];
 }
 
 export default snapshot;

test/integration.ts

@@ -104,7 +104,9 @@ describe('integration tests', function(this: ISuite) {
       // tslint:disable-next-line: no-console
       page.on('console', msg => console.log(msg.text()));
       await page.goto(`http://localhost:3030/html`);
-      await page.setContent(html.src);
+      await page.setContent(html.src, {
+        waitUntil: 'load',
+      });
       const rebuildHtml = (await page.evaluate(`${this.code}
         const x = new XMLSerializer();
         const [snap] = rrweb.snapshot(document);

typings/snapshot.d.ts

@@ -1,6 +1,6 @@
 import { serializedNodeWithId, idNodeMap } from './types';
 export declare function resetId(): void;
 export declare function absoluteToStylesheet(cssText: string, href: string): string;
-export declare function serializeNodeWithId(n: Node, doc: Document, map: idNodeMap, blockClass: string | RegExp, skipChild?: boolean): serializedNodeWithId | null;
-declare function snapshot(n: Document, blockClass?: string | RegExp): [serializedNodeWithId | null, idNodeMap];
+export declare function serializeNodeWithId(n: Node, doc: Document, map: idNodeMap, blockClass: string | RegExp, skipChild?: boolean, inlineStylesheet?: boolean): serializedNodeWithId | null;
+declare function snapshot(n: Document, blockClass?: string | RegExp, inlineStylesheet?: boolean): [serializedNodeWithId | null, idNodeMap];
 export default snapshot;