Skip to main content
dietrich

Upcoming changes to the Jetpack Widget API

Between bug 612169 and bug 569479, the widget API has undergone a major transformation in the upcoming 0.10 SDK release.

Both sets of changes have made the API more compact, reducing the amount of code required to build widgets. The Electrolysis (e10s) changes are in preparation for moving Jetpack code out of the main Firefox process. They also make the widget API significantly more powerful, combining the current widget functionality with content scripts.

The e10s changes have affected the API to a significant degree; your widgets will certainly require more than just cosmetic changes. I was worried at first that the e10s changes would complicate things, causing more verbose code patterns, and tricky message sequences to wire things together. However, the opposite was true: The documentation examples and the automated test code were both more compact and simpler after I'd rewritten them to use the new API.

Here's an example widget that shows the Facebook profile pic of the most recent friend in your news feed:

require("widget").Widget(\{
  label: "Latest Friend",
  contentURL: "https://www.facebook.com/home.php",
  contentScript: "document.location = document.querySelector('.profilePic').src;",
  contentScriptWhen: "ready",
  onClick: function() require("tabs").tabs.active.location = this.contentURL
\});

Hmmm, with the page-worker module, querySelectorAll and some hot timer action, you could have a Rockmelt-y bar...

A summary of the API changes: