Not a privileged user
Not a privileged user

Reputation: 963

How to make resize event inside content script work?

The resize event doesn't work on content scripts in the Add-on SDK (1.8)
this script: https://builder.addons.mozilla.org/package/142401/latest/

main.js:

var Widget = require("widget").Widget;
var tabs = require('tabs');
var self = require('self');
var data = self.data;
var PageMod = require('page-mod').PageMod;

exports.main = function() {

    PageMod({
        include: [data.url("thepage.html")],
        contentScriptWhen: 'start',
        contentScriptFile: [data.url('thescript.js')],
        onAttach: function(worker) {
                console.log("attaching...")
        },
    });

    new Widget({
        id: "my-widget-1",
        label: "Widget",
        contentURL: "http://www.mozilla.org/favicon.ico",
        onClick: function(event) {
            tabs.open(data.url("thepage.html"));
        }
    });
};

thescript.js

console.log('started')
window.onresize = function(){console.log('resized!!!');}; //not working, never calls

How can I make an resize event triggers inside the content script ?

Upvotes: 2

Views: 757

Answers (1)

Wladimir Palant
Wladimir Palant

Reputation: 57681

It is generally not recommendable to use window.onfoo to attach event listeners. There can be an issue if some other code tries to attach an event listener the same way (one event listener will win and you don't know which one), and it won't work if you access window through a wrapper rather than directly. So it is always better to use addEventListener method instead:

window.addEventListener("resize", function() {
  console.log('resized!!!');
}, false);

In your case this actually fixes the problem - the event listener fires when the window is resized.

Upvotes: 2

Related Questions