Firefox jQuery contains method error

[oleg.richards@…]

The following code:

var x = $('#foo');
$(document).bind('click.popup', function(e) {
 if (!$.contains(x, e.target)) {
     e.stopPropagation();
      return false;
 }

 x.trigger('popup.hide');
});

Gives me an error in Firefox. In all other browsers it works properly.

Error: g.compareDocumentPosition is not a function Source:  http://localhost:8080/public//js/libs/jquery-1.4.3.min.js String: 102

[addyosmani]

Could you please submit a complete test-case on jsFiddle.net that reproduces this issue so that we can accurately evaluate the bug experienced?

[aaronblondeau@…]

Breaks on Firefox 3.6.12 (Mac OSX Snow Leopard):  http://jsfiddle.net/gRyZp/

[anonymous]

Sorry, missing a # in the first selector (doesn't particularly affect outcome though). Here is a better example :  http://jsfiddle.net/gRyZp/1/

[rwaldron]

Confirmed; Doesn't return in FF3.6.12

[jitter]

This isn't a bug in jQuery but rather a misunderstanding on how the contains method works.

The  documentation for jQuery.contains() says:

jQuery.contains( container, contained )
container The DOM element that may contain the other element.
contained The DOM node that may be contained by the other element.

This means you can only pass in real DOM elements to this method. In all test cases linked to on this report there are jQuery objects passed in instead which is clearly invalid. The reason it returns true in some other browsers is actually the real bug in the contains method.

[john]

There wasn't a 1.4.5 release, was actually 1.5.

[john]

There was no 1.4.5 release, was actually 1.5.

[anonymous]

This is a real error. I get the error message also in firefox.

Error message is "a.compareDocumentPosition is not a function"

I have found a solution though... basically the error only occurs in firefox if you test to see if a jQuery object is in an element. e.g.

jQuery.contains(document, $(document.body)) causes error in firefox

but

jQuery.contains(document, document.body) would work fine.

However the firts on works fine in other browsers.

[anonymous]

By the way I was using jQuery v 1.5.1 and firefox 3.6.15

[anonymous]

The documentation states that it only works with native DOM elements and not jQuery objects. But I agree with everyone having problems that it should accept jQuery objects as parameters.

A work-around using jQuery is:

$(contained, container).size() == 0