mpotthoff / vscode-android-webview-debug Goto Github PK

This extension works great and was easy to setup. Nice work. However, our app uses multiple webviews for a split screen sort of view. It would be nice to have a configuration option to either configure an optional index of some sort to say "select the 2nd webview" instead; perhaps even some way to switch between them. Even just a dialog at startup to select which one if multiple webviews are detected.

I might do this myself and see what I can come up and submit a PR later this weekend.

Hello,

TL;DR:
I'm trying to install the android webview debugger but trying to use it always issue an error saying that the JS debugger wasn't loaded.

I've tried to install the extension but it fails to launch.
I installed the JS debugger and the android-webview-debugging tool.

I've added the following configuration in my launch.json :

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "android-webview",
            "request": "attach",
            "name": "Attach to Android WebView",
            "device": "XXXXXXXXXXXXXX",
            "webRoot": "${workspaceFolder}",
            "urlFilter": "*"
        }
    ]
}

My device is up and running and I can see it through the adb -H 10.0.2.2 -P 5037 devices command (I access my working environment through a remote ssh session in a virtualbox VM).

But when I try to start a debugging session, I get a popup with the following :

Couldn't find a debug adapter descriptor for debug type 'android-webview' (extension might have failed to activate).

and the console of dev tools gives me the following :

Cannot activate the 'Android WebView Debugging' extension because it depends on the 'JavaScript Debugger' extension, which is not loaded. Would you like to reload the window to load the extension?

Reloading VSC doesn't seem to change anything.

I hope I post this in the right place, I searched in the previous issues and I found nothing that seemed related.

How could I investigate/fix that ?

has anyone had this issue?

i set a breakpoint, however...it's not a solid red. it says 'unbound breakpoint.'

has anyone seen this? I've seen it before in other project but forgot how it was fixed

First up .. a massive Thank You. I badly needed this plugin.
I'm trying to debug a mobile app built with quasar-framework.
Quasar generates webpack compressed JS & CSS with source maps via this command line:

 quasar build -m pwa -debug

So I'm wondering how do I get the VSCode debugger to use these source maps?

Tony's "Thank You" Tip:
I used to use a QR code open the web app on the mobile device.
I now just scan a NFC chip ... much faster and simpler.

I use Ionic/Angular and I'm trying to debug on android emulator (note: I start debugging when the emulator is up and running), When I start debugging I get this error spawn path-to-adb EACCES

I've added the following configuration in my launch.json as described in ionic debugging guide

{
    "version": "0.2.0",
    "configurations": [
      {
        "type": "android-webview",
        "request": "attach",
        "name": "Attach to Android WebView",
        "webRoot": "${workspaceFolder}/www",
        "sourceMaps": true,
        "sourceMapPathOverrides": {
          "webpack:/*": "${workspaceFolder}/*"
        }
      }
    ]
  }

Note:
My machine is on MacOS 12.4
I tried changing permissions to the adb path but it didn't work
Reloading VSC doesn't seem to change anything.

Is it possible to add the Extension to the OpenVSX Store?

The OpenVSX store is an alternative to the proprietary and vendor-dependend store backend used by Microsoft.
VSCodium - an fully open source distribution of Visual Studio Code uses OpenVSX as a replacement to the Microsoft Store.

The guide on how to add extensions can be found here: https://github.com/eclipse/openvsx/wiki/Publishing-Extensions

Hi,

i am now playing around and try to get this plugin working but i have setup issues.
First: All the prerequisites are done. I see the device in chrome://inspect/#devices. I can launch the plugin. If i have a debugger statement present vscode is showing the javascript for it.

But:

• I am failing to get the website displayed on the mobile with F5. If i manually open it using chrome://inspect/#devices the debugger statement lands in vscode. Sadly #1 did not mentino how he solved it. On my side it´s a classic start-react-app project using typescript and webpacked javascript. Launching the Plugin simply shows no change on the mobile. It just stays the same as if i just opened chrome.

• VSCode is complaining about the webRoot Attribute in the launch config. How do i specify the properl url the android chrome application should load.
  

Thanks in advance,

Jan

I get the following error cat: /proc/net/unix: Permission denied" after selecting my device.

I am using version 1.2.2 in VS Code version 1.87.2 on MacOS 13.6.4.

Previously I could attach to a webview on an android device that was connected to this machine. Even an older device (e.g., Android 9) worked well.

Now whenever I attempt to connect it always reports "No devices found". However, opening chrome://inspect on the same machine shows devices and I am able to connect and debug using the Chrome DevTools. Also, adb devices from the command line shows the connected device.

I am at a loss. And I really miss having this work correctly.

Depending on different timing aspects, the extension reports, that no device is hosting a webview to connect to, which is correct, but caused by the application not having completely started yet. Switching between "Launch" and "Attach" mode is tedious. Having the ability to increase the timeout for finding a webview would be great.