Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Merge branch 'master' into 821774

  • Loading branch information...
commit adc5bd2dd43b40b38482356ce4b85e0852fc8526 2 parents b1eea82 + b1a80d9
wbamberg wbamberg authored
Showing with 742 additions and 471 deletions.
  1. +2 −2 app-extension/install.rdf
  2. +9 −8 doc/dev-guide-source/cfx-tool.md
  3. +3 −3 doc/dev-guide-source/guides/content-scripts/accessing-the-dom.md
  4. +8 −8 doc/dev-guide-source/guides/content-scripts/communicating-with-other-scripts.md
  5. +3 −3 doc/dev-guide-source/guides/content-scripts/index.md
  6. +2 −2 doc/dev-guide-source/guides/content-scripts/loading.md
  7. +4 −4 doc/dev-guide-source/guides/content-scripts/reddit-example.md
  8. +4 −4 doc/dev-guide-source/guides/content-scripts/using-port.md
  9. +10 −10 doc/dev-guide-source/guides/content-scripts/using-postmessage.md
  10. +6 −6 doc/dev-guide-source/guides/events.md
  11. +1 −1  doc/dev-guide-source/guides/modules.md
  12. +28 −26 doc/dev-guide-source/guides/xul-migration.md
  13. +1 −1  doc/dev-guide-source/tutorials/add-a-context-menu-item.md
  14. +16 −12 doc/dev-guide-source/tutorials/adding-toolbar-button.md
  15. +2 −2 doc/dev-guide-source/tutorials/annotator/creating.md
  16. +4 −4 doc/dev-guide-source/tutorials/annotator/storing.md
  17. +2 −2 doc/dev-guide-source/tutorials/annotator/widget.md
  18. +3 −3 doc/dev-guide-source/tutorials/display-a-popup.md
  19. +8 −8 doc/dev-guide-source/tutorials/event-targets.md
  20. +4 −4 doc/dev-guide-source/tutorials/getting-started-with-cfx.md
  21. +7 −7 doc/dev-guide-source/tutorials/l10n.md
  22. +4 −4 doc/dev-guide-source/tutorials/list-open-tabs.md
  23. +2 −2 doc/dev-guide-source/tutorials/listen-for-page-load.md
  24. +1 −1  doc/dev-guide-source/tutorials/logging.md
  25. +8 −8 doc/dev-guide-source/tutorials/modifying-web-pages-tab.md
  26. +12 −12 doc/dev-guide-source/tutorials/modifying-web-pages-url.md
  27. +3 −3 doc/dev-guide-source/tutorials/open-a-web-page.md
  28. +7 −7 doc/dev-guide-source/tutorials/reusable-modules.md
  29. +5 −5 doc/dev-guide-source/tutorials/unit-testing.md
  30. +3 −3 doc/module-source/sdk/addon-page.md
  31. +2 −2 doc/module-source/sdk/base64.md
  32. +8 −9 doc/module-source/sdk/clipboard.md
  33. +2 −2 doc/module-source/sdk/content/loader.md
  34. +1 −1  doc/module-source/sdk/content/symbiont.md
  35. +3 −3 doc/module-source/sdk/content/worker.md
  36. +14 −14 doc/module-source/sdk/context-menu.md
  37. +3 −3 doc/module-source/sdk/core/heritage.md
  38. +3 −3 doc/module-source/sdk/core/namespace.md
  39. +5 −5 doc/module-source/sdk/core/promise.md
  40. +1 −1  doc/module-source/sdk/event/core.md
  41. +10 −13 doc/module-source/sdk/event/target.md
  42. +1 −1  doc/module-source/sdk/frame/hidden-frame.md
  43. +4 −4 doc/module-source/sdk/frame/utils.md
  44. +42 −20 doc/module-source/sdk/hotkeys.md
  45. +5 −5 doc/module-source/sdk/l10n.md
  46. +1 −1  doc/module-source/sdk/loader/sandbox.md
  47. +2 −2 doc/module-source/sdk/notifications.md
  48. +32 −32 doc/module-source/sdk/page-mod.md
  49. +2 −2 doc/module-source/sdk/page-mod/match-pattern.md
  50. +5 −5 doc/module-source/sdk/page-worker.md
  51. +13 −13 doc/module-source/sdk/panel.md
  52. +12 −12 doc/module-source/sdk/passwords.md
  53. +28 −28 doc/module-source/sdk/platform/xpcom.md
  54. +7 −7 doc/module-source/sdk/preferences/service.md
  55. +2 −2 doc/module-source/sdk/private-browsing.md
  56. +5 −4 doc/module-source/sdk/request.md
  57. +4 −4 doc/module-source/sdk/selection.md
  58. +2 −2 doc/module-source/sdk/self.md
  59. +5 −5 doc/module-source/sdk/simple-prefs.md
  60. +8 −8 doc/module-source/sdk/simple-storage.md
  61. +244 −0 doc/module-source/sdk/system.md
  62. +1 −1  doc/module-source/sdk/system/environment.md
  63. +1 −1  doc/module-source/sdk/system/events.md
  64. +10 −10 doc/module-source/sdk/tabs.md
  65. +2 −2 doc/module-source/sdk/test/assert.md
  66. +3 −3 doc/module-source/sdk/test/httpd.md
  67. +1 −1  doc/module-source/sdk/util/collection.md
  68. +2 −2 doc/module-source/sdk/util/uuid.md
  69. +40 −47 doc/module-source/sdk/widget.md
  70. +14 −14 doc/module-source/sdk/window/utils.md
  71. +7 −9 doc/module-source/sdk/windows.md
  72. +0 −1  doc/static-files/base.html
  73. +5 −0 python-lib/cuddlefish/__init__.py
  74. +1 −0  python-lib/cuddlefish/property_parser.py
  75. +2 −2 python-lib/cuddlefish/rdf.py
  76. +1 −0  test/test-disposable.js
  77. +4 −0 test/test-private-browsing.js
