Interactive HTML development in Emacs

I accidentally discovered mozrepl today. It’s clearly designed for JavaScript development, but I thought it might be interesting for HTML development as well, and hacked the following together:

(require 'moz)
(require 'json)
 
(defun moz-update (&rest ignored)
  "Update the remote mozrepl instance"
  (interactive)
  (comint-send-string (inferior-moz-process)
    (concat "content.document.body.innerHTML="
             (json-encode (buffer-string)) ";")))
 
(defun moz-enable-auto-update ()
  "Automatically the remote mozrepl when this buffer changes"
  (interactive)
  (add-hook 'after-change-functions 'moz-update t t))
 
(defun moz-disable-auto-update ()
  "Disable automatic mozrepl updates"
  (interactive)
  (remove-hook 'after-change-functions 'moz-update t))

With this, Firefox will update its HTML contents as you type, for whatever buffer you’ve called moz-enable-auto-update on.

It took about five minutes to write, and another five to comment and put up here. I’ve been using it for a few hours now and haven’t found any real problems.

Edit: You’ll already need mozrepl installed, and the mozrepl emacs integration setup..

Edit: Fixed link. Thanks.

4 Comments

  1. Vincent Murphy says:

    Don’t you mean this mozrepl emacs integration setup:

    http://wiki.github.com/bard/mozrepl/emacs-integration

    Check your link; I found this on reddit.

  2. Paul Swartz says:

    Works great for normal HTML pages. However, it doesn’t do anything for updates to or tags. I tried poking around with it a bit to try to resolve the issue, but I’ve gotta get back to work. :)

  3. Really nice idea!

    It would be useful to have this for css as well.

  4. bard says:

    Neat. :)

    I added a link in the “Related work” section on http://wiki.github.com/bard/mozrepl

Leave a Reply