Why does my Firefox extension not add event handlers using jQuery 1.4.2 object pulled from webpage in Firefox 4

Question

My Firefox extension grabs a jQuery 1.4.2 object that is already embedded on a webpage and then tries to use that jQuery object to modify that page. It worked well in Firefox 3.x, but it does not seem to work in Firefox 4.

Here's my code:

window.addEventListener("load", function() { MyExt.init(); }, false);  

var MyExt = {

  targetHost: "somewebsite.com",

  init: function() {     
     var appcontent = document.getElementById("appcontent");   // browser  
     if (appcontent){  
      appcontent.addEventListener("DOMContentLoaded", MyExt.onPageLoad, true);  
     }
   },

   onPageLoad: function(aEvent) {  
     var doc = aEvent.originalTarget; // doc is document that triggered "onload" event  
     var loc = doc.location;
     var host = '';
     if (loc.toString() != "about:blank") {
       host = doc.location.host;
     }


     // Edit page         
     if (host == MyExt.targetHost) {
        var $ = doc.defaultView.wrappedJSObject.$;

        // this works
        $('p').css('color', 'green');

        // this works in Firefox 3.x, but does not work in Firefox 4
        // instead it shows the following error:
        // "Error: uncaught exception: TypeError: handler is undefined" 
        $('.sometextarea').keyup(function(event) { alert('it should work, but does not'); });

        // even this does not work as expected
        // it should display true, but it displays false
        alert($.isFunction(function(){}));

     }
 }

What am I doing wrong?

Answer 1

Yes, you have to use wrappedJSObject due to API changes :

Specifying xpcnativewrappers=no in your manifest (that is, XPCNativeWrapper automation) is no longer supported. This was always intended to be a short-term workaround to allow extensions to continue to work while their authors updated their code to use XPCNativeWrappers.

If your add-on depends upon XBL bindings attached to content objects—for example, the ability to call functions or get and set properties created by the XBL binding—you will need to use the XPCNativeWrapper property wrappedJSObject to access wrapped objects.

If you need to be able to call functions or access properties defined by web content, you'll need to do this as well. This may be the case if, for example, you've written an extension that adds a delete button to a web mail service, and the service defines a window.delete() function that you need to call.

If, on the other hand, all you're doing with content is accessing DOM methods and properties, you've never needed to be using xpcnativewrappers=no in the first place, and should simply remove it from your manifest.