Of course there is a very nice debugger built into Chrome, and that does a lot to undermine the incentives to build something else in Emacs. I only recently discovered there is a more powerful version of that debugger.
Safari and Chrome, because they have Webkit in common, can be asked on start-up to provide “Remote Webkit Debug” connections. You invoke ’em with a switch, and they then listen (i.e.
open -a 'Google Chrome' --args --remote-debugging-port=9222). Bear in mind that this Debug protocol is quite invasive, i.e. it’s security risk. Having done that it’s fun, educational, and trivial to look at the inside of your browser session, just visit . Tools that use this protocol use the json variant rooted at .
Slime is a venerable Emacs extension originally developed to interact with Common Lisp processes. It does that via a protocol called swank. Which means that unlike, for example, emacs shell mode there is a real protocol. The sweet thing about slime/swank is that it provides a wide window into the process enabling all kinds of desirable things, at least for Common lisp, like: inspecting object, redefining single functions, debugging, thread management, etc. etc. In the video you can he’s managed to get a swank like connection into a browser tab and this lets him define functions and dynamically tinker with the tab.
The plumbing is wonderfully messy. A node.js process acts as an intermediary. Bridging between swank (for the benefit of Emacs) and a web socket based debugging protocol for that hooks into the browser. I assume that web socket protocol is similar, if not identical, to the remote WebKit debug protocol. In the video the Emacs command M-x slime-jack-into-browser establishes the pipeline, and reading that code is enlightening.
The swank-js github instructions are pretty good. And they explain how to uses swank-js with node.js – though that assumes your reasonably comfortable with node.js already. I don’t actually follow those instructions. Instead, after including swank-js in my projects’ dependencies, as the instructions suggest, I
require('swank-js') in my main module (only when in a development mode of course). It’s worth noting that when you then slime-connect to your node.js program you’ll be in the global object. Your actual program (usually found in the file server.js) will have been wrapped up in a function and hence it’s locals variables are invisible to you. I work around that by putting interesting state into an object and then do something like
global.interesting = interesting.
Recall the remote WebKit debug protocol? There is a clone of that for node.js known as node-inspector. Use it!
If you don’t use slime already you might be able to install these using the usual Emacs package repositories. I ran into problems with that because I use a very fresh slime/swank and the Emacs package system wanted to bless me with older variants.
Hope this helps.