google / ios-webkit-debug-proxy

A DevTools proxy (Chrome Remote Debugging Protocol) for iOS devices (Safari Remote Web Inspector).
BSD 3-Clause "New" or "Revised" License
5.88k stars 461 forks source link

Unable to get target page in inspect window on MacOS #413

Closed EzioLi01 closed 2 weeks ago

EzioLi01 commented 2 weeks ago

Hey experts,

Please check if it's an issue or expected behavior.

Repo steps:

  1. Open app in ios simulator
  2. Start proxy like ios_webkit_debug_proxy -c null:9220,:9223-9322 -s unix:/private/tmp/com.apple.launchd.AdE5als0Ax/com.apple.webinspectord_sim.socket
  3. Open edge or chrome://inspect/#devices
  4. Can get correct target and file in target list, click inspect

Result: Empty inspect window is displayed

Attach simulator info:

[
    {
        "devtoolsFrontendUrl": "/devtools/devtools.html?ws=localhost:9223/devtools/page/1",
        "faviconUrl": "",
        "thumbnailUrl": "/thumb/file:///Users/ezio/Library/Developer/CoreSimulator/Devices/31B90FF9-20F1-42BA-A848-462996D6F53F/data/Containers/Bundle/Application/37EDF797-19E1-4922-A1D9-EB66ECC3D904/helloCordova4.app/www/index.html",
        "title": "Hello World",
        "url": "file:///Users/ezio/Library/Developer/CoreSimulator/Devices/31B90FF9-20F1-42BA-A848-462996D6F53F/data/Containers/Bundle/Application/37EDF797-19E1-4922-A1D9-EB66ECC3D904/helloCordova4.app/www/index.html",
        "webSocketDebuggerUrl": "ws://localhost:9223/devtools/page/1",
        "appId": "PID:4130"
    }
]
EzioLi01 commented 2 weeks ago

The inspected file is in .app file, in MacOS it will be recognized as an application package rather than a folder(in Windows). I'm not sure if chrome devtools can attach into ios application content.

In below image, .app package cannot open as folder in devtools source tab on MacOS, but in windows it's working.

Screenshot 2024-05-17 at 15 27 44
artygus commented 2 weeks ago

Hi @EzioLi01, please check out this readme section https://github.com/google/ios-webkit-debug-proxy?tab=readme-ov-file#using-with-devtools. Unfortunately newer versions of Chrome DevTools aren't compatible with Safari dev tools protocol, but there are alternatives.

EzioLi01 commented 2 weeks ago

Thanks @artygus for the quick reply, so it means that this should be the knows limitation as expected on chrome devtools?

artygus commented 2 weeks ago

yes, I'd say it's unworkable with chrome dev tools at this point. since you're on mac already, why don't you use safari for inspecting pages? 😅

EzioLi01 commented 2 weeks ago

yes, I'd say it's unworkable with chrome dev tools at this point. since you're on mac already, why don't you use safari for inspecting pages? 😅

Yes, I've started using it. Thanks for the information! I'll close this issue.