chrome inspector, remote debugging no longer works properly on my mobile app

Question

I have built a progressive web app using Cordova/Ionic. I have been using dev-tools to troubleshoot and analyze my apps inner workings for the better part of 3 years now. In the last few weeks however, i think since Chrome updated to v70+, dev-tools can no longer properly connect and/or manage the app running on my external device (several different test phones).

I have 4 Android test phones, and the same or almost the same issues are happening with dev-tools when connected to each device.

1. desktop keyboard and mouse do not work anymore - I can't use either to interact with the app on the phone anymore. As well, on some phones I can't use the element inspector (while on others that does work). But regardless of phone, I can't use the desktop mouse to click on app buttons in the web-view. Keyboard does not work on any of the devices either.

2. Often, even the native buttons in the app (directly on the phone) won't work if dev-tools has been opened to look at the app. If they do work, you press the button and like 10-15 seconds later the app finally responds.

3. When dev-tools is opened and connected to the device app, the response time of the apps is now extremely slow as well. Sometimes the app just crashes or I get messages saying "app not responding, wait or close?"

4. If I disconnect the phones from the desktop, and/or don't run dev-tools on the app, the app works and responds just fine. Something specific to dev-tools is causing all these problems.

The different phones have versions 5.1, 6.1.1 and 7.1 running on them for testing purposes. Again, dev-tools worked just fine until a few weeks ago. I recall various small issues impacting performance and web-view rendering in dev-tools, and now all of the above is impacting my ability to troubleshoot and analyze my app (developing).

My environment:

Cordova CLI: 8.0.0
cordova-android: 7.1.1
Gulp version:  CLI version 3.9.1
Gulp local:
Ionic Version: 1.3.4
Ionic CLI Version: 1.7.14
Ionic App Lib Version: 0.7.0
OS: Windows 7 SP1
Node Version: v6.10.3

Chrome: Version 70.0.3538.102 (Official Build) (64-bit)

I can't be certain, but I think all these issues began with Chrome updated itself to v70.+ On a side note, my app uses the "webview-plus" plugin....its an older plugin that enables certain inspection features and UI rendering. I removed it to see if maybe it was conflicting with dev-tools, but all the same problems still persisted.

Answer 1

I have the same issue, it worked fine some months ago, but it is now broken.

As a workaround, I tried to disable screencast, restart the app and then restart devtools and it worked!

Hope this helps!

Answer 2

The real problem is the latest android webview. All the element selection and mouse click doesn't work in latest android webview.

So, uninstall the android webview from Google Play store.

Download the older android webview version around 60

install it via adb with -r flag

adb install -r "/path/to/apk/com.google.android.webview_60.0.3112.78.apk"

This is a workaround until it is fixed in the latest webview.