810204 - Document why `window.onload` and similar doesn't work in content script

Status: RESOLVED FIXED

(Add-on SDK Graveyard :: Documentation, defect, P2)

Description

[Matteo Ferretti [:zer0] [:matteo]]

As decided in bug Bug 787063, we should document why `window.onload` doesn't work in contentScript, providing alternative code (`window.addEventListener`, or `unsafeWindow.onload` if override the original page's onload in the goal) with explanations.

Comment 1

[Will Bamberg [:wbamberg]]

I don't think `unsafeWindow.onload` is an effective workaround: I don't think it makes any difference here. Try this add-on:

// main.js
var listener = 'window.addEventListener("load", function() {' +
               '  console.log("window.addeventlistener:" +  window.document.title);' +
               '});' + 
               'unsafeWindow.onload = function() {' +
               '  console.log("unsafewindow.onload: " + window.document.title);' +
               '}';

require("sdk/page-mod").PageMod({
  include: "*",
  contentScript: listener,
  contentScriptWhen: "start"
});

var tabs = require("sdk/tabs");
tabs.open("https://google.com");
tabs.open("https://mozilla.org");

With this, I get:

console.log: onload: window.addeventlistener:Home of the Mozilla Project — Mozilla
console.log: onload: unsafewindow.onload: Home of the Mozilla Project — Mozilla
console.log: onload: window.addeventlistener:Google

I think all that's happening here is that "onload" is getting overwritten by the page on certain sites. The same thing can happen with onclick or any of the other global event handlers.

I've updated https://developer.mozilla.org/en-US/Add-ons/SDK/Guides/Content_Scripts/DOM_access_quirks#Event_listeners to talk about this, and basically recommend that people use addEventListener for adding event listeners.

Comment 2

[Will Bamberg [:wbamberg]]

Attachment: mdn.html

Comment 3

[Matteo Ferretti [:zer0] [:matteo]]

(In reply to Will Bamberg [:wbamberg] from comment #1)

> I don't think `unsafeWindow.onload` is an effective workaround: I don't
> think it makes any difference here. Try this add-on:

As mentioned in my first comment, it's a workaround only if the usage of `window.onload` was intended by the developer to override the original `window.onload` of the document itself - e.g. set to `null` to avoid the execution, or replace with something else.
Of course, as you noted, needs to be used in the right timing, otherwise doesn't have any effect.

In all other scenarios, the `window.addEventListener` is the right and suggested approach.

Comment 4

[Matteo Ferretti [:zer0] [:matteo]]

Comment on attachment 8438702 [details]
mdn.html

This bug was intended to document the behavior of Bug 787063, however several things are changed in the meantime, and I believe it's not valid anymore. The changes you made here are good and more indicate to our current situation.