-->

how to enable WebKit's remote debugging/inspec

2019-01-14 22:53发布

问题:

I need to inspect javascript execution (webview widget) in an android application, while debugging; through SDK & usb cable and/or http/websockets; from destop computer (e.g. chrome running on desktop).

Webkit's sources includes DebuggerServer implementation ( platform_external_webkit\Source\WebKit\android\wds\DebugServer.cpp ) accessible at cpp level, and bound if flag WDS is enabled (at build time?)

Source\WebKit\android\jni\WebCoreFrameBridge.cpp:#if ENABLE(WDS) Source\WebKit\android\jni\WebCoreFrameBridge.cpp: WDS::server()->addFrame(frame);

The default port for server is 9999

The sources show that all is implemented (at Cpp level) to enable the feature, but I have not found any reference searching the web for experiences using live debugging at javascript level in adroid devices automating webkit's inspector interface.

1.- Are the feature present, in binary form, executing in actual android devices? (has adroid's distribution of webkit been built without WDS flag enabled? :-( )

2.- Can the remote debug feature be enabled/used from javascript or application (at java level) e.g. at startup of app?

3.- In case it is possible to enable the webkit inspector/debugger feature, how to make it possible to interact from remote application ? (e.g. from another javascript app using websockets, or chrome on desktop computers).

Some paragraphs explaining the mechanics like https://developers.google.com/chrome-developer-tools/docs/remote-debugging#remote would be nice!

thanks in advance for any information, or references about this topic. I consider important to enable remote debugging (in the device) at javascript level to make it possible modern development of HTML5 applications and happy debugging experience.

cheers, Ale.

回答1:

For android >= 4.4 (kitkat)

See Remote debugging on Android with Chrome

For android < 4.4 (Lower versions)

Use very good open source tool: weinre. See this video for help to use it. If you are familiar with grunt then you can use grunt-weinre

For quick view:

  1. install weinre using npm
  2. Do the configuration in your gruntfile.
  3. Run the weinre grunt task.
  4. Use this script to inject the weinre target code into your web page.
  1. Open http://localhost:8082 in your browser and you will find devices running above script. You can debug all this devices.

NOTE: if you want to debug webview/browser in your mobile device then you need to replace localhost with your machine's IP running weinre. And yes, all the devices should be on the same network.



回答2:

Now it is easy with Android 4.4. See https://developers.google.com/chrome-developer-tools/docs/remote-debugging#debugging-webviews



回答3:

You can do remote debugging targeting the Android Browser with the weinre project. Or use Chrome remote debugging with the Chrome for Android browser. As far as I know, you can't target a WebView directly, but targeting the Android Browser should get you close.



回答4:

It cannot be done, because the debugger backend code is not there. The source code you are referencing to is a copy of webkit source in android, but it is not compiled into android release bits.



回答5:

Pre KitKat jsHyBugger works well ( trial version and annual single user license €29 )

( I have no connection to the developers / have purchased a license )