frame/hidden-frame

Add-ons using the techniques described in this document are considered a legacy technology in Firefox. Don't use these techniques to develop new add-ons. Use WebExtensions instead. If you maintain an add-on which uses the techniques described here, consider migrating it to use WebExtensions.

From Firefox 53 onwards, no new legacy add-ons will be accepted on addons.mozilla.org (AMO).

From Firefox 57 onwards, WebExtensions will be the only supported extension type, and Firefox will not load other types.

Even before Firefox 57, changes coming up in the Firefox platform will break many legacy extensions. These changes include multiprocess Firefox (e10s), sandboxing, and multiple content processes. Legacy extensions that are affected by these changes should migrate to WebExtensions if they can. See the "Compatibility Milestones" document for more.

A wiki page containing resources, migration paths, office hours, and more, is available to help developers transition to the new technologies.

Experimental

Creates Firefox frames (i.e. XUL <iframe> elements) that are not displayed to the user. This is useful in the construction of APIs that load web content not intended to be directly seen or accessed by users, like page-worker. It is also useful in the construction of APIs that load web content for intermittent display, such as panel.

Usage

The module exports a constructor function, HiddenFrame, and two other functions, add and remove.

HiddenFrame constructs a new hidden frame. add registers a hidden frame, preparing it to load content. remove unregisters a frame, unloading any 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("sdk/frame/hidden-frame");
let hiddenFrame = hiddenFrames.add(hiddenFrames.HiddenFrame({
  onReady: function() {
    this.element.contentWindow.location = "http://www.mozilla.org/";
    let self = this;
    this.element.addEventListener("DOMContentLoaded", function() {
      console.log(self.element.contentDocument.title);
    }, true, true);
  }
}));

See the panel module for a real-world example of usage of this module.

Globals

Constructors

HiddenFrame(options)

Creates a hidden frame.

Parameters

options : object
Required options:

Name Type  
onReady function,array

Functions to call when the frame is ready to load content. You must specify an onReady callback and refrain from using the hidden frame until the callback gets called, because hidden frames are not always ready to load content the moment they are added.

Functions

add(hiddenFrame)

Register a hidden frame, preparing it to load content.

Parameters

hiddenFrame : HiddenFrame
the frame to add

remove(hiddenFrame)

Unregister a hidden frame, unloading any content that was loaded in it.

Parameters

hiddenFrame : HiddenFrame
the frame to remove

HiddenFrame

HiddenFrame objects represent hidden frames.

Properties

element

The host application frame in which the page is loaded.

Events

ready

This event is emitted when the DOM for a hidden frame content is ready. It is equivalent to the DOMContentLoaded event for the content page in a hidden frame.

Document Tags and Contributors

 Contributors to this page: wbamberg
 Last updated by: wbamberg,