:focusable and :tabbable are broken with jQuery 1.3.2

[Scott González]

The change to :hidden and :visible have broken the :focusable and :tabbable selectors.

[Jörn Zaefferer]

I've looked at the code. The interesting part seems to be this check:

// the element and all of its ancestors must be visible
// the browser may report that the area is hidden
&& !$(element)['area' == nodeName ? 'parents' : 'closest'](':hidden').length;

Seems like we could just check the visibility of the element itself instead of checking ancestors. So this should do the trick:

&& $(element).is(":visible");

Fixes 7 of 17 failing tests, thats something...

[d3r1v3d]

+1 to Joern's suggested patch - I definitely agree that checking if the element is visible makes more sense.

Concerning the 'visible, enabled elements' tests failing for the 'area with href' case, I've noticed that these <area> elements consistently have an offsetWidth and offsetHeight of 0. I believe this is because the test map doesn't have any <img usemap=""/> relationships attached to it, so all of its internal <area>s are essentially hidden. jQuery 1.3.2 checks for a positive offsetWidth or offsetHeight in its implementation of the ':visible' selector and so this is what causes that subtest to fail.

However, the <map> parent should still have a valid width/height, and the following tweak to Joern's suggest patch causes all of the 'visible, enabled elements' tests to pass 100% in Firefox 2/3:

&& ('area' == nodeName
    ? $(element).closest('map').is(':visible')
    : $(element).is(':visible'));

The problem is that the same is not true for either Chrome or IE 7. They both consistently report that the <map> and all nested <area>s have an offsetWidth/offsetHeight of 0, causing the is(':visible') check to report false every time.

[Jörn Zaefferer]

So :focusable is actually used only by :tabbable, which in turned is used only by Dialog. Seems like we imagined more of a usecase where actually only one exist: focus the first element in a dialog.

Which reminds me of the code in my validation plugin, which basically just gets the first invalid input (not interesting here), then does .filter(":visible").focus();

The call is wrapped in a try-catch-swallow block for some IE-edgecases.

[AzaToth]

can someone please explain this bug in more detail, and where this applies? (i.e. what change?)

[Scott González]

Mostly fixed in ​3f070bd.

[Scott González]

Area elements are fixed in ​fe13fba.

[Jörn Zaefferer]

What's left?

[Scott González]

The object tests still fail in IE. I cant seem to come up with a test that passes in all browsers at the same time.

[Scott González]

Objects fixed in ​0ab54d8.

[Scott González]

Core tests: Fixed object element for focusable/tabbable tests. Fixes #4488 - :focusable and :tabbable are broken with jQuery 1.3.2.

Changeset: 0ab54d87dc521b73819a3ac480f7aa94365e52e2