Loader is base trait and it provides set of core properties and associated validations. Trait is useful for all the compositions providing high level APIs for creating JavaScript contexts that can access web content.

Loader is composed from the EventEmitter trait, therefore instances of Loader and their descendants expose all the public properties exposed by EventEmitter along with additional public properties:

Value changes on all of the above mentioned properties emit propertyChange events on an instances.


The following code creates a wrapper on hidden frame that reloads a web page in frame every time contentURL property is changed:

var hiddenFrames = require("hidden-frame");
var { Loader } = require("content");
var PageLoader = Loader.compose({
  constructor: function PageLoader(options) {
    options = options || {};
    if (options.contentURL)
      this.contentURL = options.contentURL;
    this.on('propertyChange', this._onChange = this._onChange.bind(this));
    let self = this;
      onReady: function onReady() {
        let frame = self._frame = this.element;
        self._emit('propertyChange', { contentURL: self.contentURL });
  _onChange: function _onChange(e) {
    if ('contentURL' in e)
      this._frame.setAttribute('src', this._contentURL);

API Reference



contentScriptFile : array

The local file URLs of content scripts to load. Content scripts specified by this property are loaded before those specified by the contentScript property.

contentScript : array

The texts of content scripts to load. Content scripts specified by this property are loaded after those specified by the contentScriptFile property.

contentScriptWhen : string

When to load the content scripts. This may take one of the following values:

  • "start": load content scripts immediately after the document element for the page is inserted into the DOM, but before the DOM content itself has been loaded
  • "ready": load content scripts once DOM content has been loaded, corresponding to the DOMContentLoaded event
  • "end": load content scripts once all the content (DOM, JS, CSS, images) for the page has been loaded, at the time the window.onload event fires
contentScriptOptions : object

Read-only value exposed to content scripts under self.options property.

Any kind of jsonable value (object, array, string, etc.) can be used here. Optional.

contentURL : string

The URL of the content loaded.

allow : object

Permissions for the content, with the following keys: