ti-debug

Server-side components for WebKit Remote Debugging

npm install ti-debug
4 downloads in the last month

Server-side debugging engines using the WebKit remote debugger.

Prerequisites

At a minimum this requires node and npm to get started. I am currently using:

$ node -v
v0.10.1
$ npm -v
1.2.15

For best results, use a recent WebKit-based browser like Google Chrome or Apple Safari to connect to the ti-debug server.

Installation

git clone https://github.com/dpb587/ti-debug
cd ti-debug/
npm install

Usage

By default bin/ti-debug will start a web server on localhost:9222 for you to connect and get started debugging. When a new debug session is available the page will redirect to the debugging tools for the session. To see a full list of configuration options run bin/ti-debug --help.

DBGp

The DBGp service is enabled by default. Simple run bin/ti-debug, point your browser to localhost:9222, and configure your DBGp engine to connect to the DBGp client at localhost:9000. If you need to support multiple developers, enable the DBGp proxy server by adding the --dbgp-proxy option to the command - both browser-based and IDEs are supported.

PHP

You'll probably want to ensure the xdebug extension is installed and configured.

See Also:

Python

You'll probably want to ensure the komodo-remote-debugging module is installed. Be sure to invoke scripts with the included pydbgp.

See Also:

Functionality

Feature DBGp
php/xdebug
DBGp
python/komodo
stepping – into
 

 
stepping – over
 

 
stepping – out
 

 
stepping – resume
 

 
stepping – break
 

 
variable – popups
 

 
variable – functions
 

 
variable – editing
 

#7
breakpoints – add
 

 
breakpoints – remove
 

 
call stack – enumeration
 

 
call stack – jumping
 

 
source – viewing
 

 
source – highlighting
 

 
console
 

#6
dbgp-specific – proxying (browser)
 

 
dbgp-specific – proxying (ide)
 

 

– full support
‡ – partial support
– no support

Architecture

The main purpose of ti-debug is to allow debugging protocols to be accessible through a browser interface. Currently the WebKit Inspector powers the interface and communications occur:

frontend debugger <-- frontend protocol --> ti-debug <-- debugger protocol --> debugger engine

In the case of DBGp, a client is started to wait for connections from the DBGp server. When a connection is received, it checks to see if there's a browser waiting to debug and creates a debug session for the browser to connect to. From there, Inspector-friendly agents handle translating DBGp commands into WebKit commands. For example:


      inspector > ti-debug: {
                                "method": "Debugger.stepOver",
                                "id": 43
                            }
    ti-debug > dbgp-engine: step_over -i 19
    dbgp-engine > ti-debug: <response ... command="step_over" transaction_id="19" status="break" reason="ok">
                                <xdebug:message filename="file:///home/vagrant/dist/public/wordpress/wp-blog-header.php" lineno="10"></xdebug:message>
                            </response>
    ti-debug > dbgp-engine: stack_get -i 20
    dbgp-engine > ti-debug: <response ... command="stack_get" transaction_id="20">
                                <stack where="require" level="0" type="file" filename="file:///home/vagrant/dist/public/wordpress/wp-blog-header.php" lineno="10"></stack>
                                <stack where="{main}" level="1" type="file" filename="file:///home/vagrant/dist/public/index.php" lineno="1"></stack>
                            </response>
    ti-debug > dbgp-engine: context_names -i 21 -d 0
    dbgp-engine > ti-debug: <response ... command="context_names" transaction_id="21">
                                <context name="Locals" id="0"></context>
                                <context name="Superglobals" id="1"></context>
                            </response>
    ti-debug > dbgp-engine: context_names -i 22 -d 1
    dbgp-engine > ti-debug: <response ... command="context_names" transaction_id="22">
                                <context name="Locals" id="0"></context>
                                <context name="Superglobals" id="1"></context>
                            </response>
      ti-debug > inspector: {
                                "method": "Debugger.paused",
                                "params": {
                                    "callFrames": [{
                                        "callFrameId": "0",
                                        "functionName": "require",
                                        "location": {
                                            "scriptId": "file:///home/vagrant/dist/public/wordpress/wp-blog-header.php",
                                            "lineNumber": 9,
                                            "columnNumber": 0
                                        },
                                        "scopeChain": [{
                                            "type": "local",
                                            "object": {
                                                "type": "object",
                                                "objectId": "|lvl0|ctx0"
                                            }
                                        }, {
                                            "type": "global",
                                            "object": {
                                                "type": "object",
                                                "objectId": "|lvl0|ctx1"
                                            }
                                        }],
                                        "this": null
                                    }, {
                                        "callFrameId": "1",
                                        "functionName": "{main}",
                                        "location": {
                                            "scriptId": "file:///home/vagrant/dist/public/index.php",
                                            "lineNumber": 0,
                                            "columnNumber": 0
                                        },
                                        "scopeChain": [{
                                            "type": "local",
                                            "object": {
                                                "type": "object",
                                                "objectId": "|lvl1|ctx0"
                                            }
                                        }, {
                                            "type": "global",
                                            "object": {
                                                "type": "object",
                                                "objectId": "|lvl1|ctx1"
                                            }
                                        }],
                                        "this": null
                                    }],
                                    "reason": "other"
                                }
                            }

References

Credits

License

MIT License

npm loves you