0

I have some code that is supposed to manipulate CSS from javascript. However, when I moved my code over to file:// access in Android as seems to be the recommended method of running a web app in a WebView, I get an error when the following code tries to run:

return document.styleSheets[0].cssRules[0].style

The value is "cssRules" is always null, which is unexpected.

I found this file in which it appears that this is due to a "bug" in Chromium that Chrome developers are refusing to fix.

I'm wondering if this is really the bug I am running into and if so if there is a workaround for this. How can I manipulate CSS from Javascript in a WebView when running locally? Should I just abandon the whole notion of running locally? I'm afraid there may be other things like this that are going to bite me.

Michael
  • 9,060
  • 14
  • 61
  • 123
  • find the solution here https://stackoverflow.com/questions/4950729/rendering-html-in-a-webview-with-custom-css – Prens Oct 11 '17 at 19:57
  • @Prerna I'm not sure if this makes a difference, but I'm currently storing my assets in the sdcard directory so I can update it without having to reinstall my app over and over for every tiny change. – Michael Oct 11 '17 at 19:59
  • @Prerna Also, looking at loadDataWithBaseURL I'm not sure it's appropriate for this use case. I've got HTML which dynamically loads javascript files and css and which dynamically create css. This approach appears like it would necessitate completely breaking how my web app works. – Michael Oct 11 '17 at 20:04

1 Answers1

0

In my code I was already calling:

    webSettings.setAllowFileAccess(true);

But I discovered that if I add the following code it relaxes all the security restrictions on local file access and I am able to access CSS from Javascript:

    if (Build.VERSION.SDK_INT >= 16 ) {
        webSettings.setAllowFileAccessFromFileURLs(true);
        webSettings.setAllowUniversalAccessFromFileURLs(true);
    }
Michael
  • 9,060
  • 14
  • 61
  • 123