Skip to content

All: Remove usage of jQuery positional selectors #1904

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 4 commits into from
Jan 22, 2020
Merged

All: Remove usage of jQuery positional selectors #1904

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
af54b60
All: Rewrite all :first usage to .first()
mgol Dec 9, 2019
33fba53
All: Rewrite all :last usage to .last()
mgol Dec 9, 2019
52aff3c
All: Rewrite all :eq usage to .eq()
mgol Dec 9, 2019
777b068
Accordion: Rewrite all :even usage to .even()
mgol Dec 30, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
24 changes: 12 additions & 12 deletions demos/position/cycler.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,24 +49,24 @@
});
}

left( $( "img:eq(0)" ) );
center( $( "img:eq(1)" ) );
right( $( "img:eq(2)" ) );
left( $( "img" ).eq( 0 ) );
center( $( "img" ).eq( 1 ) );
right( $( "img" ).eq( 2 ) );

function animate( to ) {
$( this ).stop( true, false ).animate( to );
}
function next( event ) {
event.preventDefault();
center( $( "img:eq(2)" ), animate );
left( $( "img:eq(1)" ), animate );
right( $( "img:eq(0)" ).appendTo( "#container" ) );
center( $( "img" ).eq( 2 ), animate );
left( $( "img" ).eq( 1 ), animate );
right( $( "img" ).eq( 0 ).appendTo( "#container" ) );
}
function previous( event ) {
event.preventDefault();
center( $( "img:eq(0)" ), animate );
right( $( "img:eq(1)" ), animate );
left( $( "img:eq(2)" ).prependTo( "#container" ) );
center( $( "img" ).eq( 0 ), animate );
right( $( "img" ).eq( 1 ), animate );
left( $( "img" ).eq( 2 ).prependTo( "#container" ) );
}
$( "#previous" ).on( "click", previous );
$( "#next" ).on( "click", next );
Expand All @@ -76,9 +76,9 @@
});

$( window ).on( "resize", function() {
left( $( "img:eq(0)" ), animate );
center( $( "img:eq(1)" ), animate );
right( $( "img:eq(2)" ), animate );
left( $( "img" ).eq( 0 ), animate );
center( $( "img" ).eq( 1 ), animate );
right( $( "img" ).eq( 2 ), animate );
});
</script>
</head>
Expand Down
5 changes: 4 additions & 1 deletion tests/lib/bootstrap.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -172,8 +172,11 @@ function migrateUrl() {
}
}

var jQueryVersion = parseUrl().jquery;

