check cssRules existence before css variables are get from stylesheet

(cherry picked from commit 367cda2de0)

src/app/shared/sass-helper/css-variable.service.ts

@@ -26,6 +26,17 @@ export class CSSVariableService {
     return styleSheet.href.indexOf(window.location.origin) === 0;
   };
 
+  /**
+   * Checks whether the specific stylesheet object has the property cssRules
+   * @param styleSheet The stylesheet
+   */
+  hasCssRules = (styleSheet) => {
+    // Injected styles might have no css rules value
+    return styleSheet.hasOwnProperty('cssRules') && styleSheet.cssRules;
+  };
+
+
+
   /*
    Determine if the given rule is a CSSStyleRule
    See: https://developer.mozilla.org/en-US/docs/Web/API/CSSRule#Type_constants
@@ -93,8 +104,10 @@ export class CSSVariableService {
     if (isNotEmpty(document.styleSheets)) {
       // styleSheets is array-like, so we convert it to an array.
       // Filter out any stylesheets not on this domain
+      // Filter out any stylesheets that have no cssRules property
       return [...document.styleSheets]
         .filter(this.isSameDomain)
+        .filter(this.hasCssRules)
         .reduce(
           (finalArr, sheet) =>
             finalArr.concat(