Moving event handlers into a javascript function

Question

What I basically need to do is attach this code lines to this file. http://mxr.mozilla.org/mozilla-central/source/mobile/android/chrome/content/aboutDownloads.js

window.addEventListener("DOMContentLoaded", function() {handle_events();}, true);
window.addEventListener("unload", function() {Downloads.uninit();}, false);

function handle_events(){
    window.addEventListener("DOMContentLoaded", function() {Downloads.init();}, true);
    document.getElementById("contextmenu-open").addEventListener("click", ContextMenus.open, false);
    document.getElementById("contextmenu-retry").addEventListener("click", ContextMenus.retry, false);
    document.getElementById("contextmenu-remove").addEventListener("click", ContextMenus.remove, false);
    document.getElementById("contextmenu-pause").addEventListener("click", ContextMenus.pause, false);
    document.getElementById("contextmenu-resume").addEventListener("click", ContextMenus.resume, false);
    document.getElementById("contextmenu-cancel").addEventListener("click", ContextMenus.cancel, false);
    document.getElementById("contextmenu-removeall").addEventListener("click", ContextMenus.removeAll, false);
    }

But when I do that, I get a javascript error saying

JavaScript Error: "TypeError: aElement is undefined" {file: "chrome://browser/content/aboutDownloads.js" line: 435}

Multiple times. How can I fix this?. This is a part of the code from Firefox for android project.

Answer 1

Wrap your method calls in an anonymous function like this:

document.getElementById("contextmenu-open").addEventListener("click", ContextMenus.open, false);

to this:

document.getElementById("contextmenu-open").addEventListener("click", function() {ContextMenus.open()}, false);

This preserves the ContextMenus object as the caller of the method and makes sure that this is set properly when the method is called.

---

In addition, I don't think you want to install a DOMContentLoaded event handler in 'handle_events()becauseDOMContentLoadedhas already fired at that point since you're callinghandle_events()from aDOMContentLoaded` event handler.

For Downloads.init(), just call it directly in the first line of handle_events(). The DOM is already loaded so you can just call it, you don't have to wait for an event.