library-mirrors/jquery-ui
1
0
Fork 0
mirror of https://github.com/jquery/jquery-ui.git synced 2024-10-05 01:44:18 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Focusable: Fix handling of visibility: collapse

Browse Source 
"collapse" is similar to "hidden", with a slight difference in the case
of tr/tbody/td/colgroup elements.
See https://www.w3.org/TR/CSS22/visufx.html#visibility
See https://www.w3.org/TR/CSS22/tables.html#dynamic-effects
See https://developer.mozilla.org/en-US/docs/Web/CSS/visibility#Table_example

"visibility: collapse" elements are always not focusable, though.

Commit d3025968f3 introduced a regression by testing with `!== "hidden"`
instead of `=== "visible"`.

Closes gh-1843
This commit is contained in:
Paul Capron 2020-10-14 23:53:11 +02:00 committed by GitHub
parent bfffac3fd5
commit f5d38e2e05
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 14 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
tests/unit/core/core.html
View File

@ -108,9 +108,17 @@
<span tabindex="1" id="displayNone-span" style="display: none;">.</span> <span tabindex="1" id="displayNone-span" style="display: none;">.</span>
<span tabindex="1" id="visibilityHidden-span" style="visibility: hidden;">.</span> <span tabindex="1" id="visibilityHidden-span" style="visibility: hidden;">.</span>
<span tabindex="1" id="visibilityCollapse-span" style="visibility: collapse;">.</span>
<input id="displayNone-input" style="display: none;"> <input id="displayNone-input" style="display: none;">
<input id="visibilityHidden-input" style="visibility: hidden;"> <input id="visibilityHidden-input" style="visibility: hidden;">
<input id="visibilityCollapse-input" style="visibility: collapse;">
<table>
<tr>
<td tabindex="1" id="visibilityCollapse-td" style="visibility: collapse;">.</td>
</tr>
</table>
</div> </div>
<div> <div>

6
tests/unit/core/selector.js
View File

@ -133,7 +133,7 @@ QUnit.test( "focusable - disabled elements", function( assert ) {
} ); } );
QUnit.test( "focusable - hidden styles", function( assert ) { QUnit.test( "focusable - hidden styles", function( assert ) {
assert.expect( 12 ); assert.expect( 15 );
assert.isNotFocusable( "#displayNoneAncestor-input", "input, display: none parent" ); assert.isNotFocusable( "#displayNoneAncestor-input", "input, display: none parent" );
assert.isNotFocusable( "#displayNoneAncestor-span", "span with tabindex, display: none parent" ); assert.isNotFocusable( "#displayNoneAncestor-span", "span with tabindex, display: none parent" );
@ -149,9 +149,13 @@ QUnit.test( "focusable - hidden styles", function( assert ) {
assert.isNotFocusable( "#displayNone-input", "input, display: none" ); assert.isNotFocusable( "#displayNone-input", "input, display: none" );
assert.isNotFocusable( "#visibilityHidden-input", "input, visibility: hidden" ); assert.isNotFocusable( "#visibilityHidden-input", "input, visibility: hidden" );
assert.isNotFocusable( "#visibilityCollapse-input", "input, visibility: collapse" );
assert.isNotFocusable( "#displayNone-span", "span with tabindex, display: none" ); assert.isNotFocusable( "#displayNone-span", "span with tabindex, display: none" );
assert.isNotFocusable( "#visibilityHidden-span", "span with tabindex, visibility: hidden" ); assert.isNotFocusable( "#visibilityHidden-span", "span with tabindex, visibility: hidden" );
assert.isNotFocusable( "#visibilityCollapse-span", "span with tabindex, visibility: collapse" );
assert.isNotFocusable( "#visibilityCollapse-td", "td with tabindex, visibility: collapse" );
} ); } );
QUnit.test( "focusable - natively focusable with various tabindex", function( assert ) { QUnit.test( "focusable - natively focusable with various tabindex", function( assert ) {

2
ui/focusable.js
View File

@ -70,7 +70,7 @@ function visible( element ) {
element = element.parent(); element = element.parent();
visibility = element.css( "visibility" ); visibility = element.css( "visibility" );
} }
return visibility !== "hidden"; return visibility === "visible";
} }
$.extend( $.expr.pseudos, { $.extend( $.expr.pseudos, {