// Load the jQuery fixes, if necessary
if ( parseFloat( parseUrl().jquery ) < 3 ) {
if ( !jQueryVersion ||
( jQueryVersion.indexOf( "git" ) === -1 && parseFloat( jQueryVersion ) < 4 ) ) {
modules.unshift( "ui/jquery-1-7" );
}

Expand Down
4 changes: 3 additions & 1 deletion tests/unit/accordion/common.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,9 @@ common.testWidget( "accordion", {
collapsible: false,
disabled: false,
event: "click",
header: "> li > :first-child, > :not(li):even",
header: function( elem ) {
return elem.find( "> li > :first-child" ).add( elem.find( "> :not(li)" ).even() );
},
heightStyle: "auto",
icons: {
"activeHeader": "ui-icon-triangle-1-s",
Expand Down
2 changes: 1 addition & 1 deletion tests/unit/accordion/core.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ $.each( { div: "#list1", ul: "#navigation", dl: "#accordion-dl" }, function( typ
QUnit.test( "handle click on header-descendant", function( assert ) {
assert.expect( 1 );
var element = $( "#navigation" ).accordion();
$( "#navigation h2:eq(1) a" ).trigger( "click" );
$( "#navigation h2" ).eq( 1 ).find( "a" ).trigger( "click" );
state( assert, element, 0, 1, 0 );
} );

Expand Down
22 changes: 19 additions & 3 deletions tests/unit/accordion/options.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -376,15 +376,15 @@ QUnit.test( "{ event: custom }", function( assert ) {
QUnit.test( "{ header: default }", function( assert ) {
assert.expect( 2 );

// Default: > li > :first-child,> :not(li):even
// > :not(li):even
// Default: elem.find( "> li > :first-child" ).add( elem.find( "> :not(li)" ).even() )
// elem.find( "> :not(li)" ).even()
state( assert, $( "#list1" ).accordion(), 1, 0, 0 );

// > li > :first-child
state( assert, $( "#navigation" ).accordion(), 1, 0, 0 );
} );

QUnit.test( "{ header: custom }", function( assert ) {
QUnit.test( "{ header: customString }", function( assert ) {
assert.expect( 6 );
var element = $( "#navigationWrapper" ).accordion( {
header: "h2"
Expand All @@ -398,6 +398,22 @@ QUnit.test( "{ header: custom }", function( assert ) {
state( assert, element, 0, 0, 1 );
} );

QUnit.test( "{ header: customFunction }", function( assert ) {
assert.expect( 6 );
var element = $( "#navigationWrapper" ).accordion( {
header: function( elem ) {
return elem.find( "h2" );
}
} );
element.find( "h2" ).each( function() {
assert.hasClasses( this, "ui-accordion-header" );
} );
assert.equal( element.find( ".ui-accordion-header" ).length, 3 );
state( assert, element, 1, 0, 0 );
element.accordion( "option", "active", 2 );
state( assert, element, 0, 0, 1 );
} );

QUnit.test( "{ heightStyle: 'auto' }", function( assert ) {
assert.expect( 3 );
var element = $( "#navigation" ).accordion( { heightStyle: "auto" } );
Expand Down
98 changes: 49 additions & 49 deletions tests/unit/datepicker/core.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,33 +51,33 @@ QUnit.test( "baseStructure", function( assert ) {
assert.ok( !dp.is( ".ui-datepicker-multi" ), "Structure - not multi-month" );
assert.equal( dp.children().length, 2, "Structure - child count" );

header = dp.children( ":first" );
header = dp.children().first();
assert.ok( header.is( "div.ui-datepicker-header" ), "Structure - header division" );
assert.equal( header.children().length, 3, "Structure - header child count" );
assert.ok( header.children( ":first" ).is( "a.ui-datepicker-prev" ) && header.children( ":first" ).html() !== "", "Structure - prev link" );
assert.ok( header.children( ":eq(1)" ).is( "a.ui-datepicker-next" ) && header.children( ":eq(1)" ).html() !== "", "Structure - next link" );
assert.ok( header.children().first().is( "a.ui-datepicker-prev" ) && header.children().first().html() !== "", "Structure - prev link" );
assert.ok( header.children().eq( 1 ).is( "a.ui-datepicker-next" ) && header.children().eq ( 1 ).html() !== "", "Structure - next link" );

title = header.children( ":last" );
title = header.children().last();
assert.ok( title.is( "div.ui-datepicker-title" ) && title.html() !== "", "Structure - title division" );
assert.equal( title.children().length, 2, "Structure - title child count" );
assert.ok( title.children( ":first" ).is( "span.ui-datepicker-month" ) && title.children( ":first" ).text() !== "", "Structure - month text" );
assert.ok( title.children( ":last" ).is( "span.ui-datepicker-year" ) && title.children( ":last" ).text() !== "", "Structure - year text" );
assert.ok( title.children().first().is( "span.ui-datepicker-month" ) && title.children().first().text() !== "", "Structure - month text" );
assert.ok( title.children().last().is( "span.ui-datepicker-year" ) && title.children().last().text() !== "", "Structure - year text" );

table = dp.children( ":eq(1)" );
table = dp.children().eq( 1 );
assert.ok( table.is( "table.ui-datepicker-calendar" ), "Structure - month table" );
assert.ok( table.children( ":first" ).is( "thead" ), "Structure - month table thead" );
assert.ok( table.children().first().is( "thead" ), "Structure - month table thead" );

thead = table.children( ":first" ).children( ":first" );
thead = table.children().first().children().first();
assert.ok( thead.is( "tr" ), "Structure - month table title row" );
assert.equal( thead.find( "th" ).length, 7, "Structure - month table title cells" );
assert.ok( table.children( ":eq(1)" ).is( "tbody" ), "Structure - month table body" );
assert.ok( table.children( ":eq(1)" ).children( "tr" ).length >= 4, "Structure - month table week count" );
assert.ok( table.children().eq( 1 ).is( "tbody" ), "Structure - month table body" );
assert.ok( table.children().eq( 1 ).children( "tr" ).length >= 4, "Structure - month table week count" );

week = table.children( ":eq(1)" ).children( ":first" );
week = table.children().eq( 1 ).children().first();
assert.ok( week.is( "tr" ), "Structure - month table week row" );
assert.equal( week.children().length, 7, "Structure - week child count" );
assert.ok( week.children( ":first" ).is( "td.ui-datepicker-week-end" ), "Structure - month table first day cell" );
assert.ok( week.children( ":last" ).is( "td.ui-datepicker-week-end" ), "Structure - month table second day cell" );
assert.ok( week.children().first().is( "td.ui-datepicker-week-end" ), "Structure - month table first day cell" );
assert.ok( week.children().last().is( "td.ui-datepicker-week-end" ), "Structure - month table second day cell" );

inp.datepicker( "hide" ).datepicker( "destroy" );
step2();
Expand All @@ -94,14 +94,14 @@ QUnit.test( "baseStructure", function( assert ) {
} );
testHelper.onFocus( inp, function() {
title = dp.find( "div.ui-datepicker-title" );
assert.ok( title.children( ":first" ).is( "select.ui-datepicker-month" ), "Structure - month selector" );
assert.ok( title.children( ":last" ).is( "select.ui-datepicker-year" ), "Structure - year selector" );
assert.ok( title.children().first().is( "select.ui-datepicker-month" ), "Structure - month selector" );
assert.ok( title.children().last().is( "select.ui-datepicker-year" ), "Structure - year selector" );

panel = dp.children( ":last" );
panel = dp.children().last();
assert.ok( panel.is( "div.ui-datepicker-buttonpane" ), "Structure - button panel division" );
assert.equal( panel.children().length, 2, "Structure - button panel child count" );
assert.ok( panel.children( ":first" ).is( "button.ui-datepicker-current" ), "Structure - today button" );
assert.ok( panel.children( ":last" ).is( "button.ui-datepicker-close" ), "Structure - close button" );
assert.ok( panel.children().first().is( "button.ui-datepicker-current" ), "Structure - today button" );
assert.ok( panel.children().last().is( "button.ui-datepicker-close" ), "Structure - close button" );

inp.datepicker( "hide" ).datepicker( "destroy" );
step3();
Expand All @@ -116,13 +116,13 @@ QUnit.test( "baseStructure", function( assert ) {
assert.ok( dp.is( ".ui-datepicker-multi" ), "Structure multi [2] - multi-month" );
assert.equal( dp.children().length, 3, "Structure multi [2] - child count" );

child = dp.children( ":first" );
child = dp.children().first();
assert.ok( child.is( "div.ui-datepicker-group" ) && child.is( "div.ui-datepicker-group-first" ), "Structure multi [2] - first month division" );

child = dp.children( ":eq(1)" );
child = dp.children().eq( 1 );
assert.ok( child.is( "div.ui-datepicker-group" ) && child.is( "div.ui-datepicker-group-last" ), "Structure multi [2] - second month division" );

child = dp.children( ":eq(2)" );
child = dp.children().eq( 2 );
assert.ok( child.is( "div.ui-datepicker-row-break" ), "Structure multi [2] - row break" );
assert.ok( dp.is( ".ui-datepicker-multi-2" ), "Structure multi [2] - multi-2" );

Expand Down Expand Up @@ -152,22 +152,22 @@ QUnit.test( "baseStructure", function( assert ) {
assert.ok( dp.is( ".ui-datepicker-multi" ), "Structure multi - multi-month" );
assert.equal( dp.children().length, 6, "Structure multi [2,2] - child count" );

child = dp.children( ":first" );
child = dp.children().first();
assert.ok( child.is( "div.ui-datepicker-group" ) && child.is( "div.ui-datepicker-group-first" ), "Structure multi [2,2] - first month division" );

child = dp.children( ":eq(1)" );
child = dp.children().eq( 1 );
assert.ok( child.is( "div.ui-datepicker-group" ) && child.is( "div.ui-datepicker-group-last" ), "Structure multi [2,2] - second month division" );

child = dp.children( ":eq(2)" );
child = dp.children().eq( 2 );
assert.ok( child.is( "div.ui-datepicker-row-break" ), "Structure multi [2,2] - row break" );

child = dp.children( ":eq(3)" );
child = dp.children().eq( 3 );
assert.ok( child.is( "div.ui-datepicker-group" ) && child.is( "div.ui-datepicker-group-first" ), "Structure multi [2,2] - third month division" );

child = dp.children( ":eq(4)" );
child = dp.children().eq( 4 );
assert.ok( child.is( "div.ui-datepicker-group" ) && child.is( "div.ui-datepicker-group-last" ), "Structure multi [2,2] - fourth month division" );

child = dp.children( ":eq(5)" );
child = dp.children().eq( 5 );
assert.ok( child.is( "div.ui-datepicker-row-break" ), "Structure multi [2,2] - row break" );

inp.datepicker( "hide" ).datepicker( "destroy" );
Expand All @@ -181,14 +181,14 @@ QUnit.test( "baseStructure", function( assert ) {
assert.ok( !dp.is( ".ui-datepicker-multi" ), "Structure inline - not multi-month" );
assert.equal( dp.children().length, 2, "Structure inline - child count" );

header = dp.children( ":first" );
header = dp.children().first();
assert.ok( header.is( "div.ui-datepicker-header" ), "Structure inline - header division" );
assert.equal( header.children().length, 3, "Structure inline - header child count" );

table = dp.children( ":eq(1)" );
table = dp.children().eq( 1 );
assert.ok( table.is( "table.ui-datepicker-calendar" ), "Structure inline - month table" );
assert.ok( table.children( ":first" ).is( "thead" ), "Structure inline - month table thead" );
assert.ok( table.children( ":eq(1)" ).is( "tbody" ), "Structure inline - month table body" );
assert.ok( table.children().first().is( "thead" ), "Structure inline - month table thead" );
assert.ok( table.children().eq( 1 ).is( "tbody" ), "Structure inline - month table body" );

inl.datepicker( "destroy" );

Expand All @@ -199,13 +199,13 @@ QUnit.test( "baseStructure", function( assert ) {
assert.ok( dp.is( ".ui-datepicker-inline" ) && dp.is( ".ui-datepicker-multi" ), "Structure inline multi - main div" );
assert.equal( dp.children().length, 3, "Structure inline multi - child count" );

child = dp.children( ":first" );
child = dp.children().first();
assert.ok( child.is( "div.ui-datepicker-group" ) && child.is( "div.ui-datepicker-group-first" ), "Structure inline multi - first month division" );

child = dp.children( ":eq(1)" );
child = dp.children().eq( 1 );
assert.ok( child.is( "div.ui-datepicker-group" ) && child.is( "div.ui-datepicker-group-last" ), "Structure inline multi - second month division" );

child = dp.children( ":eq(2)" );
child = dp.children().eq( 2 );
assert.ok( child.is( "div.ui-datepicker-row-break" ), "Structure inline multi - row break" );

inl.datepicker( "destroy" );
Expand All @@ -229,17 +229,17 @@ QUnit.test( "customStructure", function( assert ) {
testHelper.onFocus( inp, function() {
assert.ok( dp.is( ".ui-datepicker-rtl" ), "Structure RTL - right-to-left" );

header = dp.children( ":first" );
header = dp.children().first();
assert.ok( header.is( "div.ui-datepicker-header" ), "Structure RTL - header division" );
assert.equal( header.children().length, 3, "Structure RTL - header child count" );
assert.ok( header.children( ":first" ).is( "a.ui-datepicker-next" ), "Structure RTL - prev link" );
assert.ok( header.children( ":eq(1)" ).is( "a.ui-datepicker-prev" ), "Structure RTL - next link" );
assert.ok( header.children().first().is( "a.ui-datepicker-next" ), "Structure RTL - prev link" );
assert.ok( header.children().eq( 1 ).is( "a.ui-datepicker-prev" ), "Structure RTL - next link" );

panel = dp.children( ":last" );
panel = dp.children().last();
assert.ok( panel.is( "div.ui-datepicker-buttonpane" ), "Structure RTL - button division" );
assert.equal( panel.children().length, 2, "Structure RTL - button panel child count" );
assert.ok( panel.children( ":first" ).is( "button.ui-datepicker-close" ), "Structure RTL - close button" );
assert.ok( panel.children( ":last" ).is( "button.ui-datepicker-current" ), "Structure RTL - today button" );
assert.ok( panel.children().first().is( "button.ui-datepicker-close" ), "Structure RTL - close button" );
assert.ok( panel.children().last().is( "button.ui-datepicker-current" ), "Structure RTL - today button" );

inp.datepicker( "hide" ).datepicker( "destroy" );
step2();
Expand All @@ -256,10 +256,10 @@ QUnit.test( "customStructure", function( assert ) {
inp.val( "02/10/2008" );

testHelper.onFocus( inp, function() {
header = dp.children( ":first" );
header = dp.children().first();
assert.ok( header.is( "div.ui-datepicker-header" ), "Structure hide prev/next - header division" );
assert.equal( header.children().length, 1, "Structure hide prev/next - links child count" );
assert.ok( header.children( ":first" ).is( "div.ui-datepicker-title" ), "Structure hide prev/next - title division" );
assert.ok( header.children().first().is( "div.ui-datepicker-title" ), "Structure hide prev/next - title division" );

inp.datepicker( "hide" ).datepicker( "destroy" );
step3();
Expand All @@ -271,10 +271,10 @@ QUnit.test( "customStructure", function( assert ) {
inp = testHelper.initNewInput( { changeMonth: true } );

testHelper.onFocus( inp, function() {
title = dp.children( ":first" ).children( ":last" );
title = dp.children().first().children().last();
assert.equal( title.children().length, 2, "Structure changeable month - title child count" );
assert.ok( title.children( ":first" ).is( "select.ui-datepicker-month" ), "Structure changeable month - month selector" );
assert.ok( title.children( ":last" ).is( "span.ui-datepicker-year" ), "Structure changeable month - read-only year" );
assert.ok( title.children().first().is( "select.ui-datepicker-month" ), "Structure changeable month - month selector" );
assert.ok( title.children().last().is( "span.ui-datepicker-year" ), "Structure changeable month - read-only year" );

inp.datepicker( "hide" ).datepicker( "destroy" );
step4();
Expand All @@ -286,10 +286,10 @@ QUnit.test( "customStructure", function( assert ) {
inp = testHelper.initNewInput( { changeYear: true } );

testHelper.onFocus( inp, function() {
title = dp.children( ":first" ).children( ":last" );
title = dp.children().first().children().last();
assert.equal( title.children().length, 2, "Structure changeable year - title child count" );
assert.ok( title.children( ":first" ).is( "span.ui-datepicker-month" ), "Structure changeable year - read-only month" );
assert.ok( title.children( ":last" ).is( "select.ui-datepicker-year" ), "Structure changeable year - year selector" );
assert.ok( title.children().first().is( "span.ui-datepicker-month" ), "Structure changeable year - read-only month" );
assert.ok( title.children().last().is( "select.ui-datepicker-year" ), "Structure changeable year - year selector" );

inp.datepicker( "hide" ).datepicker( "destroy" );
step5();
Expand Down
Loading