WMPFDebugger icon indicating copy to clipboard operation
WMPFDebugger copied to clipboard
Published 2 months ago • verified publisher icon evi0s

Remote Debugging of the Built-in browser

Open mhmdibrahimm opened this issue 10 months ago • 6 comments

Hello,

We can see that when we click on any link in a chat, a window is opened and a web view is shown. I was wondering if this could be remote-debugged too. If so, could you guide me on where to start? Thank you.

mhmdibrahimm avatar Mar 18 '25 05:03 mhmdibrahimm

If that window (or web view, web page, etc.) supports remote debug then I guess the answer is yes, theoretically. However, I'm not so sure if that feature does exist so maybe verifying the remote-debugging feature's probably the first move, and how to trigger that. BTW, I've used to look into the devtools function handling (such as F12 or ctrl-shift-i) and that's all removed somehow.

evi0s avatar Mar 18 '25 21:03 evi0s

I found a way to do it on earlier versions of WeChat (v3.2.1.156). Maybe it could be adapted to the newer versions. I will give you a step-by-step in case you would like to investigate it.

  1. Download WeChat version v3.2.1.156
  2. Download devtools_resources.zip
  3. Extract devtools_resources.pak from the zip file
  4. Move devtools_resources.pak to C:\Program Files (x86)\Tencent\WeChat
  5. Open WeChat, go to any chat and open a link, right click and you will see an option to open devtools. Image
  6. You can also launch WeChat with the flag --remote-debugging-port=PORT to remote-debug the embedded Chromium browser. You will be able to retrieve the relevant pages Identifiers through localhost:PORT/json/list and access the devtools from your browser through: devtools://devtools/bundled/inspector.html?ws=localhost:<PORT>/devtools/page/<PAGE-ID>

mhmdibrahimm avatar Jun 12 '25 04:06 mhmdibrahimm

Seems interesting. I think that's the previous way to enable devtools (not remote debugging) on the embedded browsers, and it's also no longer working in old versions (I guess maybe started from 1xxxx). Remote debugging should be initiated by the "wechatdevtools" IDE, and I haven't seen any ways in that IDE to start a remote debugging session against a web page (it should have some ways to do so for web page debugging but I just can't find a way to trigger that). Anyway, thanks for sharing and I'm keeping looking into possible solutions

evi0s avatar Jun 17 '25 03:06 evi0s

Good news, I'm thinking it over-complicated. Turns out this tool already has the capability to enable the remote debugging of other tabs. You'll need to open a miniapp first. Simply navigate to Protocol Monitor, send command Target.getTargets to obtain all targets, and send Target.attachToTarget with the targetId of the page you want to debug. Now after the page is attached, you can switch to that tab in your Console tab, and that's all. I'll update a detailed tutorial. Thanks for looking.

evi0s avatar Oct 27 '25 17:10 evi0s

Good news, I'm thinking it over-complicated. Turns out this tool already has the capability to enable the remote debugging of other tabs. You'll need to open a miniapp first. Simply navigate to Protocol Monitor, send command Target.getTargets to obtain all targets, and send Target.attachToTarget with the targetId of the page you want to debug. Now after the page is attached, you can switch to that tab in your Console tab, and that's all. I'll update a detailed tutorial. Thanks for looking.

Waiting for your updates. Thank you.

mhmdibrahimm avatar Oct 27 '25 18:10 mhmdibrahimm

The workaround is published in https://github.com/evi0s/WMPFDebugger/commit/9ae553c4a10997dfc969175e8bbfaebd093e0115 (EXTENSION.md), feel free to test it and let me know if you have any questions.

evi0s avatar Nov 03 '25 22:11 evi0s