Sandboxed `this` in Firefox WebExtension content script

Question

The following code:

(function(local_window) {
  local_window.example = 1234;
  console.log(window);
  console.log(local_window);
}(this));
console.log(this);

console.log(window.example);
console.log(example);

Prints (as expected) the following:

Window
Window
Window
1234
1234

When:

run in a webpage on Firefox and Chrome
run in a Firefox Addon-SDK content script
run in a Chrome WebExtension content script

However, in a Firefox WebExtension content script this prints the following:

Window
Sandbox { browser: Getter, chrome: Getter, example: 1234, browser: Object, chrome: Object, window: Window → /, document: HTMLDocument → /, location: Location → /, top: Window → /, self: Window → /, 72 more }
Sandbox { browser: Object, chrome: Object, example: 1234, window: Window → /, document: HTMLDocument → /, location: Location → /, top: Window → /, self: Window → /, name: "", history: History, 72 more }
undefined
1234

example !== window.example was a very weird surprise then porting the Chrome extension to FF. Is this an intended breakage (or a bug)? Is this documented anywhere? I don't see it in the MDN compatibility notes.

Context: I was using zepto.js (which installs itself into this.$) in a content script and one piece of code was accessing it with window.$, which failed on FF.

Andrew Swan Andrew Swan · Accepted Answer · 2017-06-23T06:11:19

This is deliberate, and it is documented at https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Content_scripts#Accessing_page_script_objects_from_content_scripts

Sandboxed `this` in Firefox WebExtension content script

2 Answers