Opened 11 months ago

Last modified 9 months ago

#19100 new defect

Uncaught DOMException: Failed to read the 'cssRules' property from 'CSSStyleSheet': Cannot access rules

Reported by: HarKoT Owned by:
Priority: major Milestone:
Component: DojoX Mobile Version: 1.13.0
Keywords: Cc:
Blocked By: Blocking:

Description

Examples not working on the latest version of Chrome (Version 64.0.3282.119 (Official Build) beta (64-bit) on Linux. It also happens on Android with the Chrome Beta App (Regular Chrome does work).

I'm not sure whether this is a Chrome issue or a Dojo issue I'm afraid.

To reproduce: accessing http://dojotoolkit.org/documentation/tutorials/1.10/mobile/flickrview/part1/demo/sample1.html

Will give: Uncaught DOMException: Failed to read the 'cssRules' property from 'CSSStyleSheet': Cannot access rules

at f (:ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojoxmobile/iconUtils.js:3:276) at f (:ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojoxmobile/iconUtils.js:3:253) at Object.createDomButton (:ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojoxmobile/iconUtils.js:4:64) at Object.createIcon (:ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojoxmobile/iconUtils.js:5:311) at Object.setIcon (:ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojoxmobile/iconUtils.js:7:6) at Object._setIcon (:ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojoxmobile/ListItem.js:13:75) at Object._setRightIconAttr (:ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojoxmobile/ListItem.js:14:223) at Object.setArrow (:ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojoxmobile/ListItem.js:12:208) at Object.startup (:ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojoxmobile/ListItem.js:7:316) at :ajax.googleapis.com/ajax/libs/dojo/1.10.4/dijit_WidgetBase.js:7:436

/favicon.ico Failed to load resource: the server responded with a status of 404 (Not Found)

The example uses Dojo 1.10, but I've got the same error with 1.13.0 dojo.js.uncompressed.js:1310 Uncaught DOMException: Failed to read the 'cssRules' property from 'CSSStyleSheet': Cannot access rules

at f (:ajax.googleapis.com/ajax/libs/dojo/1.13.0/dojoxmobile/iconUtils.js:3:276) at f (:ajax.googleapis.com/ajax/libs/dojo/1.13.0/dojoxmobile/iconUtils.js:3:253) at Object.createDomButton (:ajax.googleapis.com/ajax/libs/dojo/1.13.0/dojoxmobile/iconUtils.js:4:67) at Object.createIcon (:ajax.googleapis.com/ajax/libs/dojo/1.13.0/dojoxmobile/iconUtils.js:5:309) at Object.setIcon (:ajax.googleapis.com/ajax/libs/dojo/1.13.0/dojoxmobile/iconUtils.js:6:401) at Object._setIcon (:ajax.googleapis.com/ajax/libs/dojo/1.13.0/dojoxmobile/ListItem.js:13:55) at Object._setRightIconAttr (:ajax.googleapis.com/ajax/libs/dojo/1.13.0/dojoxmobile/ListItem.js:14:222) at Object.setArrow (:ajax.googleapis.com/ajax/libs/dojo/1.13.0/dojoxmobile/ListItem.js:12:204) at Object.startup (:ajax.googleapis.com/ajax/libs/dojo/1.13.0/dojoxmobile/ListItem.js:7:316) at :ajax.googleapis.com/ajax/libs/dojo/1.13.0/dijit_WidgetBase.js:7:466

Change History (4)

comment:1 Changed 10 months ago by lloydk01

I am also experiencing this issue with Chrome v64 on any Windows device when referencing dojo files via a CDN. Any idea how long a fix will take???

Last edited 10 months ago by lloydk01 (previous) (diff)

comment:2 Changed 10 months ago by Andrew Murdoch

Using latest update of Chrome: Version 64.0.3282.167 (Official Build) (64-bit)

Same issue with the version of Dojo hosted by Esri's CDN (js.arcgis.com) for their mapping JSAPI: DOMException: Failed to read the 'cssRules' property from 'CSSStyleSheet': Cannot access rules

at f (https://js.arcgis.com/3.21compact/dojox/mobile/iconUtils.js:3:276)

I'll be reaching out to Esri directly as well.

Others seem to have similar issues with the Chrome 64 update breaking CSS-related stuff: https://what.thedailywtf.com/topic/24540/borked-chrome-64 and https://github.com/odoo/odoo/issues/22517

comment:3 Changed 10 months ago by dylan

See the discussion at https://discourse.dojo.io/t/error-loading-dojo-mobile-1-13-0-1-12-2-under-android-chrome-browser-after-update/129/15 ... the issue is with Chrome 64 enforcing new security policies around CSS files, current workaround is to host CSS files on your own server

https://chromium.googlesource.com/chromium/src/+/a4ebe08c91e29140e700c7bae9b94f27a786d1ca

comment:4 Changed 9 months ago by HarKoT

In the absence of a better solution I've simply started hosting my own version of Dojo on the same server as my webpage and it solves the issue (As my understanding is that the issue is that Chrome blocks CSS files that are stored on a different server)

It's not a great workaround but at least it works for now. Basically I just had to download http://download.dojotoolkit.org/release-1.13.0/dojo-release-1.13.0.tar.gz Extract it and upload the folder to my server Then change the following on my page:

-        <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/dojo/1.13.0/dojox/mobile/deviceTheme.js"></script>
+        <script type="text/javascript" src="dojo-release-1.13.0/dojox/mobile/deviceTheme.js"></script>

And

-        <script src="//ajax.googleapis.com/ajax/libs/dojo/1.13.0/dojo/dojo.js"
+        <script src="dojo-release-1.13.0/dojo/dojo.js"

Hope this helps

Last edited 9 months ago by HarKoT (previous) (diff)
Note: See TracTickets for help on using tickets.