artygus / webkit-webinspector

Standalone Webkit WebInspector frontend extracted from Webkit sources

webkit-webinspector

Standalone Webkit WebInspector frontend extracted from Webkit sources. This is a merely experimental project for local debugging needs, if you're looking for a more user-friendly soultion checkout the ios-safari-remote-debug-kit project.

Usage

To debug iOS devices you need to have ios-webkit-debug-proxy installed and running.

To start WebInspectorUI run

yarn start

By default server will start on 8080, you can change server port providing the command-line argument, e.g. yarn start 8000. Press CTRL+C to quit.

Navigate to http://localhost:8080/Main.html?ws=localhost:9222/devtools/page/1. ws=... part can be taken from http://localhost:9222, "frontend" page of ios-webkit-debug-proxy tool.

Command protocols

Command protocol and WebInspectorUI capabilities may vary depending on iOS version. To list all available command protocols run

yarn start -P list

By default the latest command protocol available in checked in WebInspectorUI is used.

Update

Clone WebInspectorUI to temp dir

rm -rf tmp/
git clone https://github.com/WebKit/WebKit.git --depth 1 tmp/webkit

Copy WebInspectorUI to serve dir

cp -R tmp/webkit/Source/WebInspectorUI/UserInterface lib/WebInspectorUI/latest

webkit-webinspector's Issues

TypeError: document.getCSSCanvasContext is not a function

The document.getCSSCanvasContext function was removed from Chrome 48+. This causes the web inspector to crash with that error message.

This function was used to draw some graphic elements by setting background-image: -webkit-canvas in their style. Such constructs should be replaced by either static images or generated on the fly and referenced in styles by another mechanism (e.g. data or blob URLs).

At best WebKit code should be patched automatically on build, so it could be easily updated.

Spiritual successor?

Hey! I found your project was genius, so I took inspiration from it and decided to make an automated script that works with the latest version of WebKit. You can find it here: https://github.com/HimbeersaftLP/ios-safari-remote-debug-kit

It'd be cool if you could link it in your README (and maybe also the README of https://github.com/artygus/devtools-compat-proxy) or something, as it looks like you abandoned the project and there is no other free option for remote debugging iOS Safari on non-Macs.