Facebook "Like Box" page disappears after brief moment in Android 4.4 KitKat WebView

Issue

An Android app uses a WebView to display a Facebook Like Box. On 4.1.2 and 4.3 the page appears correctly when the following code is used.

String url = "https://www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2FGoogle&width&height=395&colorscheme=light&show_faces=false&header=false&stream=true&show_border=false";

WebView webview = (WebView) findViewById(R.id.web_content);
webview.getSettings().setJavaScriptEnabled(true);
webview.setWebChromeClient(new WebChromeClient());
webview.setWebViewClient(new WebViewClient());
webview.loadUrl(url);

On 4.4.2 the page looks good in the full-on Chrome app; however, the behaviour is not good when loaded in the WebView as coded above. There is a brief flash of a fully-rendered page then the WebView goes totally white. Nothing is visible and scrolling does nothing.

I have used chrome://inspect to watch the page as it loads, but it doesn't support showing network requests. The output of running document.location.href; at the console is about:blank, though, which is a clue.

Some ideas I've tried based on various threads:

• Disabling hardware acceleration
  • Using webview.setLayerType(View.LAYER_TYPE_SOFTWARE, null)
  • Using android:hardwareAccelerated="false" in AndroidManifest.xml
• Disabling JavaScript
  • This can't work because the Like Box requires JS to display at all
• Some methods on webview.getSettings()
  • .setSupportZoom(true), .setSupportZoom(false)
  • .setUseWideViewPort(true), .setUseWideViewPort(false)
  • .setLoadWithOverviewMode(true), .setLoadWithOverviewMode(false)
• Running custom CSS after the page is loaded to set a white background
  • I make sure it runs by creating an alert() directly afterward

At this point I may have to resort to starting an intent when running in 4.4 so the page is loaded by the browser in that case, but I would prefer to find a fix for the blank WebView. Are there any other settings I can tweak?

Solution

The above doesn't repro for me on 4.4

I have used chrome://inspect to watch the page as it loads, but it doesn't support showing network requests.

It totally does support showing network requests. Try this - in your app comment out loading the URL, just new the WebView up. Connect via DevTools and type window.location = 'https://....';

The output of running document.location.href; at the console is about:blank, though, which is a clue.

Sounds like this is it. I'm not sure what the HTML/JS you end up loading does, maybe the JS tries to navigate to some weird URL? Try setting a WebViewClient that logs all shouldOverrideUrlLoading calls and see if you're getting a non-http(s) URL there. Try returning true for that URL.

Answered By - marcin.kosiba