4 app-extension/install.rdf
View
@@ -17,8 +17,8 @@
<em:targetApplication>
<Description>
<em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id>
- <em:minVersion>17.0</em:minVersion>
- <em:maxVersion>20.0a1</em:maxVersion>
+ <em:minVersion>18.0</em:minVersion>
+ <em:maxVersion>21.0a1</em:maxVersion>
</Description>
</em:targetApplication>
17 doc/dev-guide-source/cfx-tool.md
View
@@ -872,16 +872,17 @@ You can use the cfx `--static-args` option to pass arbitrary data to your
program. This may be especially useful if you run cfx from a script.
The value of `--static-args` must be a JSON string. The object encoded by the
-JSON becomes the `staticArgs` member of the `options` object passed as the
-first argument to your program's `main` function. The default value of
+JSON becomes the `staticArgs` property of the
+[`system` module](modules/sdk/system.html).
+
+The default value of
`--static-args` is `"{}"` (an empty object), so you don't have to worry about
-checking whether `staticArgs` exists in `options`.
+checking whether `staticArgs` exists in `system`.
-For example, if your `main.js` looks like this:
+For example, if your add-on looks like this:
- exports.main = function (options, callbacks) {
- console.log(options.staticArgs.foo);
- };
+ var system = require("sdk/system");
+ console.log(system.staticArgs.foo);
And you run cfx like this:
@@ -892,7 +893,7 @@ And you run cfx like this:
Then your console should contain this:
<pre>
- info: Hello from the command line
+info: my-addon: Hello from the command line
</pre>
The `--static-args` option is recognized by two of the package-specific
6 doc/dev-guide-source/guides/content-scripts/accessing-the-dom.md
View
@@ -44,9 +44,9 @@ For example: the page below redefines `window.confirm()` to return
But thanks to the wrapper, a content script which calls
`window.confirm()` will get the native implementation:
- var widgets = require("widget");
- var tabs = require("tabs");
- var data = require("self").data;
+ var widgets = require("sdk/widget");
+ var tabs = require("sdk/tabs");
+ var data = require("sdk/self").data;
var widget = widgets.Widget({
id: "transfer",
16 doc/dev-guide-source/guides/content-scripts/communicating-with-other-scripts.md
View
@@ -75,9 +75,9 @@ In the main add-on code, we have a
[`page-mod`](modules/sdk/page-mod.html) that attaches the content script
"talk.js" to the right page:
- var data = require("self").data;
+ var data = require("sdk/self").data;
- var pageMod = require("page-mod");
+ var pageMod = require("sdk/page-mod");
pageMod.PageMod({
include: "http://my-domain.org/listen.html",
contentScriptFile: data.url("talk.js")
@@ -117,9 +117,9 @@ the same, but in reverse.
Here "main.js" creates a [`page-mod`](modules/sdk/page-mod.html)
that attaches "listen.js" to the web page:
- var data = require("self").data;
+ var data = require("sdk/self").data;
- var pageMod = require("page-mod");
+ var pageMod = require("sdk/page-mod");
pageMod.PageMod({
include: "http://my-domain.org/talk.html",
contentScriptFile: data.url("listen.js")
@@ -167,9 +167,9 @@ from a content script to a page script.
First, "main.js" will create a [`page-mod`](modules/sdk/page-mod.html)
that will attach "talk.js" to the target web page:
- var data = require("self").data;
+ var data = require("sdk/self").data;
- var pageMod = require("page-mod");
+ var pageMod = require("sdk/page-mod");
pageMod.PageMod({
include: "http://my-domain.org/listen.html",
contentScriptFile: data.url("talk.js")
@@ -209,9 +209,9 @@ to the content script is just the same, but in reverse.
Again, "main.js" creates a [`page-mod`](modules/sdk/page-mod.html)
to target the page we are interested in:
- var data = require("self").data;
+ var data = require("sdk/self").data;
- var pageMod = require("page-mod");
+ var pageMod = require("sdk/page-mod");
pageMod.PageMod({
include: "http://my-domain.org/talk.html",
contentScriptFile: data.url("listen.js")
6 doc/dev-guide-source/guides/content-scripts/index.md
View
@@ -61,13 +61,13 @@ uses the [page-mod](modules/sdk/page-mod.html) module to replace the
content of any web page in the `.co.uk` domain by executing a content script
in the context of that page:
- var pageMod = require("page-mod");
+ var pageMod = require("sdk/page-mod");
- pageMod.add(new pageMod.PageMod({
+ pageMod.PageMod({
include: ["*.co.uk"],
contentScript: 'document.body.innerHTML = ' +
'"<h1>this page has been eaten</h1>";'
- }));
+ });
In this example the content script is supplied directly to the page mod via
the `contentScript` option in its constructor, and does not need to be
4 doc/dev-guide-source/guides/content-scripts/loading.md
View
@@ -25,7 +25,7 @@ which the content script will be loaded. To supply the file
root directory, use a line like:
// "data" is supplied by the "self" module
- var data = require("self").data;
+ var data = require("sdk/self").data;
...
contentScriptFile: data.url("my-content-script.js")
@@ -34,7 +34,7 @@ can load multiple scripts, which can also interact directly with each other in
the content process:
// "data" is supplied by the "self" module
- var data = require("self").data;
+ var data = require("sdk/self").data;
...
contentScriptFile:
[data.url("jquery-1.4.2.min.js"), data.url("my-content-script.js")]
8 doc/dev-guide-source/guides/content-scripts/reddit-example.md
View
@@ -15,9 +15,9 @@ script.
This is the complete add-on script:
- var data = require("self").data;
+ var data = require("sdk/self").data;
- var reddit_panel = require("panel").Panel({
+ var reddit_panel = require("sdk/panel").Panel({
width: 240,
height: 320,
contentURL: "http://www.reddit.com/.mobile?keep_extension=True",
@@ -26,10 +26,10 @@ This is the complete add-on script:
});
reddit_panel.port.on("click", function(url) {
- require("tabs").open(url);
+ require("sdk/tabs").open(url);
});
- require("widget").Widget({
+ require("sdk/widget").Widget({
id: "open-reddit-btn",
label: "Reddit",
contentURL: "http://www.reddit.com/static/favicon.ico",
8 doc/dev-guide-source/guides/content-scripts/using-port.md
View
@@ -24,7 +24,7 @@ an optional payload. The payload can be any value that is
Here's simple add-on that sends a message to a content script using `port`:
- var tabs = require("tabs");
+ var tabs = require("sdk/tabs");
var alertContentScript = "self.port.on('alert', function(message) {" +
" window.alert(message);" +
@@ -89,7 +89,7 @@ in all modules. The `panel` and `page-worker` objects integrate the
worker API directly. So to receive events from a content script associated
with a panel you use `panel.port.on()`:
- var panel = require("panel").Panel({
+ var panel = require("sdk/panel").Panel({
contentScript: "self.port.emit('showing', 'panel is showing');"
});
@@ -102,7 +102,7 @@ with a panel you use `panel.port.on()`:
Conversely, to emit user-defined events from your add-on you can just call
`panel.port.emit()`:
- var panel = require("panel").Panel({
+ var panel = require("sdk/panel").Panel({
contentScript: "self.port.on('alert', function(text) {" +
" console.log(text);" +
"});"
@@ -133,7 +133,7 @@ emit events to it.
"window.alert(message);" +
"});"
- var pageMod = require('page-mod').PageMod({
+ var pageMod = require('sdk/page-mod').PageMod({
include: ['*'],
contentScript: pageModScript,
onAttach: function(worker) {
20 doc/dev-guide-source/guides/content-scripts/using-postmessage.md
View
@@ -41,7 +41,7 @@ function. Again, `panel` and `page` integrate `worker` directly:
However, for `page-mod` objects you need to listen to the `onAttach` event
and use the worker supplied to that:
- var pageMod = require('page-mod').PageMod({
+ var pageMod = require('sdk/page-mod').PageMod({
include: ['*'],
contentScript: pageModScript,
onAttach: function(worker) {
@@ -53,7 +53,7 @@ To receive messages from a content script, use the worker's `on` function.
To simplify this most content modules provide an `onMessage` property as an
argument to the constructor:
- panel = require("panel").Panel({
+ panel = require("sdk/panel").Panel({
onMessage: function(contentScriptMessage) {
// Handle message from the content script
}
@@ -65,7 +65,7 @@ Content scripts are loaded according to the value of the
[`contentScriptWhen`](dev-guide/guides/content-scripts/loading.html)
option: until that point is reached, any attempt to send a message to
the script using `postMessage()` will trigger an exception, probably
-the unintuitive message:
+this:
<span class="aside">
This is a generic message which is emitted whenever we try to
@@ -80,9 +80,9 @@ Error: Couldn't find the worker to receive this message. The script may not be i
So code like this, where we create a panel and then
synchronously send it a message using `postMessage()`, will not work:
- var data = require("self").data;
+ var data = require("sdk/self").data;
- var panel = require("panel").Panel({
+ var panel = require("sdk/panel").Panel({
contentURL: "http://www.bbc.co.uk/mobile/index.html",
contentScriptFile: data.url("panel.js")
});
@@ -93,9 +93,9 @@ synchronously send it a message using `postMessage()`, will not work:
queues messages until the content script is ready to receive them,
so the equivalent code using `port.emit()` will work:
- var data = require("self").data;
+ var data = require("sdk/self").data;
- var panel = require("panel").Panel({
+ var panel = require("sdk/panel").Panel({
contentURL: "http://www.bbc.co.uk/mobile/index.html",
contentScriptFile: data.url("panel.js")
});
@@ -111,7 +111,7 @@ You can use message events as an alternative to user-defined events:
" self.postMessage(event.target.toString());" +
"}, false);";
- var pageMod = require('page-mod').PageMod({
+ var pageMod = require('sdk/page-mod').PageMod({
include: ['*'],
contentScript: pageModScript,
onAttach: function(worker) {
@@ -143,7 +143,7 @@ implement a switch function in the receiver to dispatch the message:
" }, false);"
- var pageMod = require('page-mod').PageMod({
+ var pageMod = require('sdk/page-mod').PageMod({
include: ['*'],
contentScript: pageModScript,
onAttach: function(worker) {
@@ -170,7 +170,7 @@ readable:
" self.port.emit('mouseout', event.target.toString());" +
"}, false);";
- var pageMod = require('page-mod').PageMod({
+ var pageMod = require('sdk/page-mod').PageMod({
include: ['*'],
contentScript: pageModScript,
onAttach: function(worker) {
12 doc/dev-guide-source/guides/events.md
View
@@ -56,7 +56,7 @@ For example, the following add-on registers two listeners with the
listen for the `start` and `stop` events, and logs a string to the console
reporting the change:
- var pb = require("private-browsing");
+ var pb = require("sdk/private-browsing");
pb.on("start", function() {
console.log("Private browsing is on");
@@ -90,8 +90,8 @@ The following add-on creates a widget and assigns a listener to the
`onClick` property of the `options` object supplied to the widget's
constructor. The listener loads the Google home page:
- var widgets = require("widget");
- var tabs = require("tabs");
+ var widgets = require("sdk/widget");
+ var tabs = require("sdk/tabs");
widgets.Widget({
id: "google-link",
@@ -105,8 +105,8 @@ constructor. The listener loads the Google home page:
This is exactly equivalent to constructing the widget and then calling the
widget's `on()` method:
- var widgets = require("widget");
- var tabs = require("tabs");
+ var widgets = require("sdk/widget");
+ var tabs = require("sdk/tabs");
var widget = widgets.Widget({
id: "google-link-alternative",
@@ -130,7 +130,7 @@ In the following add-on, we add two listeners to private-browsing's `start`
event, enter and exit private browsing, then remove the first listener and
enter private browsing again.
- var pb = require("private-browsing");
+ var pb = require("sdk/private-browsing");
function listener1() {
console.log("Listener 1");
2  doc/dev-guide-source/guides/modules.md
View
@@ -211,7 +211,7 @@ It can then load them in the same way it would load a local module.
For example, to load from `main`:
// main.js code
- var geo = require("/.dependencies/geolocation");
+ var geo = require("./dependencies/geolocation");
<div style="clear:both"></div>
54 doc/dev-guide-source/guides/xul-migration.md
View
@@ -176,43 +176,44 @@ object
### <a name="browser-chrome">Modifying the Browser Chrome</a> ###
-The [`window-utils`](modules/sdk/deprecated/window-utils.html) module gives
+The [`window/utils`](modules/sdk/window/utils.html) module gives
you direct access to chrome windows, including the browser's chrome window.
Here's a really simple example add-on that modifies the browser chrome using
-`window-utils`:
+`window/utils`:
- var windowUtils = require("window-utils");
+ function removeForwardButton() {
+ var window = require("sdk/window/utils").getMostRecentBrowserWindow();
+ var forward = window.document.getElementById('forward-button');
+ var parent = window.document.getElementById('unified-back-forward-button');
+ parent.removeChild(forward);
+ }
+
+ var widgets = require("sdk/widget");
- windowUtils = new windowUtils.WindowTracker({
- onTrack: function (window) {
- if ("chrome://browser/content/browser.xul" != window.location) return;
- var forward = window.document.getElementById('forward-button');
- var parent = window.document.getElementById('unified-back-forward-button');
- parent.removeChild(forward);
+ widgets.Widget({
+ id: "remove-forward-button",
+ label: "Remove the forward button",
+ contentURL: "http://www.mozilla.org/favicon.ico",
+ onClick: function() {
+ removeForwardButton();
}
});
-This example just removes the 'forward' button from the browser. It constructs
-a `WindowTracker` object and assigns a function to the constructor's `onTrack`
-option. This function will be called whenever a window is opened. The function
-checks whether the window is the browser's chrome window, and if it is, uses
-DOM manipulation functions to modify it.
-
There are more useful examples of this technique in the Jetpack Wiki's
collection of [third party modules](https://wiki.mozilla.org/Jetpack/Modules).
### <a name="accessing-tabbrowser">Accessing <a href="https://developer.mozilla.org/en/XUL/tabbrowser">tabbrowser</a> ###
-The [`tab-browser`](modules/sdk/deprecated/tab-browser.html) module gives
+The [`tabs/utils`](modules/sdk/tabs/utils.html) module gives
you direct access to the
-[tabbrowser](https://developer.mozilla.org/en/XUL/tabbrowser) object. This
-simple example modifies the selected tab's CSS to enable the user to highlight
-the selected tab:
+[tabbrowser](https://developer.mozilla.org/en/XUL/tabbrowser) object and the
+XUL tab objects it contains. This simple example modifies the selected tab's
+CSS to enable the user to highlight the selected tab:
- var widgets = require("widget");
- var tabbrowser = require("tab-browser");
- var self = require("self");
+ var widgets = require("sdk/widget");
+ var tabUtils = require("sdk/tabs/utils");
+ var self = require("sdk/self");
function highlightTab(tab) {
if (tab.style.getPropertyValue('background-color')) {
@@ -228,7 +229,8 @@ the selected tab:
label: "Highlight tabs",
contentURL: self.data.url("highlight.png"),
onClick: function() {
- highlightTab(tabbrowser.activeTab);
+ var window = require("sdk/window/utils").getMostRecentBrowserWindow();
+ highlightTab(tabUtils.getActiveTab(window));
}
});
@@ -266,7 +268,7 @@ to display an alert dialog:
var promptSvc = Cc["@mozilla.org/embedcomp/prompt-service;1"].
getService(Ci.nsIPromptService);
- var widget = require("widget").Widget({
+ var widget = require("sdk/widget").Widget({
id: "xpcom example",
label: "Mozilla website",
contentURL: "http://www.mozilla.org/favicon.ico",
@@ -292,12 +294,12 @@ script like:
If we save this as "alert.js" in our add-on's `lib` directory, we can rewrite
`main.js` to use it as follows:
- var widget = require("widget").Widget({
+ var widget = require("sdk/widget").Widget({
id: "xpcom example",
label: "Mozilla website",
contentURL: "http://www.mozilla.org/favicon.ico",
onClick: function() {
- require("alert").alert("My Add-on", "Hello from XPCOM");
+ require("./alert").alert("My Add-on", "Hello from XPCOM");
}
});
2  doc/dev-guide-source/tutorials/add-a-context-menu-item.md
View
@@ -19,7 +19,7 @@ displayed whenever something in the page is selected. When it's
clicked, the selection is sent to the main add-on code, which just
logs it:
- var contextMenu = require("context-menu");
+ var contextMenu = require("sdk/context-menu");
var menuItem = contextMenu.Item({
label: "Log Selection",
context: contextMenu.SelectionContext(),
28 doc/dev-guide-source/tutorials/adding-toolbar-button.md
View
@@ -18,8 +18,8 @@ Create a new directory, navigate to it, and execute `cfx init`.
Then open the file called "main.js" in the "lib" directory and
add the following code to it:
- var widgets = require("widget");
- var tabs = require("tabs");
+ var widgets = require("sdk/widget");
+ var tabs = require("sdk/tabs");
var widget = widgets.Widget({
id: "mozilla-link",
@@ -51,9 +51,9 @@ display using `contentURL`: this may refer to a remote file as in the
example above, or may refer to a local file. The example below will load
an icon file called "my-icon.png" from the add-on's `data` directory:
- var widgets = require("widget");
- var tabs = require("tabs");
- var self = require("self");
+ var widgets = require("sdk/widget");
+ var tabs = require("sdk/tabs");
+ var self = require("sdk/self");
var widget = widgets.Widget({
id: "mozilla-link",
@@ -65,7 +65,11 @@ an icon file called "my-icon.png" from the add-on's `data` directory:
});
You can change the icon at any time by setting the widget's `contentURL`
-property.
+property. However, setting the `contentURL` property will break the
+channel of communication between this widget and any content scripts it
+contains. Messages sent from the content script will no longer be received
+by the main add-on code, and vice versa. This issue is currently tracked as
+[bug 825434](https://bugzilla.mozilla.org/show_bug.cgi?id=825434).
## Responding To the User ##
@@ -108,9 +112,9 @@ property</li>
<li>listen for the new events:</li>
</ul>
- var widgets = require("widget");
- var tabs = require("tabs");
- var self = require("self");
+ var widgets = require("sdk/widget");
+ var tabs = require("sdk/tabs");
+ var self = require("sdk/self");
var widget = widgets.Widget({
id: "mozilla-link",
@@ -143,15 +147,15 @@ alt="Panel attached to a widget">
If you supply a `panel` object to the widget's constructor, then the panel
will be shown when the user clicks the widget:
- data = require("self").data
+ data = require("sdk/self").data
- var clockPanel = require("panel").Panel({
+ var clockPanel = require("sdk/panel").Panel({
width:215,
height:160,
contentURL: data.url("clock.html")
});
- require("widget").Widget({
+ require("sdk/widget").Widget({
id: "open-clock-btn",
label: "Clock",
contentURL: data.url("History.png"),
4 doc/dev-guide-source/tutorials/annotator/creating.md
View
@@ -137,7 +137,7 @@ later on
At the top of the file import the `page-mod` module and declare an array for
the workers:
- var pageMod = require('page-mod');
+ var pageMod = require('sdk/page-mod');
var selectors = [];
Add `detachWorker`:
@@ -273,7 +273,7 @@ Now we'll update `main.js` again to create the editor and use it.
First, import the `panel` module:
- var panels = require('panel');
+ var panels = require('sdk/panel');
Then add the following code to the `main` function:
8 doc/dev-guide-source/tutorials/annotator/storing.md
View
@@ -18,7 +18,7 @@ In this section we are only touching the `main.js` file.
First, import the `simple-storage` module with a declaration like:
- var simpleStorage = require('simple-storage');
+ var simpleStorage = require('sdk/simple-storage');
In the module scope, initialize an array which will contain the stored annotations:
@@ -200,7 +200,7 @@ Here's the code to create the panel, which can go in the `main` function.
this.postMessage(simpleStorage.storage.annotations);
},
onMessage: function(message) {
- require('tabs').open(message);
+ require('sdk/tabs').open(message);
}
});
@@ -268,7 +268,7 @@ respond to it. Add the following to your add-on's `main` function:
Because we use a notification to alert the user, we need to import the
`notifications` module:
- var notifications = require("notifications");
+ var notifications = require("sdk/notifications");
(It should be obvious that this is an incredibly unhelpful way to deal with the
problem. A real add-on should give the user a chance to choose which data to
@@ -283,7 +283,7 @@ from creating annotations while the browser is in
First let's import the `private-browsing` module into `main.js`:
- var privateBrowsing = require('private-browsing');
+ var privateBrowsing = require('sdk/private-browsing');
We already have a variable `annotatorIsOn` that we use to indicate whether the
user can enter annotations. But we don't want to use that here, because we want
4 doc/dev-guide-source/tutorials/annotator/widget.md
View
@@ -59,8 +59,8 @@ You can copy the widget's icons from here:
Now in the `lib` directory open `main.js` and add the following code:
- var widgets = require('widget');
- var data = require('self').data;
+ var widgets = require('sdk/widget');
+ var data = require('sdk/self').data;
var annotatorIsOn = false;
6 doc/dev-guide-source/tutorials/display-a-popup.md
View
@@ -41,12 +41,12 @@ The add-on consists of three files:
The "main.js" looks like this:
- var data = require("self").data;
+ var data = require("sdk/self").data;
// Construct a panel, loading its content from the "text-entry.html"
// file in the "data" directory, and loading the "get-text.js" script
// into it.
- var text_entry = require("panel").Panel({
+ var text_entry = require("sdk/panel").Panel({
width: 212,
height: 200,
contentURL: data.url("text-entry.html"),
@@ -55,7 +55,7 @@ The "main.js" looks like this:
// Create a widget, and attach the panel to it, so the panel is
// shown when the user clicks the widget.
- require("widget").Widget({
+ require("sdk/widget").Widget({
label: "Text entry",
id: "text-entry",
contentURL: "http://www.mozilla.org/favicon.ico",
16 doc/dev-guide-source/tutorials/event-targets.md
View
@@ -70,7 +70,7 @@ module.
Create a new file in "lib" called "bookmarks.js", and add the following code:
- var { emit, on, once, off } = require("api-utils/event/core");
+ var { emit, on, once, off } = require("sdk/event/core");
var {Cc, Ci, Cu} = require("chrome");
Cu.import("resource://gre/modules/XPCOMUtils.jsm", this);
@@ -84,7 +84,7 @@ Create a new file in "lib" called "bookmarks.js", and add the following code:
onItemVisited: function(aItemId, aVisitID, time) {
emit(exports, "visited", bookmarkService.getBookmarkURI(aItemId).spec);
},
- QueryInterface: XPCOMUtils.generateQI([Components.interfaces.nsINavBookmarkObserver])
+ QueryInterface: XPCOMUtils.generateQI([Ci.nsINavBookmarkObserver])
};
bookmarkService.addObserver(bookmarkObserver, false);
@@ -151,10 +151,10 @@ from `EventTarget` and emits `added` and `visited` events.
Open "bookmarks.js" and replace its contents with this code:
- var { emit } = require("api-utils/event/core");
- var { EventTarget } = require("api-utils/event/target");
- var { Class } = require("api-utils/heritage");
- var { merge } = require("api-utils/utils/object");
+ var { emit } = require("sdk/event/core");
+ var { EventTarget } = require("sdk/event/target");
+ var { Class } = require("sdk/core/heritage");
+ var { merge } = require("sdk/util/object");
var {Cc, Ci, Cu} = require("chrome");
Cu.import("resource://gre/modules/XPCOMUtils.jsm", this);
@@ -169,7 +169,7 @@ Open "bookmarks.js" and replace its contents with this code:
onItemVisited: function(aItemId, aVisitID, time) {
emit(target, "visited", bookmarkService.getBookmarkURI(aItemId).spec);
},
- QueryInterface: XPCOMUtils.generateQI([Components.interfaces.nsINavBookmarkObserver])
+ QueryInterface: XPCOMUtils.generateQI([Ci.nsINavBookmarkObserver])
};
bookmarkService.addObserver(bookmarkObserver, false);
}
@@ -243,7 +243,7 @@ either by calling:
or by passing the `onShow` option to `Panel`'s constructor:
- var myPanel = require("panel").Panel({
+ var myPanel = require("sdk/panel").Panel({
onShow: listenerFunction,
contentURL: "https://en.wikipedia.org/w/index.php"
});
8 doc/dev-guide-source/tutorials/getting-started-with-cfx.md
View
@@ -67,8 +67,8 @@ The main code for an add-on is always kept in a file called `main.js` in your
add-on's `lib` directory. Open the `main.js` for this add-on, and
add the following code:
- var widgets = require("widget");
- var tabs = require("tabs");
+ var widgets = require("sdk/widget");
+ var tabs = require("sdk/tabs");
var widget = widgets.Widget({
id: "mozilla-link",
@@ -111,8 +111,8 @@ the Mozilla home page in a new tab.
Try editing this file. For example, we could change the icon displayed
and the URL that gets loaded:
- var widgets = require("widget");
- var tabs = require("tabs");
+ var widgets = require("sdk/widget");
+ var tabs = require("sdk/tabs");
var widget = widgets.Widget({
id: "jquery-link",
14 doc/dev-guide-source/tutorials/l10n.md
View
@@ -71,13 +71,13 @@ the identifier to it:
Then you can use this HTML file to build your interface, for example
inside a panel:
- var hello = require("panel").Panel({
+ var hello = require("sdk/panel").Panel({
height: 75,
width: 150,
- contentURL: require("self").data.url("my-panel.html")
+ contentURL: require("sdk/self").data.url("my-panel.html")
});
- var widget = require("widget").Widget({
+ var widget = require("sdk/widget").Widget({
id: "mozilla-link",
label: "Mozilla website",
contentURL: "http://www.mozilla.org/favicon.ico",
@@ -108,7 +108,7 @@ hello_id= &lt;blink&gt;Hello!&lt;/blink&gt;
To reference localized strings from your main add-on code, you do this:
- var _ = require("l10n").get;
+ var _ = require("sdk/l10n").get;
console.log(_("hello_id!"));
<span class="aside">Assigning to "`_`" in particular is not required, but
@@ -194,7 +194,7 @@ page (although this table is out of date compared to the
In the code, you supply an extra parameter alongside the identifier,
describing how many items there are:
- var _ = require("l10n").get;
+ var _ = require("sdk/l10n").get;
console.log(_("tomato_id"));
console.log(_("tomato_id", 1));
console.log(_("tomato_id", 2));
@@ -246,7 +246,7 @@ hello_id= Bonjour %s !
To use placeholders, supply the placeholder string after the identifier:
- var _ = require("l10n").get;
+ var _ = require("sdk/l10n").get;
console.log(_("hello_id", "Bob"));
console.log(_("hello_id", "Alice"));
@@ -278,7 +278,7 @@ For example, suppose we want to include a localized string naming a
person's home town. There are two placeholders: the name of the person
and the name of the home town:
- var _ = require("l10n").get;
+ var _ = require("sdk/l10n").get;
console.log(_("home_town_id", "Bob", "London"));
An English translator might want to choose between the following:
8 doc/dev-guide-source/tutorials/list-open-tabs.md
View
@@ -18,7 +18,7 @@ The following add-on adds a
[`widget`](modules/sdk/widget.html) that logs
the URLs of open tabs when the user clicks it:
- var widget = require("widget").Widget({
+ var widget = require("sdk/widget").Widget({
id: "mozilla-link",
label: "Mozilla website",
contentURL: "http://www.mozilla.org/favicon.ico",
@@ -26,7 +26,7 @@ the URLs of open tabs when the user clicks it:
});
function listTabs() {
- var tabs = require("tabs");
+ var tabs = require("sdk/tabs");
for each (var tab in tabs)
console.log(tab.url);
}
@@ -45,7 +45,7 @@ To access tab content you need to attach a script to the tab
using `tab.attach()`. This add-on attaches a script to all open
tabs. The script adds a red border to the tab's document:
- var widget = require("widget").Widget({
+ var widget = require("sdk/widget").Widget({
id: "mozilla-link",
label: "Mozilla website",
contentURL: "http://www.mozilla.org/favicon.ico",
@@ -53,7 +53,7 @@ tabs. The script adds a red border to the tab's document:
});
function listTabs() {
- var tabs = require("tabs");
+ var tabs = require("sdk/tabs");
for each (var tab in tabs)
runScript(tab);
}
4 doc/dev-guide-source/tutorials/listen-for-page-load.md
View
@@ -16,7 +16,7 @@ You can get notifications about new pages loading using the
listens to the tab's built-in `ready` event and just logs the URL of each
tab as the user loads it:
- require("tabs").on("ready", logURL);
+ require("sdk/tabs").on("ready", logURL);
function logURL(tab) {
console.log(tab.url);
@@ -28,7 +28,7 @@ To access tab content you need to attach a script to the tab
using `tab.attach()`. This add-on attaches a script to all open
tabs. The script adds a red border to the tab's document:
- require("tabs").on("ready", logURL);
+ require("sdk/tabs").on("ready", logURL);
function logURL(tab) {
runScript(tab);
2  doc/dev-guide-source/tutorials/logging.md
View
@@ -45,7 +45,7 @@ as in your main add-on code. The following add-on logs the HTML content
of every tab the user loads, by calling `console.log()` inside a content
script:
- require("tabs").on("ready", function(tab) {
+ require("sdk/tabs").on("ready", function(tab) {
tab.attach({
contentScript: "console.log(document.body.innerHTML);"
});
16 doc/dev-guide-source/tutorials/modifying-web-pages-tab.md
View
@@ -18,8 +18,8 @@ to interact with web content, these scripts are called *content scripts*.
Here's a simple example:
- var widgets = require("widget");
- var tabs = require("tabs");
+ var widgets = require("sdk/widget");
+ var tabs = require("sdk/tabs");
var widget = widgets.Widget({
id: "mozilla-link",
@@ -69,9 +69,9 @@ in a file called `my-script.js`:
We can load this script by changing the add-on code like this:
- var widgets = require("widget");
- var tabs = require("tabs");
- var self = require("self");
+ var widgets = require("sdk/widget");
+ var tabs = require("sdk/tabs");
+ var self = require("sdk/self");
var widget = widgets.Widget({
id: "mozilla-link",
@@ -114,9 +114,9 @@ the content script. The content script now needs to look like this:
In the add-on script, we'll send the content script a "drawBorder" message
using the object returned from `attach()`:
- var widgets = require("widget");
- var tabs = require("tabs");
- var self = require("self");
+ var widgets = require("sdk/widget");
+ var tabs = require("sdk/tabs");
+ var self = require("sdk/self");
var widget = widgets.Widget({
id: "mozilla-link",
24 doc/dev-guide-source/tutorials/modifying-web-pages-url.md
View
@@ -25,7 +25,7 @@ Here's a simple example. The content script is supplied as the `contentScript`
option, and the URL pattern is given as the `include` option:
// Import the page-mod API
- var pageMod = require("page-mod");
+ var pageMod = require("sdk/page-mod");
// Create a page mod
// It will run a script whenever a ".org" URL is loaded
@@ -75,9 +75,9 @@ in a file called `my-script.js`:
We can load this script by changing the page-mod code like this:
// Import the page-mod API
- var pageMod = require("page-mod");
+ var pageMod = require("sdk/page-mod");
// Import the self API
- var self = require("self");
+ var self = require("sdk/self");
// Create a page mod
// It will run a script whenever a ".org" URL is loaded
@@ -100,9 +100,9 @@ load the script and jQuery together (making sure to load jQuery
first):
// Import the page-mod API
- var pageMod = require("page-mod");
+ var pageMod = require("sdk/page-mod");
// Import the self API
- var self = require("self");
+ var self = require("sdk/self");
// Create a page mod
// It will run a script whenever a ".org" URL is loaded
@@ -118,9 +118,9 @@ in the same page-mod: if you do this, scripts loaded using
`contentScript` are loaded first:
// Import the page-mod API
- var pageMod = require("page-mod");
+ var pageMod = require("sdk/page-mod");
// Import the self API
- var self = require("self");
+ var self = require("sdk/self");
// Create a page mod
// It will run a script whenever a ".org" URL is loaded
@@ -162,9 +162,9 @@ the document. The content script now needs to look like this:
In the add-on script, we'll send the content script a message inside `onAttach`:
// Import the page-mod API
- var pageMod = require("page-mod");
+ var pageMod = require("sdk/page-mod");
// Import the self API
- var self = require("self");
+ var self = require("sdk/self");
// Create a page mod
// It will run a script whenever a ".org" URL is loaded
@@ -192,7 +192,7 @@ but details of the API might need to change.**
Rather than injecting JavaScript into a page, you can inject CSS by
setting the page-mod's `contentStyle` option:
- var pageMod = require("page-mod").PageMod({
+ var pageMod = require("sdk/page-mod").PageMod({
include: "*",
contentStyle: "body {" +
" border: 5px solid green;" +
@@ -204,9 +204,9 @@ that's given the URL of a CSS file in your "data" directory, and it is
good practice to use this option in preference to `contentStyle` if the
CSS is at all complex:
- var pageMod = require("page-mod").PageMod({
+ var pageMod = require("sdk/page-mod").PageMod({
include: "*",
- contentStyleFile: require("self").data.url("my-style.css")
+ contentStyleFile: require("sdk/self").data.url("my-style.css")
});
You can't currently use relative URLs in style sheets loaded with
6 doc/dev-guide-source/tutorials/open-a-web-page.md
View
@@ -14,7 +14,7 @@ and learned the
To open a new web page, you can use the
[`tabs`](modules/sdk/tabs.html) module:
- var tabs = require("tabs");
+ var tabs = require("sdk/tabs");
tabs.open("http://www.example.com");
This function is asynchronous, so you don't immediately get back a
@@ -22,7 +22,7 @@ This function is asynchronous, so you don't immediately get back a
To do this, pass a callback function into `open()`. The callback is assigned
to the `onReady` property, and will be passed the tab as an argument:
- var tabs = require("tabs");
+ var tabs = require("sdk/tabs");
tabs.open({
url: "http://www.example.com",
onReady: function onReady(tab) {
@@ -36,7 +36,7 @@ To access tab content you need to attach a script to the tab
using `tab.attach()`. This add-on loads a page, then attaches a script to
the page which adds a red border to it:
- var tabs = require("tabs");
+ var tabs = require("sdk/tabs");
tabs.open({
url: "http://www.example.com",
onReady: runScript
14 doc/dev-guide-source/tutorials/reusable-modules.md
View
@@ -54,7 +54,7 @@ object, and retrieves the user's current position:
xpcomGeolocation.getCurrentPosition(callback);
}
- var widget = require("widget").Widget({
+ var widget = require("sdk/widget").Widget({
id: "whereami",
label: "Where am I?",
contentURL: "http://www.mozilla.org/favicon.ico",
@@ -95,7 +95,7 @@ So we'll extend the add-on to include an adapted version of the code in
that MDN page:
<pre><code>
-var activeBrowserWindow = require("window-utils").activeBrowserWindow;
+var activeBrowserWindow = require("sdk/window/utils").getMostRecentBrowserWindow();
var {Cc, Ci} = require("chrome");
// Ask the user to confirm that they want to share their location.
@@ -173,7 +173,7 @@ function getCurrentPosition(callback) {
xpcomGeolocation.getCurrentPosition(callback);
}
-var widget = require("widget").Widget({
+var widget = require("sdk/widget").Widget({
id: "whereami",
label: "Where am I?",
contentURL: "http://www.mozilla.org/favicon.ico",
@@ -218,7 +218,7 @@ if they agree.
So "geolocation.js" should look like this:
<pre><code>
-var activeBrowserWindow = require("window-utils").activeBrowserWindow;
+var activeBrowserWindow = require("sdk/window/utils").getMostRecentBrowserWindow();
var {Cc, Ci} = require("chrome");
// Ask the user to confirm that they want to share their location.
@@ -320,7 +320,7 @@ Now "main.js" should look like this:
<pre><code>
var geolocation = require("./geolocation");
-var widget = require("widget").Widget({
+var widget = require("sdk/widget").Widget({
id: "whereami",
label: "Where am I?",
contentURL: "http://www.mozilla.org/favicon.ico",
@@ -358,8 +358,8 @@ the preference used to store the user's choice are hardcoded:
Instead we'll use the `self` module to ensure that they are specific
to the add-on:
- var addonName = require("self").name;
- var addonId = require("self").id;
+ var addonName = require("sdk/self").name;
+ var addonId = require("sdk/self").id;
let pref = "extensions." + addonId + ".allowGeolocation";
let message = addonName + " Add-on wants to know your location."
10 doc/dev-guide-source/tutorials/unit-testing.md
View
@@ -36,7 +36,7 @@ To begin with, create a new directory, navigate to it, and run `cfx init`.
Now create a new file in "lib" called "base64.js", and give it the
following contents:
- var window = require("window-utils").activeBrowserWindow;
+ var window = require("sdk/window/utils").getMostRecentBrowserWindow();
exports.atob = function(a) {
return window.atob(a);
@@ -50,8 +50,8 @@ This code exports two functions, which just call the corresponding
functions on the `window` object. To show the module in use, edit
the "main.js" file as follows:
- var widgets = require("widget");
- var base64 = require("base64");
+ var widgets = require("sdk/widget");
+ var base64 = require("./base64");
var widget = widgets.Widget({
id: "base64",
@@ -81,7 +81,7 @@ In its place create a file called `test-base64.js` with the following
contents:
<pre><code>
-var base64 = require("base64");
+var base64 = require("./base64");
exports["test atob"] = function(assert) {
assert.ok(base64.atob("aGVsbG8=") == "hello", "atob works");
@@ -98,7 +98,7 @@ exports["test empty string"] = function(assert) {
"empty string check works");
}
-require("test").run(exports);
+require("sdk/test").run(exports);
</code></pre>
This file: exports three functions, each of which expects to receive a single
6 doc/module-source/sdk/addon-page.md
View
@@ -21,10 +21,10 @@ To use the module import it using `require()`. After this,
the page loaded from "data/index.html" will not contain
navigational elements:
- var addontab = require("addon-page");
- var data = require("self").data;
+ var addontab = require("sdk/addon-page");
+ var data = require("sdk/self").data;
- require("tabs").open(data.url("index.html"));
+ require("sdk/tabs").open(data.url("index.html"));
<img src="static-files/media/screenshots/addon-page.png" alt="Example add-on page" class="image-center"/>
This only affects the page at "data/index.html":
4 doc/module-source/sdk/base64.md
View
@@ -6,7 +6,7 @@ The module provides data encoding and decoding using Base64 algorithms.
##Example
- var base64 = require("base64");
+ var base64 = require("sdk/base64");
var encodedData = base64.encode("Hello, World");
var decodedData = base64.decode(encodedData);
@@ -16,7 +16,7 @@ The module provides data encoding and decoding using Base64 algorithms.
In order to `encode` and `decode` properly Unicode strings, the `charset`
parameter needs to be set to `"utf-8"`:
- var base64 = require("base64");
+ var base64 = require("sdk/base64");
var encodedData = base64.encode(unicodeString, "utf-8");
var decodedData = base64.decode(encodedData, "utf-8");
17 doc/module-source/sdk/clipboard.md
View
@@ -23,25 +23,24 @@ Examples
Set and get the contents of the clipboard.
- var clipboard = require("clipboard");
+ var clipboard = require("sdk/clipboard");
clipboard.set("Lorem ipsum dolor sit amet");
var contents = clipboard.get();
Set the clipboard contents to some HTML.
- var clipboard = require("clipboard");
+ var clipboard = require("sdk/clipboard");
clipboard.set("<blink>Lorem ipsum dolor sit amet</blink>", "html");
-
If the clipboard contains HTML content, open it in a new tab.
- var clipboard = require("clipboard");
+ var clipboard = require("sdk/clipboard");
if (clipboard.currentFlavors.indexOf("html") != -1)
- require("tabs").open("data:text/html," + clipboard.get("html"));
+ require("sdk/tabs").open("data:text/html;charset=utf-8," + clipboard.get("html"));
Set the clipboard contents to an image.
- var clipboard = require("clipboard");
+ var clipboard = require("sdk/clipboard");
clipboard.set("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYA" +
"AABzenr0AAAASUlEQVRYhe3O0QkAIAwD0eyqe3Q993AQ3cBSUKpygfsNTy" +
"N5ugbQpK0BAADgP0BRDWXWlwEAAAAAgPsA3rzDaAAAAHgPcGrpgAnzQ2FG" +
@@ -49,16 +48,16 @@ Set the clipboard contents to an image.
If the clipboard contains an image, open it in a new tab.
- var clipboard = require("clipboard");
+ var clipboard = require("sdk/clipboard");
if (clipboard.currentFlavors.indexOf("image") != -1)
- require("tabs").open(clipboard.get());
+ require("sdk/tabs").open(clipboard.get());
As noted before, data type can be easily omitted for images.
If the intention is set the clipboard to a data URL as string and not as image,
it can be easily done specifying a different flavor, like `text`.
- var clipboard = require("clipboard");
+ var clipboard = require("sdk/clipboard");
clipboard.set("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYA" +
"AABzenr0AAAASUlEQVRYhe3O0QkAIAwD0eyqe3Q993AQ3cBSUKpygfsNTy" +
4 doc/module-source/sdk/content/loader.md
View
@@ -43,8 +43,8 @@ it loads content supplied as the `contentURL` option.
The following code creates a wrapper on a hidden frame that reloads a web page
in the frame every time the `contentURL` property is changed:
- var hiddenFrames = require("hidden-frame");
- var { Loader } = require("content");
+ var hiddenFrames = require("sdk/frame/hidden-frame");
+ var { Loader } = require("sdk/content/content");
var PageLoader = Loader.compose({
constructor: function PageLoader(options) {
options = options || {};
2  doc/module-source/sdk/content/symbiont.md
View
@@ -27,7 +27,7 @@ functions to load and configure content scripts from the `Loader`,
and functions to exchange messages between content scripts and the
main add-on code from the `Worker`.
- var { Symbiont } = require('content');
+ var { Symbiont } = require('sdk/content/content');
var Thing = Symbiont.resolve({ constructor: '_init' }).compose({
constructor: function Thing(options) {
// `getMyFrame` returns the host application frame in which
6 doc/module-source/sdk/content/worker.md
View
@@ -32,12 +32,12 @@ are listed below.
**Example**
- var workers = require("content/worker");
+ var workers = require("sdk/content/worker");
let worker = workers.Worker({
- window: require("window-utils").activeWindow,
+ window: require("sdk/window/utils").getMostRecentBrowserWindow(),
contentScript:
"self.port.on('hello', function(name) { " +
- " self.port.emit('response', window.location); " +
+ " self.port.emit('response', window.location.href); " +
"});"
});
worker.port.emit("hello", { name: "worker"});
28 doc/module-source/sdk/context-menu.md
View
@@ -78,7 +78,7 @@ You can specify some simple, declarative contexts when you create a menu item by
setting the `context` property of the options object passed to its constructor,
like this:
- var cm = require("context-menu");
+ var cm = require("sdk/context-menu");
cm.Item({
label: "My Menu Item",
context: cm.URLContext("*.mozilla.org")
@@ -149,7 +149,7 @@ exported by the `context-menu` module.
Menu items also have a `context` property that can be used to add and remove
declarative contexts after construction. For example:
- var context = require("context-menu").SelectorContext("img");
+ var context = require("sdk/context-menu").SelectorContext("img");
myMenuItem.context.add(context);
myMenuItem.context.remove(context);
@@ -177,7 +177,7 @@ content script is shown in the menu.
For example, this item appears whenever the context menu is invoked on a page
that contains at least one image:
- require("context-menu").Item({
+ require("sdk/context-menu").Item({
label: "This Page Has Images",
contentScript: 'self.on("context", function (node) {' +
' return !!document.querySelector("img");' +
@@ -195,7 +195,7 @@ are not current, then your context listener is never called.
This example takes advantage of that fact. The listener can be assured that
`node` will always be an image:
- var cm = require("context-menu");
+ var cm = require("sdk/context-menu");
cm.Item({
label: "A Mozilla Image",
context: cm.SelectorContext("img"),
@@ -224,7 +224,7 @@ content script.
Therefore, to handle an item click, listen for the `"click"` event in that
item's content script like so:
- require("context-menu").Item({
+ require("sdk/context-menu").Item({
label: "My Item",
contentScript: 'self.on("click", function (node, data) {' +
' console.log("Item clicked!");' +
@@ -240,7 +240,7 @@ so be sure to verify that the `data` value passed matches the item you expect.
You can use this to simplify click handling by providing just a single click
listener on a `Menu` that reacts to clicks for any child items.:
- var cm = require("context-menu");
+ var cm = require("sdk/context-menu");
cm.Menu({
label: "My Menu",
contentScript: 'self.on("click", function (node, data) {' +
@@ -260,7 +260,7 @@ associated with the content script, the content script can call the
JSON-able data. The menu item's `"message"` event listener will be called with
that data.
- var cm = require("context-menu");
+ var cm = require("sdk/context-menu");
cm.Item({
label: "Edit Image",
context: cm.SelectorContext("img"),
@@ -283,7 +283,7 @@ The simplest method is to set the menu item's `label` property. This example
updates the item's label based on the number of times it's been clicked:
var numClicks = 0;
- var myItem = require("context-menu").Item({
+ var myItem = require("sdk/context-menu").Item({
label: "Click Me: " + numClicks,
contentScript: 'self.on("click", self.postMessage);',
onMessage: function () {
@@ -304,7 +304,7 @@ returning true, your `"context"` listeners can also return strings. When a
This item implements the aforementioned search example:
- var cm = require("context-menu");
+ var cm = require("sdk/context-menu");
cm.Item({
label: "Search Google",
context: cm.SelectionContext(),
@@ -344,7 +344,7 @@ secure, debug and review.</p>
Show an "Edit Page Source" item when the user right-clicks a non-interactive
part of the page:
- require("context-menu").Item({
+ require("sdk/context-menu").Item({
label: "Edit Page Source",
contentScript: 'self.on("click", function (node, data) {' +
' self.postMessage(document.URL);' +
@@ -356,7 +356,7 @@ part of the page:
Show an "Edit Image" item when the menu is invoked on an image:
- var cm = require("context-menu");
+ var cm = require("sdk/context-menu");
cm.Item({
label: "Edit Image",
context: cm.SelectorContext("img"),
@@ -371,7 +371,7 @@ Show an "Edit Image" item when the menu is invoked on an image:
Show an "Edit Mozilla Image" item when the menu is invoked on an image in a
mozilla.org or mozilla.com page:
- var cm = require("context-menu");
+ var cm = require("sdk/context-menu");
cm.Item({
label: "Edit Mozilla Image",
context: [
@@ -388,7 +388,7 @@ mozilla.org or mozilla.com page:
Show an "Edit Page Images" item when the page contains at least one image:
- var cm = require("context-menu");
+ var cm = require("sdk/context-menu");
cm.Item({
label: "Edit Page Images",
// This ensures the item only appears during the page context.
@@ -412,7 +412,7 @@ Show an "Edit Page Images" item when the page contains at least one image:
Show a "Search With" menu when the user right-clicks an anchor that searches
Google or Wikipedia with the text contained in the anchor:
- var cm = require("context-menu");
+ var cm = require("sdk/context-menu");
var googleItem = cm.Item({
label: "Google",
data: "http://www.google.com/search?q="
6 doc/module-source/sdk/core/heritage.md
View
@@ -62,7 +62,7 @@ SDK provides utility functions to make it more declarative and less verbose.
Module exports `Class` utility function for making `constructor` functions
with a proper `prototype` chain setup in declarative manner:
- var { Class } = require('api-utils/heritage');
+ var { Class } = require('sdk/core/heritage');
var Dog = Class({
initialize: function initialize(name) {
this.name = name;
@@ -239,7 +239,7 @@ to `Object.create`, only difference is that second argument is an object
containing properties to be defined, instead of property descriptor map. Also,
keep in mind that returned object will be frozen.
- var { extend } = require('api-utils/heritage');
+ var { extend } = require('sdk/core/heritage');
var base = { a: 1 };
var derived = extend(base, { b: 2 });
@@ -259,7 +259,7 @@ the object on the left are overridden by a same named property of the object
on the right.
- var { mix } = require('api-utils/heritage');
+ var { mix } = require('sdk/core/heritage');
var object = mix({ a: 1, b: 1 }, { b: 2 }, { c: 3 });
JSON.stringify(object) // => { "a": 1, "b": 2, "c": 3 }
6 doc/module-source/sdk/core/namespace.md
View
@@ -6,14 +6,14 @@ Provides an API for creating namespaces for any given objects, which
effectively may be used for creating fields that are not part of objects
public API.
- let { ns } = require('api-utils/namespace');
+ let { ns } = require('sdk/core/namespace');
let aNamespace = ns();
aNamespace(publicAPI).secret = secret;
One namespace may be used with multiple objects:
- let { ns } = require('api-utils/namespace');
+ let { ns } = require('sdk/core/namespace');
let dom = ns();
function View(element) {
@@ -35,7 +35,7 @@ Also, multiple namespaces can be used with one object:
// ./widget.js
let { Cu } = require('chrome');
- let { ns } = require('api-utils/namespace');
+ let { ns } = require('sdk/core/namespace');
let { View } = require('./view');
// Note this is completely independent from View's internal Namespace object.
10 doc/module-source/sdk/core/promise.md
View
@@ -200,7 +200,7 @@ code. As a matter of fact it would be great if we could convert any synchronous
functions to asynchronous by making it aware of promises. Module exports
`promised` function to do exactly that:
- const { promised } = require('api-utils/promise');
+ const { promised } = require('sdk/core/promise');
function sum(x, y) { return x + y }
var sumAsync = promised(sum);
@@ -234,7 +234,7 @@ Module exports `defer` function, which is where all promises ultimately
come from. Lets see implementation of `readAsync` that we used in lot's
of examples above:
- const { defer } = require('api-utils/promise');
+ const { defer } = require('sdk/core/promise');
function readAsync(url) {
var deferred = defer();
@@ -341,7 +341,7 @@ achieve same effect.
Module provides a simple function for wrapping values into promises:
- const { resolve } = require('api-utils/promise');
+ const { resolve } = require('sdk/core/promise');
var a = resolve(5).then(function(value) {
return value + 2
@@ -351,7 +351,7 @@ Module provides a simple function for wrapping values into promises:
Also `resolve` not only takes values, but also promises. If you pass it
a promise it will return new identical one:
- const { resolve } = require('api-utils/promise');
+ const { resolve } = require('sdk/core/promise');
resolve(resolve(resolve(3))).then(console.log); // => 3
@@ -382,7 +382,7 @@ way to create eventual errors. Module exports `reject` exactly for that.
It takes anything as an argument and returns a promise that is rejected with
it.
- const { reject } = require('api-utils/promise');
+ const { reject } = require('sdk/core/promise');
var boom = reject(Error('boom!'));
2  doc/module-source/sdk/event/core.md
View
@@ -17,7 +17,7 @@ to get started with this API.
An event `listener` may be registered to any event `target` using the
`on` function:
- var { on, once, off, emit } = require('api-utils/event/core');
+ var { on, once, off, emit } = require('sdk/event/core');
var target = { name: 'target' };
on(target, 'message', function listener(event) {
console.log('hello ' + event);
23 doc/module-source/sdk/event/target.md
View
@@ -23,8 +23,8 @@ are emitted.
It's easy to create event target objects, no special arguments are required.
- const { EventTarget } = require('api-utils/event/target');
- let target = EventTarget.new();
+ const { EventTarget } = require("sdk/event/target");
+ let target = EventTarget();
For a convenience though optional `options` arguments may be used, in which
case all the function properties with keys like: `onMessage`, `onMyEvent`...
@@ -65,11 +65,10 @@ events. In majority of cases party emitting events is different from party
registering listeners. In order to emit events one needs to use `event/core`
module instead:
- let { emit } = require('api-utils/event/core');
+ let { emit } = require('sdk/event/core');
- target.on('hi', function(person) { console.log(person + 'tells hi'); });
- emit(target, 'hi', 'Mark');
- // info: 'Mark tells hi'
+ target.on('hi', function(person) { console.log(person + ' says hi'); });
+ emit(target, 'hi', 'Mark'); // info: 'Mark says hi'
For more details see **event/core** documentation.
@@ -78,20 +77,18 @@ For more details see **event/core** documentation.
Listeners registered during the event propagation (by one of the listeners)
won't be triggered until next emit of the matching type:
- let { emit } = require('api-utils/event/core');
+ let { emit } = require('sdk/event/core');
target.on('message', function onMessage(message) {
- console.log('listener trigerred');
+ console.log('listener triggered');
target.on('message', function() {
console.log('nested listener triggered');
});
});
- emit(target, 'message');
- // info: 'listener trigerred'
- emit(target, 'message');
- // info: 'listener trigerred'
- // info: 'nested listener trigerred'
+ emit(target, 'message'); // info: 'listener triggered'
+ emit(target, 'message'); // info: 'listener triggered'
+ // info: 'nested listener triggered'
Exceptions in the listeners can be handled via `'error'` event listeners:
2  doc/module-source/sdk/frame/hidden-frame.md
View
@@ -23,7 +23,7 @@ content that was loaded in it.
The following code creates a hidden frame, loads a web page into it, and then
logs its title:
- var hiddenFrames = require("hidden-frame");
+ var hiddenFrames = require("sdk/frame/hidden-frame");
let hiddenFrame = hiddenFrames.add(hiddenFrames.HiddenFrame({
onReady: function() {
this.element.contentWindow.location = "http://www.mozilla.org/";
8 doc/module-source/sdk/frame/utils.md
View
@@ -10,8 +10,8 @@ Module exports `create` function that takes the `nsIDOMDocument` of a
[privileged document](https://developer.mozilla.org/en/Working_with_windows_in_chrome_code)
and creates a `browser` element in its `documentElement`:
- let { open } = require('api-utils/window/utils');
- let { create } = require('api-utils/frame/utils');
+ let { open } = require('sdk/window/utils');
+ let { create } = require('sdk/frame/utils');
let window = open('data:text/html,Foo');
let frame = create(window.document);
@@ -20,8 +20,8 @@ even further.
Execution of scripts may easily be enabled:
- let { open } = require('api-utils/window/utils');
- let { create } = require('api-utils/frame/utils');
+ let { open } = require('sdk/window/utils');
+ let { create } = require('sdk/frame/utils');
let window = open('data:text/html,top');
let frame = create(window.document, {
uri: 'data:text/html,<script>alert("Hello")</script>',
62 doc/module-source/sdk/hotkeys.md
View
@@ -4,8 +4,48 @@
<!-- contributed by Irakli Gozalishvili [gozala@mozilla.com] -->
-Some add-ons may wish to define keyboard shortcuts for certain operations. This
-module exposes an API to create those.
+The `hotkeys` module enables add-on developers to define hotkey combinations.
+To define a hotkey combination, create a `Hotkey` object, passing it the
+combination and a function to be called when the user presses that
+combination. For example, this add-on defines two hotkey combinations,
+to show and hide a panel:
+
+ // Define keyboard shortcuts for showing and hiding a custom panel.
+ var { Hotkey } = require("sdk/hotkeys");
+
+ var showHotKey = Hotkey({
+ combo: "accel-shift-o",
+ onPress: function() {
+ showMyPanel();
+ }
+ });
+ var hideHotKey = Hotkey({
+ combo: "accel-alt-shift-o",
+ onPress: function() {
+ hideMyPanel();
+ }
+ });
+
+## Choosing Hotkeys ##
+
+Choose hotkey combinations with care. It's very easy to choose combinations
+which clash with hotkeys defined for Firefox or for other add-ons.
+
+If you choose any of the following commonly used Firefox combinations your
+add-on will not pass AMO review:
+
+<pre>
+accel+Z, accel+C, accel+X, accel+V or accel+Q
+</pre>
+
+If you choose to use a key combination that's already defined, choose one
+which makes sense for the operation it will perform. For example, `accel-S`
+is typically used to save a file, but if you use it for something
+completely different then it would be extremely confusing for users.
+
+No matter what you choose, it's likely to annoy some people, and to clash
+with some other add-on, so consider making the combination you choose
+user-configurable.
<api name="Hotkey">
@class
@@ -56,23 +96,5 @@ destroyed it can no longer be used.
</api>
</api>
-## Example ##
-
- // Define keyboard shortcuts for showing and hiding a custom panel.
- var { Hotkey } = require("hotkeys");
-
- var showHotKey = Hotkey({
- combo: "accel-shift-o",
- onPress: function() {
- showMyPanel();
- }
- });
- var hideHotKey = Hotkey({
- combo: "accel-alt-shift-o",
- onPress: function() {
- hideMyPanel();
- }
- });
-
[Mozilla keyboard planning FAQ]:http://www.mozilla.org/access/keyboard/
[keyboard shortcuts]:https://developer.mozilla.org/en/XUL_Tutorial/Keyboard_Shortcuts
10 doc/module-source/sdk/l10n.md
View
@@ -24,7 +24,7 @@ scripts or HTML files.
For compatibility with tools that expect this syntax, you can assign
this function to "_":
- var _ = require("l10n").get;
+ var _ = require("sdk/l10n").get;
Given a `.properties` file for the current locale containing
an entry like:
@@ -35,7 +35,7 @@ hello_string= Hello!
and the following code:
- var _ = require("l10n").get;
+ var _ = require("sdk/l10n").get;
console.log(_("hello_string"));
the following output will be logged:
@@ -49,7 +49,7 @@ info: Hello!
functional, localizable code without localizing any strings - just make
the identifiers the default language:
- var _ = require("l10n").get;
+ var _ = require("sdk/l10n").get;
console.log(_("Hello!"));
However, this will make it more difficult to maintain your code if you
@@ -80,7 +80,7 @@ info: Hello!
plural forms, this parameter is the number of items there are in this
case.
- var _ = require("l10n").get;
+ var _ = require("sdk/l10n").get;
console.log(_("child_id", 1));
console.log(_("child_id", 2));
@@ -97,7 +97,7 @@ info: Hello!
If you supply multiple placeholders, each one is a separate string
parameter.
- var _ = require("l10n").get;
+ var _ = require("sdk/l10n").get;
console.log(_("home_town", "Alan", "Norwich"));
See the tutorial on
2  doc/module-source/sdk/loader/sandbox.md
View
@@ -9,7 +9,7 @@ in them.
To create a sandbox:
- const { sandbox, evaluate, load } = require("api-utils/sandbox");
+ const { sandbox, evaluate, load } = require("sdk/loader/sandbox");
let scope = sandbox('http://example.com');
The argument passed to the sandbox defines its privileges. The argument may be:
4 doc/module-source/sdk/notifications.md
View
@@ -20,7 +20,7 @@ Examples
Here's a typical example. When the message is clicked, a string is logged to
the console.
- var notifications = require("notifications");
+ var notifications = require("sdk/notifications");
notifications.notify({
title: "Jabberwocky",
text: "'Twas brillig, and the slithy toves",
@@ -34,7 +34,7 @@ the console.
This one displays an icon that's stored in the add-on's `data` directory. (See
the [`self`](modules/sdk/self.html) module documentation for more information.)
- var notifications = require("notifications");
+ var notifications = require("sdk/notifications");
var self = require("self");
var myIconURL = self.data.url("myIcon.png");
notifications.notify({
64 doc/module-source/sdk/page-mod.md
View
@@ -17,7 +17,7 @@ to be attached to that page.
For example, the following add-on displays an alert whenever the user
visits any page hosted at "mozilla.org":
- var pageMod = require("page-mod");
+ var pageMod = require("sdk/page-mod");
pageMod.PageMod({
include: "*.mozilla.org",
@@ -26,7 +26,7 @@ visits any page hosted at "mozilla.org":
You can modify the document in your script:
- var pageMod = require("page-mod");
+ var pageMod = require("sdk/page-mod");
pageMod.PageMod({
include: "*.mozilla.org",
@@ -44,8 +44,8 @@ In this case files are specified by a URL typically constructed using the
<!-- -->
- var data = require("self").data;
- var pageMod = require("page-mod");
+ var data = require("sdk/self").data;
+ var pageMod = require("sdk/page-mod");
pageMod.PageMod({
include: "*.mozilla.org",
contentScriptFile: data.url("my-script.js")
@@ -53,8 +53,8 @@ In this case files are specified by a URL typically constructed using the
<!-- -->
- var data = require("self").data;
- var pageMod = require("page-mod");
+ var data = require("sdk/self").data;
+ var pageMod = require("sdk/page-mod");
pageMod.PageMod({
include: "*.mozilla.org",
@@ -114,8 +114,8 @@ the HTML content of all the elements with that tag.
/lib/main.js:
var tag = "p";
- var data = require("self").data;
- var pageMod = require("page-mod");
+ var data = require("sdk/self").data;
+ var pageMod = require("sdk/page-mod");
pageMod.PageMod({
include: "*.mozilla.org",
@@ -170,8 +170,8 @@ this worker. You can use this to access
the [`tabs API`](modules/sdk/tabs.html) for the tab associated
with a specific document:
- var pageMod = require("page-mod");
- var tabs = require("tabs");
+ var pageMod = require("sdk/page-mod");
+ var tabs = require("sdk/tabs");
pageMod.PageMod({
include: ["*"],
@@ -191,7 +191,7 @@ For example, if you maintain a list of workers attached to a page-mod:
var workers = [];
- var pageMod = require("page-mod").PageMod({
+ var pageMod = require("sdk/page-mod").PageMod({
include: ['*'],
contentScriptWhen: 'ready',
contentScriptFile: data.url('pagemod.js'),
@@ -211,7 +211,7 @@ You can remove workers when they are no longer valid by listening to `detach`:
}
}
- var pageMod = require("page-mod").PageMod({
+ var pageMod = require("sdk/page-mod").PageMod({
include: ['*'],
contentScriptWhen: 'ready',
contentScriptFile: data.url('pagemod.js'),
@@ -241,8 +241,8 @@ scripts are executed immediately.
The following add-on creates a widget which, when clicked, highlights all the
`div` elements in the document loaded into the active tab:
- var widgets = require("widget");
- var tabs = require("tabs");
+ var widgets = require("sdk/widget");
+ var tabs = require("sdk/tabs");
var widget = widgets.Widget({
id: "div-show",
@@ -279,7 +279,7 @@ Creates a page-mod.
You can specify a URL exactly:
- var pageMod = require("page-mod");
+ var pageMod = require("sdk/page-mod");
pageMod.PageMod({
include: "http://www.iana.org/domains/example/",
contentScript: 'window.alert("Page matches ruleset");'
@@ -287,7 +287,7 @@ Creates a page-mod.
You can specify a number of wildcard forms, for example:
- var pageMod = require("page-mod");
+ var pageMod = require("sdk/page-mod");
pageMod.PageMod({
include: "*.mozilla.org",
contentScript: 'window.alert("Page matches ruleset");'
@@ -298,7 +298,7 @@ Creates a page-mod.
The pattern must match the entire URL, not just a subset, and has
`global`, `ignoreCase`, and `multiline` disabled.
- var pageMod = require("page-mod");
+ var pageMod = require("sdk/page-mod");
pageMod.PageMod({
include: /.*developer.*/,
contentScript: 'window.alert("Page matches ruleset");'
@@ -306,7 +306,7 @@ Creates a page-mod.
To specify multiple patterns, pass an array of match patterns:
- var pageMod = require("page-mod");
+ var pageMod = require("sdk/page-mod");
pageMod.PageMod({
include: ["*.developer.mozilla.org", "*.addons.mozilla.org"],
contentScript: 'window.alert("Page matches ruleset");'
@@ -324,8 +324,8 @@ Creates a page-mod.
`url()` method of the
[`self` module's `data` object](modules/sdk/self.html#data).
- var data = require("self").data;
- var pageMod = require("page-mod");
+ var data = require("sdk/self").data;
+ var pageMod = require("sdk/page-mod");
pageMod.PageMod({
include: "*",
contentScriptFile: data.url("my-script.js")
@@ -333,8 +333,8 @@ Creates a page-mod.
To attach multiple scripts, pass an array of URLs.
- var data = require("self").data;
- var pageMod = require("page-mod");
+ var data = require("sdk/self").data;
+ var pageMod = require("sdk/page-mod");
pageMod.PageMod({
include: "*",
@@ -349,7 +349,7 @@ Creates a page-mod.
This option specifies one or more content scripts to attach to targeted
documents. Each script is supplied directly as a single string:
- var pageMod = require("page-mod");
+ var pageMod = require("sdk/page-mod");
pageMod.PageMod({
include: "*",
contentScript: 'window.alert("Page matches ruleset");'
@@ -392,7 +392,7 @@ secure, debug and review.</p>
<!-- -->
- var pageMod = require("page-mod");
+ var pageMod = require("sdk/page-mod");
pageMod.PageMod({
include: "*",
contentScript: 'window.alert("Page matches ruleset");',
@@ -410,8 +410,8 @@ secure, debug and review.</p>
The option consists of an object literal listing `name:value` pairs for
the values you want to provide to the content script. For example:
- var data = require("self").data;
- var pageMod = require("page-mod");
+ var data = require("sdk/self").data;
+ var pageMod = require("sdk/page-mod");
pageMod.PageMod({
include: "*",
contentScriptFile: data.url("my-script.js"),
@@ -448,8 +448,8 @@ secure, debug and review.</p>
[`self` module's `data` object](modules/sdk/self.html#data).
To add multiple stylesheet files, pass an array of URLs.
- var data = require("self").data;
- var pageMod = require("page-mod");
+ var data = require("sdk/self").data;
+ var pageMod = require("sdk/page-mod");
pageMod.PageMod({
include: "*.org",
@@ -471,8 +471,8 @@ secure, debug and review.</p>
"data" directory, and construct a `contentStyle` option embedding that URL
in your rule. For example:
- var data = require("self").data;
- var pageMod = require("page-mod").PageMod({
+ var data = require("sdk/self").data;
+ var pageMod = require("sdk/page-mod").PageMod({
include: "*",
contentStyleFile: data.url("my-style.css"),
// contentStyle is built dynamically here to include an absolute URL
@@ -500,7 +500,7 @@ secure, debug and review.</p>
Each stylesheet rule is supplied as a separate string. To supply
multiple rules, pass an array of strings:
- var pageMod = require("page-mod");
+ var pageMod = require("sdk/page-mod");
pageMod.PageMod({
include: "*.org",
@@ -543,7 +543,7 @@ secure, debug and review.</p>
For example, the following page-mod will be attached to already opened
tabs, but not to any iframes:
- var pageMod = require("page-mod");
+ var pageMod = require("sdk/page-mod");
pageMod.PageMod({
include: "*",
contentScript: "",
4 doc/module-source/sdk/page-mod/match-pattern.md
View
@@ -174,7 +174,7 @@ add-on's [data](modules/sdk/self.html#data) directory, use `resource://`.
You can specify patterns using a
[regular expression](https://developer.mozilla.org/en/JavaScript/Guide/Regular_Expressions):
- var { MatchPattern } = require("match-pattern");