Google Chrome Inspect devices failed - google-chrome-devtools

I faced some situation where the web app I developed worked differently (with errors) in a portable device than in computer. Then some googling took me to Inspect device feature of Google Chrome. After successfully connecting the phone to PC, I just clicked the inspect link for the corresponding tab.
Some internet resources said that some appspot link must be accessible. And, I verified it too. It is accessible from PC.
One mentioned try to open another inspect element window from the momentary devtool window by hitting Ctrl + Shift + I. It worked once out of many times and closed after a few seconds.
Configuration
Development system: Chrome 51.0.2704.19 dev-m (64-bit) running on Windows 10
On Device: Chrome 49.0.2623.105 running on Android 4.4.2
PS: Please, comment if any additional resources required to solve this issue

Related

code-server on a Chromebook doesn't show any target devices and I cannot debug my Flutter project

I installed code-server on a Pixelbook Go (x86 Intel i3 with 8GB RAM, 64 GB SSD). I installed it as a user, not a root, not sure if that's a problem or not. The code-server service is enabled and starts when I start the Developer Linux VM (penguin). As far as I know I'm upgraded to the latest Crostini (104.0.5112.83) and the VM is a Bullseye Debian, I installed it not so long ago.
Outside of the VM I started the Chrome browser and I can view the GUI portion of the code-server by visiting http://localhost:8080 (as per .config/code-server/config.yaml). I installed the Flutter and the Dart extensions in the GUI. I also opened the root folder of my Flutter project (which is a regular project (https://github.com/TrackMyIndoorWorkout/TrackMyIndoorWorkout): no embedded or multi-module things in it).
I connected my phone (OnePlus Nord, Android 12), it displayed the bottom sheet related to the connection and I allowed Transfer. The Crostini detected this connection and popped up a notification about it. I could use that notification bubble to shuttle to the connected USB devices settings and enabled the Nord device.
Here is where things started to differ from starting the "regular" VS Code (installed into the penguin VM from a package) itself: VS Code shows a device selection in the footer section, which lists target devices such as the Pixelbook Go and also the Nord (AC2003) - see screenshot later. However the GUI of the code-server doesn't have selector for the devices. When I start to initiate a debug session it displays an error message:
Unable to launch Flutter project in a Dart-only workspace. Please open a folder close to your Flutter project root or increase the value of the "dart.projectSearchDepth" setting.
Here is how it should look like in the "regular" VS Code:
I opened the root folder of the Flutter project just as I did when I use the "regular" VS Code, so this project search depth doesn't make any sense to me, the dart files are there including the main.dart in the lib folder. And the VS Code kinda works, except that the build hangs due to possibly low resources, hence I'm trying to get code-server working so I can migrate at least the VS Code GUI portion out of the anemic VM. I suspect that the main problem might not be the Flutter / Dart settings, but first I have to figure out whey the GUI doesn't show a device selector. Then I can lament on this error message if still persists.
How to proceed?

Remote debugging Chrome on Android while offline

If I'm on a plane or do not have connectivity, remote debugging Chrome on Android fails with a blank window. What can I do?
When you remote debug, Chrome need a version of devtools that matches your mobile browser version. So it loads that specific version off the network. Once they are downloaded, they are kept in AppCache, so you only need to have network available once.
So as long as you start debugging a device (that particular Chrome version) once while you're online, you should then have all those files available later when you're offline.
But there's another workaround to avoid downloading the devtools version:
follow the instructions of https://developer.chrome.com/devtools/docs/remote-debugging-legacy down to (and including) the adb forward tcp:9222 ... section.
open http://localhost:9222/json/list (on your desktop)
find the tab you care about and copy the webSocketDebuggerUrl of it
wsurl = webSocketDebuggerUrl.replace('ws://','')
open this URL (on your desktop):
chrome-devtools://devtools/bundled/inspector.html?ws=${wsurl}
This will use your desktop's locally installed version of DevTools to inspect the phone. There is a possibility of a compatibility problem, but hopefully it should be small.

emulator broken: This adb server's $ADB_VENDOR_KEYS is not set

Well a windows 10 update broke sleep, the computer went to sleep with the emulator open and now that's broken. When I run an app to launch in the emulator it will boot the emulator but won't install just time out. When I try and run an app into a running emulator instance Studio says:
com.android.ddmlib.AdbCommandRejectedException: device unauthorized.
This adb server's $ADB_VENDOR_KEYS is not set
Try 'adb kill-server' if that seems wrong.
Otherwise check for a confirmation dialog on your device.
Error while Installing APK
I've followed some of the other threads here. I've tried changing
the environmental variable in control panel, but in fact I think it
pointed to the right place originally, where the sdks are these
days.
I've tried restarting the PC. I did try deleting a couple of
adb files, that didn't work.
I've tried deleting all the sdks and
downloading them again.
I've tried uninstalling and updating Android
Studio, several times. Now on AS 3.1, still not working.
Bit of a nightmare really.
How do I set the vendor keys? Using AS console commands? Can anyone point me to a dummies guide, this is a bit of a tangent for me, wish I could fix it from the GUI.
The working fix for this particular issue is to enable Developer options on your emulator and enable "USB Debugging".
OK so eventually downloading a nexus 4 x86 image android 27, with no play store worked. Sorry if this is repetition. Long live working emulators
Combining answers from here and there gives an answer that also worked for me in IntelliJ IDEA. I assume the issue is the same, since the emulator and AVD is the same.
Option 1:
Restart the emulator from AVD
Option 2:
Wipe the emulator data
Option 3: Stop the emulator. Then make sure it is up to date and try again.
If it still does not work, restart the adb server and retry.
adb kill-server && adb start-server
If it still does not work, perhaps your adb is out of date... somehow. This was the case for me. Running the following fixed that for me.
adb devices
adb server is out of date. killing...
* daemon started successfully *
List of devices attached
emulator-5554 device
If it is now working for some emulators but not newly created ones, take note of the message in the emulator selection box: "Press Ok in the Allow USB Debugging Dialog"
Sadly, there is no such dialog. So go and enable Developer Mode in the settings of your emulated OS by tapping the Build Number several times. Then go to the Developer Settings and enable USB debugging.
After recent upgrades of emulator, the virtual device*) stays unauthorized. When I cold boot the emulator, sometimes I see the expected confirmation dialog, but this dialog goes away immediately, leaving no chance to click 'OK'.
We're aware of this problem and plan to fix it soon.
* Here, I was running x86 with API 28 and Google Play on Windows 10. I don't know which other scenarios are effected.
For anyone who might encounter this in the future -- I mean the ultimate issue of receiving the error, "This adb server's $ADB_VENDOR_KEYS is not set" despite not having any (or any sufficient) opportunity to click OK...
Resolution: In the Developer Settings, select the option to, "Remove existing authorized adb keys on device." Repeat the previous action -- the prompt will once again appear, as if the very first time.
-Mike
Go to developer options in your device and click on 'Revoke USB debugging authorizations'. Disconnect and reconnect your device. You'll get a prompt on your device to authorize your computer to connect to your device. click on 'OK' and your set.
Basically, the authorization key has gone out of date or it's no longer present. So, we just have to set a new autorization key and revoke the old ones.

Troubleshoot Android 4.3 webview within an app that requires up-to-date Google Play services

I need to troubleshoot an issue happening in a webview running within my app. This issue only occurs on Android versions lower or equal to 4.3. My app requires an up to date version of Google Play services.
In order to troubleshoot my webview, I usually can run my app under the Android Emulator (with the latest version of Android), then connect to the web view via Chrome (using chrome://inspect) - the web view appears in Chrome and I'm able to browse the DOM and debug.
To run the app under 4.3, I've created (under AVD) a new device from an existing device definition,
then picked the target Google APIs (Google Inc.) - API Level 18. I've then installed my app, but when trying to run it, I get the error message "This app won't run unless you update Google Play services.". There's an "Update" button on the previous dialog, but nothing happen when clicking on it.
I then tried to debug my issue using Genymotion. I've created a device under 4.3, followed these instructions to flash my device with the latest Google Play services and installed my app. I can now run the app and reproduce the issue within this simulated environment.
The trick now is to be able to connect to the web view from my local Chrome browser. I've enabled remote debugging as described here. Now my device appears in Chrome, but the web view is not showing up in the inspector. Similarly, if I open a new tab under the native browser, it won't show up in the remote inspector. If I open a new tab under Android Chrome though, I can see it showing up under my remote Chrome inspector.
I can see two way moving forward and successfully accessing to the DOM of my webview:
Fixing the "Update" issue under the Android Emulator running 4.3
Or
Connecting to my web view from my Chrome inspector while running the app under Genymotion
Any idea on how to solve one of these two problems?
I have been using weinre for sometimes. it's a pretty good tool to debug webview for android 4.3 and lower. It provides almost same interface as chrome debugger.
All you need to do are:
Install weinre
sudo npm -g install weinre
Client side:
Insert the following code to your webpage <head> section.
Note: it's better to put it at end of <head> section, otherwise there will be some strange errors and debugger won't show up.
<script src="http://<your server ip here>:8081/target/target-script-min.js"></script>
Server side
weinre --boundHost -all- --httpPort 8081
Debugger
open the debugger tool from weinre from your desktop browser:
http://localhost:8081/client/
Finally,
select any target in Targets part and then start debugging.
Remote debugging web views only works on devices with android 4.4 and above.
have a look at this :
https://developer.chrome.com/devtools/docs/remote-debugging

Android Emulator 'No Service'

I am new to both the android and android development so I'm not on familiar ground here.
When I start the emulator I have no service. Therefore I have no internet connection on the emulator.
I am running Windows 7 and I generally run the emulator via eclipse.
My host machine is connected to the internet via the Local Area Network. There is no proxy.
I have tried:
Disabling all network adapters except for the Local Area Network [link]
Running the emulator from cmd line with: emulator -avd -dns-server 8.8.8.8
Reinstalling the SDK Tools 9 and Platform Tools (rev 2).
Restarting the machine! :P
Is there a setup needed to specify to simulate a 3G connection? Or could this be a Windows 7 permissions issue? Or am I doomed like these folks: link link
Ah! found the solution.. I uninstalled the entire SDK and reinstalled it to C:/Android. I deleted the C:/Users/[your-name]/.android folder and recreated an avd. Voila.. Something in there worked!
[edit]
Actually it looks like you have to keep restarting the emulator until it connects. I will often get no service so I restart a bunch of times till it works.
I found that 'Airplane Mode' was enabled by default in the standalone android emulator - this may also be the cause in the sdk version. Turning this off (by holding down the red power button until the menu came up, and then toggling the airplane mode button/section) allowed the emulator to 'find service' and connect properly through the LAN.