WebView crashing my app with VALIDATION_ERROR_DESERIALIZATION_FAILED

Question

I'm loading a small angular webapp in a webview. I don't have control or any info of the app other than the webpacked bundle.
At an exact point in the web app, my whole Android app crashes with the following logs:

08-22 09:13:33.980 29145-29191/com.my.app E/chromium: [ERROR:validation_errors.cc(87)] Invalid message: VALIDATION_ERROR_DESERIALIZATION_FAILED
08-22 09:13:33.981 29145-29191/com.my.app E/chromium: [ERROR:render_process_host_impl.cc(4399)] Terminating render process for bad Mojo message: Received bad user message: Validation failed for SynchronousCompositorControlHost::ReturnFrame deserializer [VALIDATION_ERROR_DESERIALIZATION_FAILED]
    [ERROR:bad_message.cc(25)] Terminating renderer for bad IPC message, reason 123
08-22 10:05:25.284 18717-18717/mx.tide.fiuanalyticsapp E/chromium: [ERROR:aw_browser_terminator.cc(86)] Render process (18816) kill (OOM or update) wasn't handed by all associated webviews, killing application.

I haven't found anything on the web other than the chromium source code where the errors are defined, I have no clue how to debug this problem as there is no problem while opening the web app directly on mobile Chrome browser.
So, have any of you idea of what this error could be? Or at least a lead for where could I start debugging the problem?

Answer 1

I am running into the exact same issue. I was able to find that a css property, will-change: transform, was causing the issue, but I am not sure why yet since this property is being used elsewhere in the same file but does not cause the error.

I was able to find the culprit using charles proxy to set a breakpoint on the response of the webpage and systematically removing the scripts and links from the html. Eventually I found that by removing the main css link, the app no longer crashes. I then had to systematically remove lines from that css file until I found the line breaking the WebView.

I still haven't been able to figure out why this line breaks it, but it is set on a jpeg image in the html. Looks like its an issue with chromium. I am still trying to figure out why chromium has an issue with it.

Answer 2

Although my problem was solved thanks to @P. G.'s answer, I wanted to add the way I solved the problem without having access to the original web app code, this may help someone else.

So, I needed to replace the CSS which was causing the problem, so I downloaded the original app CSS, fixed it, and uploaded it to my own server. Then, in the android app I overrided the shouldInterceptRequest method of the web view and whenever the app tried to load the CSS I would replace it with my own.
Code:

 mWebView.setWebViewClient(new WebViewClient() {

        @Override
        public WebResourceResponse shouldInterceptRequest (WebView view, WebResourceRequest request){

            String urls = request.getUrl().toString();

            //To prevent the WebView from crashing, we serve our own css modified version
            if( urls.equals("https://originalapphost.com/theircssfile.css")  ) {
                try {
                    URL url = new URL("https://myhost.com/mymodifiedcssfile.css");
                    URLConnection connection = url.openConnection();
                    return new WebResourceResponse(connection.getContentType(), connection.getHeaderField("encoding"), connection.getInputStream());
                } catch (Exception e) {
                    e.printStackTrace();
                }

            }

            return super.shouldInterceptRequest(view, request);
        }
    });

Also, I think that having a list of css that crash the android webview would be really helpful. I'll start it here and if you find another one please feel free to comment here and I'll be updating this answer.

• will-change: transform;
• filter:url(#blur);