chek is CSSGroupingRule supported (#693)

rrweb-io · Sep 9, 2021 · 5b40470 · 5b40470
1 parent b068241
commit 5b40470
Showing 1 changed file with 10 additions and 1 deletion.
diff --git a/packages/rrweb/src/record/observer.ts b/packages/rrweb/src/record/observer.ts
@@ -60,6 +60,8 @@ type WindowWithAngularZone = Window & {
 
 export const mutationBuffers: MutationBuffer[] = [];
 
+const isCSSGroupingRuleSupported = typeof CSSGroupingRule !== "undefined"
+
 function getEventTarget(event: Event): EventTarget | null {
   try {
     if ('composedPath' in event) {
@@ -476,7 +478,7 @@ function initInputObserver(
 function getNestedCSSRulePositions(rule: CSSRule): number[] {
   const positions: number[] = [];
   function recurse(childRule: CSSRule, pos: number[]) {
-    if (childRule.parentRule instanceof CSSGroupingRule) {
+    if (isCSSGroupingRuleSupported && childRule.parentRule instanceof CSSGroupingRule) {
       const rules = Array.from(
         (childRule.parentRule as CSSGroupingRule).cssRules,
       );
@@ -520,6 +522,13 @@ function initStyleSheetObserver(
     return deleteRule.apply(this, arguments);
   };
 
+  if (!isCSSGroupingRuleSupported) {
+    return () => {
+      CSSStyleSheet.prototype.insertRule = insertRule;
+      CSSStyleSheet.prototype.deleteRule = deleteRule;
+    };
+  }
+
   const groupingInsertRule = CSSGroupingRule.prototype.insertRule;
   CSSGroupingRule.prototype.insertRule = function (
     rule: string,