Simplify Your Add-In Development with the Extensibility Tester Add-In

  • Article

I created the Extensibility Tester add-in to provide Expression Web 4 developers a way to test out ideas and troubleshoot their add-ins without the endless cycle of edit, save, and refresh.

ExtensibilityTesterPanel

The add-in panel lets developers evaluate JavaScript expressions from within the panel, giving access to the full extensibility model.  This allows add-in developers to interact with the Expression Web application while seeing all output, errors, and events that come from the interaction.

Click here to download the Extensibility Tester add-in. Once you’ve downloaded it, you can install it from within Expression Web 4 via the Add-Ins Manager under the Tools menu.

Using the Extensibility Tester Add-In

Once you have installed the Extensibility Tester add-in you can display it via Tools -> Extensibility Tester. Enter any JavaScript expression into the Input box and click Evaluate. The resulting output or error messages appear in the Output and Error boxes, respectively. Extensibility events are logged into the Events box as they are fired, with the most recent event on the top. The Clear All button clears all the textboxes if you want to start from a clean slate.

The JavaScript expression is evaluated within the global scope, so variables you create are available from evaluation to evaluation (instead of falling out of scope after the evaluation is completed and not being available). This can save you quite a bit of typing, but comes with one small gotcha: these variables are properties of the window object and must be declared without ‘var’ (see example in image above).

Here are a few expressions you can try to see some of the cool stuff you can do with the extensibility model:

  • xweb.document.selection.set(10,100);
  • Xweb.document.selection.insert(“text”);
  • xweb.application.newdocument("HTML 4.01 STRICT");
  • xweb.document.getElementsByTagName("div").length;
  • xweb.document.getScriptElementByCode("var foo = 1");
  • xweb.document.replaceRange(15, 20, "replacement");

Let me know what you think!

Erik Mikkelson
Software Development Engineer in Test, Expression Web