/jquery-ui

Permalink
Browse files

Core: Remove .zIndex() 

Fixes #9156
  • Loading branch information...
@scottgonzalez
scottgonzalez committed Oct 20, 2014
1 parent 89ed68f commit faf87d992455280182edef015c8733313744a739
Unified Split
Showing with 0 additions and 187 deletions.
  1. +0 −1 build/tasks/testswarm.js
  2. +0 −1 tests/unit/all.html
  3. +0 −132 tests/unit/core/core_deprecated.html
  4. +0 −24 tests/unit/core/core_deprecated.js
  5. +0 −29 ui/core.js
View
1 build/tasks/testswarm.js
@@ -15,7 +15,6 @@ var versions = {
"Autocomplete": "autocomplete/autocomplete.html",
"Button": "button/button.html",
"Core": "core/core.html",
"Core_deprecated": "core/core_deprecated.html",
"Datepicker": "datepicker/datepicker.html",
"Dialog": "dialog/dialog.html",
"Draggable": "draggable/draggable.html",
View
1 tests/unit/all.html
@@ -20,7 +20,6 @@
"autocomplete/autocomplete.html",
"button/button.html",
"core/core.html",
"core/core_deprecated.html",
"datepicker/datepicker.html",
"dialog/dialog.html",
"draggable/draggable.html",
View
132 tests/unit/core/core_deprecated.html
@@ -1,132 +0,0 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Core Test Suite</title>
<script src="../../jquery.js"></script>
<link rel="stylesheet" href="../../../external/qunit/qunit.css">
<script src="../../../external/qunit/qunit.js"></script>
<script src="../../../external/jquery-simulate/jquery.simulate.js"></script>
<script src="../testsuite.js"></script>
<script>
TestHelpers.loadResources({
js: [ "ui/core.js" ]
});
</script>
<script src="core.js"></script>
<script src="selector.js"></script>
<script src="core_deprecated.js"></script>
<script src="../swarminject.js"></script>
<style>
.zindex {
z-index: 100;
}
.absolute {
position: absolute;
}
</style>
</head>
<body>
<div id="qunit"></div>
<div id="qunit-fixture">
<img src="../../images/jqueryui_32x32.png" usemap="#mymap" width="10" height="10" alt="">
<map name="mymap">
<area shape="rect" coords="1,1,2,2" href="foo.html" id="areaCoordsHref" alt="">
<area href="foo.html" id="areaNoCoordsHref" alt="">
</map>
<map name="mymap2">
<area shape="rect" coords="1,1,2,2" href="foo.html" id="areaNoImg" alt="">
</map>
<form id="formNoTabindex"></form>
<form id="formTabindex" tabindex="1"></form>
<div>
<input id="visibleAncestor-inputTypeNone">
<input type="text" id="visibleAncestor-inputTypeText">
<input type="checkbox" id="visibleAncestor-inputTypeCheckbox">
<input type="radio" id="visibleAncestor-inputTypeRadio">
<input type="button" id="visibleAncestor-inputTypeButton" value="visibleAncestor-inputTypeButton">
<input type="hidden" id="visibleAncestor-inputTypeHidden">
<button id="visibleAncestor-button">x</button>
<select id="visibleAncestor-select">
<option>option</option>
</select>
<textarea id="visibleAncestor-textarea">x</textarea>
<object id="visibleAncestor-object" codebase="about:blank">xxx</object>
<a href="#" id="visibleAncestor-anchorWithHref">anchor</a>
<a id="visibleAncestor-anchorWithoutHref">anchor</a>
<span id="visibleAncestor-span">x</span>
<div id="visibleAncestor-div">x</div>
<span id="visibleAncestor-spanWithTabindex" tabindex="1">x</span>
<div id="visibleAncestor-divWithNegativeTabindex" tabindex="-1">x</div>
</div>
<div>
<input id="disabledElement-inputTypeNone" disabled="disabled">
<input type="text" id="disabledElement-inputTypeText" disabled="disabled">
<input type="checkbox" id="disabledElement-inputTypeCheckbox" disabled="disabled">
<input type="radio" id="disabledElement-inputTypeRadio" disabled="disabled">
<input type="button" id="disabledElement-inputTypeButton" disabled="disabled" value="disabledElement-inputTypeButton">
<input type="hidden" id="disabledElement-inputTypeHidden" disabled="disabled">
<button id="disabledElement-button" disabled="disabled"></button>
<select id="disabledElement-select" disabled="disabled"></select>
<textarea id="disabledElement-textarea" disabled="disabled"></textarea>
</div>
<div>
<div id="displayNoneAncestor" style="display: none;">
<input id="displayNoneAncestor-input">
<span tabindex="1" id="displayNoneAncestor-span">.</span>
</div>
<div id="visibilityHiddenAncestor" style="visibility: hidden;">
<input id="visibilityHiddenAncestor-input">
<span tabindex="1" id="visibilityHiddenAncestor-span">.</span>
</div>
<span tabindex="1" id="displayNone-span" style="display: none;">.</span>
<span tabindex="1" id="visibilityHidden-span" style="visibility: hidden;">.</span>
<input id="displayNone-input" style="display: none;">
<input id="visibilityHidden-input" style="visibility: hidden;">
</div>
<div>
<input id="inputTabindex0" tabindex="0">
<input id="inputTabindex10" tabindex="10">
<input id="inputTabindex-1" tabindex="-1">
<input id="inputTabindex-50" tabindex="-50">
<span id="spanTabindex0" tabindex="0">.</span>
<span id="spanTabindex10" tabindex="10">.</span>
<span id="spanTabindex-1" tabindex="-1">.</span>
<span id="spanTabindex-50" tabindex="-50">.</span>
</div>
<div style="width: 0; height: 0;">
<input id="dimensionlessParent">
<input id="dimensionlessParent-dimensionless" style="height: 0; width: 0;">
</div>
<div id="zIndex100" style="z-index: 100; position: absolute">
<div id="zIndexAutoWithParent">.</div>
</div>
<div id="zIndex100ViaCSS" class="zindex">
<div id="zIndexAutoWithParentViaCSS">.</div>
</div>
<div id="zIndex100ViaCSSPositioned" class="zindex absolute">
<div id="zIndexAutoWithParentViaCSSPositioned">.</div>
</div>
<div id="zIndexAutoNoParent"></div>
<div id="dimensions" style="float: left; height: 50px; width: 100px; margin: 1px 12px 11px 2px; border-style: solid; border-width: 3px 14px 13px 4px; padding: 5px 16px 15px 6px;"></div>
</div>
</body>
</html>
View
24 tests/unit/core/core_deprecated.js
@@ -1,24 +0,0 @@
(function( $ ) {
module( "core - deprecated" );
test( "zIndex", function() {
expect( 7 );
var el = $( "#zIndexAutoWithParent" ),
parent = el.parent();
equal( el.zIndex(), 100, "zIndex traverses up to find value" );
equal( parent.zIndex(200 ), parent, "zIndex setter is chainable" );
equal( el.zIndex(), 200, "zIndex setter changed zIndex" );
el = $( "#zIndexAutoWithParentViaCSS" );
equal( el.zIndex(), 0, "zIndex traverses up to find CSS value, not found because not positioned" );
el = $( "#zIndexAutoWithParentViaCSSPositioned" );
equal( el.zIndex(), 100, "zIndex traverses up to find CSS value" );
el.parent().zIndex( 200 );
equal( el.zIndex(), 200, "zIndex setter changed zIndex, overriding CSS" );
equal( $( "#zIndexAutoNoParent" ).zIndex(), 0, "zIndex never explicitly set in hierarchy" );
});
})( jQuery );
View
29 ui/core.js
@@ -223,35 +223,6 @@ $.fn.extend({
enableSelection: function() {
return this.unbind( ".ui-disableSelection" );
},
zIndex: function( zIndex ) {
if ( zIndex !== undefined ) {
return this.css( "zIndex", zIndex );
}
if ( this.length ) {
var elem = $( this[ 0 ] ), position, value;
while ( elem.length && elem[ 0 ] !== document ) {
// Ignore z-index if position is set to a value where z-index is ignored by the browser
// This makes behavior of this function consistent across browsers
// WebKit always returns auto if the element is positioned
position = elem.css( "position" );
if ( position === "absolute" || position === "relative" || position === "fixed" ) {
// IE returns 0 when zIndex is not specified
// other browsers return a string
// we ignore the case of nested elements with an explicit value of 0
// <div style="z-index: -10;"><div style="z-index: 0;"></div></div>
value = parseInt( elem.css( "zIndex" ), 10 );
if ( !isNaN( value ) && value !== 0 ) {
return value;
}
}
elem = elem.parent();
}
}
return 0;
}
});

3 comments on commit faf87d9

@CBenni

This comment has been minimized.

Show comment
Hide comment
@CBenni

CBenni Nov 15, 2015

Why was the getter method removed as well? Isnt it useful to have a helper like that? (I would need it in this piece of code im porting over from jquery-ui 1.4)

CBenni replied Nov 15, 2015

Why was the getter method removed as well? Isnt it useful to have a helper like that? (I would need it in this piece of code im porting over from jquery-ui 1.4)
@scottgonzalez

This comment has been minimized.

Show comment
Hide comment
@scottgonzalez

scottgonzalez Nov 15, 2015

Member

Why was the getter method removed as well? Isnt it useful to have a helper like that?

This is explained in the 1.11 upgrade guide when the method was deprecated. See http://jqueryui.com/upgrade-guide/1.11/#deprecated-zindex

(I would need it in this piece of code im porting over from jquery-ui 1.4)

I'm not sure which version you're actually upgrading from, and I'm not sure why you would need the method since you haven't provided any details. However, this method is not going to come back as we have no use for it and think that manually managing z-index is generally a bad idea.
Member

scottgonzalez replied Nov 15, 2015

Why was the getter method removed as well? Isnt it useful to have a helper like that?

This is explained in the 1.11 upgrade guide when the method was deprecated. See http://jqueryui.com/upgrade-guide/1.11/#deprecated-zindex

(I would need it in this piece of code im porting over from jquery-ui 1.4)

I'm not sure which version you're actually upgrading from, and I'm not sure why you would need the method since you haven't provided any details. However, this method is not going to come back as we have no use for it and think that manually managing z-index is generally a bad idea.
@CBenni

This comment has been minimized.

Show comment
Hide comment
@CBenni

CBenni Nov 15, 2015

This codepen explains what im doing: sortable ignores z-index http://codepen.io/anon/pen/EVraOL

I found an old solution where it added a compareZIndex option, which worked fine. I am quite sure this is of no relevance to the community, which is why I will refrain from submitting a PR, but I was wondering why the .zIndex getter was removed - it allows more fine-tuning than just a general .ui-front
For now, I have fixed it by adding the method as _zIndex() inside the custom extended sortable class.

best regards.

CBenni replied Nov 15, 2015

This codepen explains what im doing: sortable ignores z-index http://codepen.io/anon/pen/EVraOL

I found an old solution where it added a compareZIndex option, which worked fine. I am quite sure this is of no relevance to the community, which is why I will refrain from submitting a PR, but I was wondering why the .zIndex getter was removed - it allows more fine-tuning than just a general .ui-front
For now, I have fixed it by adding the method as _zIndex() inside the custom extended sortable class.

best regards.
Please sign in to comment.