Introducing MicroXUL: A rapid XUL prototyping mini-project

(tl;dr) I’ve started a XUL editing miniproject, and I’m looking for volunteers to help build it out.

screenshot of MicroXUL editor's layout page

Which came first, the chicken or the egg?  It’s an old question:  conceptually, one had to exist to create the other.

My prototype XML editor project, Verbosio, is XUL-based.  XUL is an XML language.  So to edit XUL, I need a XML editor.  To build my XML editor, I need to edit XUL.  So which comes first?

Chicken, meet egg.  I’ve started work on a “MicroXUL” editing tool to help rapidly experiment with XUL user interfaces and XBL bindings.  It’s extremely primitive, but this is a proof-of-concept.

I’ve been using (and continue to use) the excellent Komodo Edit environment to develop pieces of Verbosio, including MicroXUL.  The screenshot above represents one wizard page where the user can type XUL markup into one panel, and see the rendered XUL in another, on-the-fly.  From this one wizard page and Komodo Edit, I hope to build out the rest of MicroXUL (and Verbosio) with a number of useful features:

  • XUL Project Details
  • Basic XUL Layout
  • Widget-specific wizard pages (based on analysis)
  • Images & Styling
  • Event Listener Declarations
  • Label & Access Key Internationalization
  • Keys and Commands
  • JavaScript controller object properties
  • Complete event handlers
  • Packaging of the XUL
  • Testing support
  • Documentation
  • Checklist
  • XUL menus shown through a XUL tree
  • XUL-to-XBL conversion tools
  • Editing existing XUL fragments from Firefox, Thunderbird, etc.
  • Editing MicroXUL itself
  • Drag & Drop of known XUL markup elements into the editing space

This project uses XULRunner (27+ required, currently in Aurora), Python 2.7 for building & launching, Jasmine 1.3 for automated testing, and CodeMirror 3.19 for syntax highlighting.

I started this because I realized I needed new XUL controls and XBL bindings to support new capabilities, such as a XUL user interface for the new Log.jsm architecture in Firefox 27.  I couldn’t use Verbosio yet, nor its templates system, since those haven’t been built out yet.  But I had just enough pieces from previous work, including my virtual:// protocol handler concepts from seven years ago, to put together a quick & dirty XUL editing interface.

Checkout and build instructions:

  1. hg clone http://hg.code.sf.net/p/verbosio/microxul/code microxul
  2. cd microxul
  3. ./project.py –update-sdk=aurora run
  4. (Mac users for the moment) ./project.py –browser (path/to/Firefox/27/Contents/MacOS/firefox)

Obviously, there’s a lot of work to be done on MicroXUL before it’s usable.  But the project is open under MPL / LGPL / GPL.  If you have a pain point with authoring XUL, this is a good playground to try fixing those pain points!  Your help and experimentation are both welcome.

Project page: https://sourceforge.net/p/verbosio/microxul .  If you need help and the SourceForge project pages don’t provide what you need, please leave a comment here and I’ll try to fix it.