Chrome DevTools broken - Stetho unusable

AndroidGoogle ChromeGoogle Chrome-DevtoolsOkhttpStetho

Android Problem Overview


Stetho and Google Chrome DevTools have become unusable after a macOS update (I doubt that macOS update is the origin of this bug, but I prefer to mention it).

Here is the appearance of DevTools after the open of "inspect mode" on a device (provided by Facebook Stetho library for Android & OKHttp).

DevTools window

There are no longer "CSS" stylesheets on the page and fonts have changed. Many tab pages aren't displayed (i.e. Network Requests), I only have access to some error messages :

There were 84 bytes that were not consumed while processing request 4
There were 84 bytes that were not consumed while processing request 5
There were 84 bytes that were not consumed while processing request 6
Failed to clear temp storage: undefined

I followed instructions on this issue : https://stackoverflow.com/questions/31358446/failed-to-clear-temp-storage/35172470 and this one : https://stackoverflow.com/questions/36850053/failed-to-clear-temp-storage-securityerror-in-chrome?noredirect=1&lq=1 but I haven't been able to fix the problem.

Here is what I tried :

  • Uninstall and reinstall Chrome with AppCleaner
  • Remove chrome cache from disk
  • Remove chrome profiles from ~/Library/Application\ Support/Google/Chrome
  • Create and use a new Chrome profile
  • Try to connect on Firefox distant debug (unfonctionnal)
  • Restart system

Have any of you ever encountered this problem ? Thanks !

Android Solutions


Solution 1 - Android

You should downgrade Chrome. Problem with the latest Chrome/Chromium release https://github.com/facebook/stetho/issues/696

Solution 2 - Android

As a workaround you can use other browser based on Chromium, for example:

where you can also use chrome://inspect/#devices address to check your database content.

The biggest disadvantage at this moment is that you cannot view the shared preferences (which was possible on Chromium 88)

Solution 3 - Android

Until better solution is found you can download portable Google Chrome version 87.0.4280.88 and use it particularly for debugging. This way you don't need to downgrade your main Google Chrome app - you use both apps simultaneously.

GoogleChromePortable_87.0.4280.88_online.paf.exe

https://sourceforge.net/projects/portableapps/files/Google%20Chrome%20Portable/

Solution 4 - Android

For those who want to avoid downgrading Chrome but still want to visualize their databases: Stetho is a great tool, but I've just discovered it's no longer a must-have thanks to improvements in Android Studio

In recent versions of Android studio it's possible to go to the App Inspection and then Database Inspector to do the same inspections and operations on Room databases as Stetho offers.

Solution 5 - Android

You can use this https://github.com/itkacher/OkHttpProfiler to check api and it's response like Stetho library in android studio.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionKilian P.View Question on Stackoverflow
Solution 1 - AndroidWarrockerView Answer on Stackoverflow
Solution 2 - AndroidBokenView Answer on Stackoverflow
Solution 3 - AndroidEgisView Answer on Stackoverflow
Solution 4 - AndroidNick CardosoView Answer on Stackoverflow
Solution 5 - AndroidpssView Answer on Stackoverflow