Skip to content

Commit dc0befe

Browse files
committed
Button: updating tests
1 parent 93c0de4 commit dc0befe

File tree

7 files changed

+30
-214
lines changed

7 files changed

+30
-214
lines changed

demos/button/checkbox.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -69,7 +69,7 @@
6969

7070
<input type="radio" id="radio-1" name="radio"/>
7171
<label for="radio-1">Radio widget sample</label>
72-
<label for="radio-2">Radio widget sample 2<input type="radio" id="radio-2" name="radio"/></label>
72+
<label for="radio-2">Radio widget sample 2<input type="radio" id="radio-2"/></label>
7373
<button type="reset">Reset</button>
7474
</form>
7575
</div>

tests/unit/button/button_common.js

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,10 @@
11
TestHelpers.commonWidgetTests( "button", {
22
defaults: {
33
disabled: null,
4-
icons: {
5-
primary: null,
6-
secondary: null
7-
},
8-
label: null,
94
text: true,
5+
label: null,
6+
icon: null,
7+
iconPosition: "begining",
108

119
// callbacks
1210
create: null

tests/unit/button/button_core.js

Lines changed: 3 additions & 184 deletions
Original file line numberDiff line numberDiff line change
@@ -7,52 +7,6 @@
77

88
module("button: core");
99

10-
test("checkbox", function() {
11-
expect( 4 );
12-
var input = $("#check"),
13-
label = $("label[for=check]");
14-
ok( input.is(":visible") );
15-
ok( label.is(":not(.ui-button)") );
16-
input.button();
17-
ok( input.is(".ui-helper-hidden-accessible") );
18-
ok( label.is(".ui-button") );
19-
});
20-
21-
test("radios", function() {
22-
expect( 4 );
23-
var inputs = $("#radio0 input"),
24-
labels = $("#radio0 label");
25-
ok( inputs.is(":visible") );
26-
ok( labels.is(":not(.ui-button)") );
27-
inputs.button();
28-
ok( inputs.is(".ui-helper-hidden-accessible") );
29-
ok( labels.is(".ui-button") );
30-
});
31-
32-
function assert(noForm, form1, form2) {
33-
ok( $("#radio0 .ui-button" + noForm).is(".ui-state-active") );
34-
ok( $("#radio1 .ui-button" + form1).is(".ui-state-active") );
35-
ok( $("#radio2 .ui-button" + form2).is(".ui-state-active") );
36-
}
37-
38-
test("radio groups", function() {
39-
expect( 12 );
40-
$("input[type=radio]").button();
41-
assert(":eq(0)", ":eq(1)", ":eq(2)");
42-
43-
// click outside of forms
44-
$("#radio0 .ui-button:eq(1)").click();
45-
assert(":eq(1)", ":eq(1)", ":eq(2)");
46-
47-
// click in first form
48-
$("#radio1 .ui-button:eq(0)").click();
49-
assert(":eq(1)", ":eq(0)", ":eq(2)");
50-
51-
// click in second form
52-
$("#radio2 .ui-button:eq(0)").click();
53-
assert(":eq(1)", ":eq(0)", ":eq(0)");
54-
});
55-
5610
test("input type submit, don't create child elements", function() {
5711
expect( 2 );
5812
var input = $("#submit");
@@ -61,150 +15,15 @@ test("input type submit, don't create child elements", function() {
6115
deepEqual( input.children().length, 0 );
6216
});
6317

64-
test("buttonset", function() {
65-
expect( 6 );
66-
var set = $("#radio1").buttonset();
67-
ok( set.is(".ui-buttonset") );
68-
deepEqual( set.children(".ui-button").length, 3 );
69-
deepEqual( set.children("input[type=radio].ui-helper-hidden-accessible").length, 3 );
70-
ok( set.children("label:eq(0)").is(".ui-button.ui-corner-left:not(.ui-corner-all)") );
71-
ok( set.children("label:eq(1)").is(".ui-button:not(.ui-corner-all)") );
72-
ok( set.children("label:eq(2)").is(".ui-button.ui-corner-right:not(.ui-corner-all)") );
73-
});
74-
75-
test("buttonset (rtl)", function() {
76-
expect( 6 );
77-
var set,
78-
parent = $("#radio1").parent();
79-
// Set to rtl
80-
parent.attr("dir", "rtl");
81-
82-
set = $("#radio1").buttonset();
83-
ok( set.is(".ui-buttonset") );
84-
deepEqual( set.children(".ui-button").length, 3 );
85-
deepEqual( set.children("input[type=radio].ui-helper-hidden-accessible").length, 3 );
86-
ok( set.children("label:eq(0)").is(".ui-button.ui-corner-right:not(.ui-corner-all)") );
87-
ok( set.children("label:eq(1)").is(".ui-button:not(.ui-corner-all)") );
88-
ok( set.children("label:eq(2)").is(".ui-button.ui-corner-left:not(.ui-corner-all)") );
89-
});
90-
91-
// TODO: simulated click events don't behave like real click events in IE
92-
// remove this when simulate properly simulates this
93-
// see http://yuilibrary.com/projects/yui2/ticket/2528826 fore more info
94-
if ( !$.ui.ie || ( document.documentMode && document.documentMode > 8 ) ) {
95-
asyncTest( "ensure checked and aria after single click on checkbox label button, see #5518", function() {
96-
expect( 3 );
97-
98-
$("#check2").button().change( function() {
99-
var lbl = $( this ).button("widget");
100-
ok( this.checked, "checked ok" );
101-
ok( lbl.attr("aria-pressed") === "true", "aria ok" );
102-
ok( lbl.hasClass("ui-state-active"), "ui-state-active ok" );
103-
});
104-
105-
// support: Opera
106-
// Opera doesn't trigger a change event when this is done synchronously.
107-
// This seems to be a side effect of another test, but until that can be
108-
// tracked down, this delay will have to do.
109-
setTimeout(function() {
110-
$("#check2").button("widget").simulate("click");
111-
start();
112-
}, 1 );
113-
});
114-
}
115-
116-
test( "#7092 - button creation that requires a matching label does not find label in all cases", function() {
117-
expect( 5 );
118-
var group = $( "<span><label for='t7092a'></label><input type='checkbox' id='t7092a'></span>" );
119-
group.find( "input[type=checkbox]" ).button();
120-
ok( group.find( "label" ).is( ".ui-button" ) );
121-
122-
group = $( "<input type='checkbox' id='t7092b'><label for='t7092b'></label>" );
123-
group.filter( "input[type=checkbox]" ).button();
124-
ok( group.filter( "label" ).is( ".ui-button" ) );
125-
126-
group = $( "<span><input type='checkbox' id='t7092c'></span><label for='t7092c'></label>" );
127-
group.find( "input[type=checkbox]" ).button();
128-
ok( group.filter( "label" ).is( ".ui-button" ) );
129-
130-
group = $( "<span><input type='checkbox' id='t7092d'></span><span><label for='t7092d'></label></span>" );
131-
group.find( "input[type=checkbox]" ).button();
132-
ok( group.find( "label" ).is( ".ui-button" ) );
133-
134-
group = $( "<input type='checkbox' id='t7092e'><span><label for='t7092e'></label></span>" );
135-
group.filter( "input[type=checkbox]" ).button();
136-
ok( group.find( "label" ).is( ".ui-button" ) );
137-
});
138-
139-
test( "#5946 - buttonset should ignore buttons that are not :visible", function() {
140-
expect( 2 );
141-
$( "#radio01" ).next().addBack().hide();
142-
var set = $( "#radio0" ).buttonset({ items: "input[type=radio]:visible" });
143-
ok( set.find( "label:eq(0)" ).is( ":not(.ui-button):not(.ui-corner-left)" ) );
144-
ok( set.find( "label:eq(1)" ).is( ".ui-button.ui-corner-left" ) );
145-
});
146-
147-
test( "#6262 - buttonset not applying ui-corner to invisible elements", function() {
148-
expect( 3 );
149-
$( "#radio0" ).hide();
150-
var set = $( "#radio0" ).buttonset();
151-
ok( set.find( "label:eq(0)" ).is( ".ui-button.ui-corner-left" ) );
152-
ok( set.find( "label:eq(1)" ).is( ".ui-button" ) );
153-
ok( set.find( "label:eq(2)" ).is( ".ui-button.ui-corner-right" ) );
154-
});
155-
156-
asyncTest( "Resetting a button's form should refresh the visual state of the button widget to match.", function() {
157-
expect( 2 );
158-
var form = $( "<form>" +
159-
"<button></button>" +
160-
"<label for='c1'></label><input id='c1' type='checkbox' checked>" +
161-
"</form>" ),
162-
button = form.find( "button" ).button(),
163-
checkbox = form.find( "input[type=checkbox]" ).button();
164-
165-
checkbox.prop( "checked", false ).button( "refresh" );
166-
ok( !checkbox.button( "widget" ).hasClass( "ui-state-active" ) );
167-
168-
form.get( 0 ).reset();
169-
170-
// #9213: If a button has been removed, refresh should not be called on it when
171-
// its corresponding form is reset.
172-
button.remove();
173-
174-
setTimeout(function() {
175-
ok( checkbox.button( "widget" ).hasClass( "ui-state-active" ));
176-
start();
177-
}, 1 );
178-
});
179-
180-
asyncTest( "#6711 Checkbox/Radiobutton do not Show Focused State when using Keyboard Navigation", function() {
181-
expect( 2 );
182-
var check = $( "#check" ).button(),
183-
label = $( "label[for='check']" );
184-
ok( !label.is( ".ui-state-focus" ) );
185-
check.focus();
186-
setTimeout(function() {
187-
ok( label.is( ".ui-state-focus" ) );
188-
start();
189-
});
190-
});
191-
192-
test( "#7534 - Button label selector works for ids with \":\"", function() {
193-
expect( 1 );
194-
var group = $( "<span><input type='checkbox' id='check:7534'><label for='check:7534'>Label</label></span>" );
195-
group.find( "input" ).button();
196-
ok( group.find( "label" ).is( ".ui-button" ), "Found an id with a :" );
197-
});
198-
19918
asyncTest( "#9169 - Disabled button maintains ui-state-focus", function() {
20019
expect( 2 );
20120
var element = $( "#button1" ).button();
20221
element[ 0 ].focus();
20322
setTimeout(function() {
204-
ok( element.hasClass( "ui-state-focus" ), "button has ui-state-focus" );
23+
ok( element.is( ":focus" ), "button is focused" );
20524
element.button( "disable" );
206-
ok( !element.hasClass( "ui-state-focus" ),
207-
"button does not have ui-state-focus when disabled" );
25+
ok( !element.is( ":focus" ),
26+
"button has had focus removed" );
20827
start();
20928
});
21029
});

tests/unit/button/button_events.js

Lines changed: 0 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -5,14 +5,6 @@
55

66
module("button: events");
77

8-
test("buttonset works with single-quote named elements (#7505)", function() {
9-
expect( 1 );
10-
$("#radio3").buttonset();
11-
$("#radio33").click( function(){
12-
ok( true, "button clicks work with single-quote named elements" );
13-
}).click();
14-
});
15-
168
asyncTest( "when button loses focus, ensure active state is removed (#8559)", function() {
179
expect( 1 );
1810

tests/unit/button/button_options.js

Lines changed: 4 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ test("text false without icon", function() {
4343
$("#button").button({
4444
text: false
4545
});
46-
ok( $("#button").is(".ui-button-text-only:not(.ui-button-icon-only)") );
46+
ok( $("#button").is(":not(.ui-button-icon-only)") );
4747

4848
$("#button").button("destroy");
4949
});
@@ -52,9 +52,7 @@ test("text false with icon", function() {
5252
expect( 1 );
5353
$("#button").button({
5454
text: false,
55-
icons: {
56-
primary: "iconclass"
57-
}
55+
icon: "iconclass"
5856
});
5957
ok( $("#button").is(".ui-button-icon-only:not(.ui-button-text):has(span.ui-icon.iconclass)") );
6058

@@ -100,12 +98,9 @@ test("icons", function() {
10098
expect( 1 );
10199
$("#button").button({
102100
text: false,
103-
icons: {
104-
primary: "iconclass",
105-
secondary: "iconclass2"
106-
}
101+
icon: "iconclass"
107102
});
108-
ok( $("#button").is(":has(span.ui-icon.ui-button-icon-primary.iconclass):has(span.ui-icon.ui-button-icon-secondary.iconclass2)") );
103+
ok( $("#button").is(":has(span.ui-icon.iconclass)") );
109104

110105
$("#button").button("destroy");
111106
});

ui/jquery.ui.button.js

Lines changed: 16 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@
1515
(function( $, undefined ) {
1616

1717
var baseClasses = "ui-button ui-widget ui-corner-all",
18-
typeClasses = "ui-button-icons-only ui-button-icon-only ui-button-text-icons ui-button-text-icon-primary ui-button-text-icon-secondary ui-button-text-only",
18+
typeClasses = "ui-button-icons-only ui-button-icon-only ui-button-text-icons ui-button-text-icon-primary ui-button-text-icon-secondary ui-button-text-only ui-icon-begining ui-icon-end ui-icon-top ui-icon-bottom",
1919
formResetHandler = function() {
2020
var form = $( this );
2121
setTimeout(function() {
@@ -60,6 +60,11 @@ $.widget( "ui.button", {
6060

6161
if ( typeof this.options.disabled === "boolean" ) {
6262
this.element.prop( "disabled", this.options.disabled );
63+
} else {
64+
this.options.disabled = !!this.element.prop( "disabled" );
65+
}
66+
if( this.options.disabled === true ){
67+
this._setOption( "disabled", true );
6368
}
6469

6570
this.element
@@ -75,17 +80,21 @@ $.widget( "ui.button", {
7580
if( !this.options.text ){
7681
this.element.addClass( " ui-button-icon-only" );
7782
}
78-
console.log( this.icon );
7983
this.element.append( this.icon );
8084
this._setTitle();
8185
}
8286
if( this.options.label ){
8387
if( this.isInput ) {
8488
this.element.val( this.options.label );
8589
} else {
86-
this.element.contents().filter( function() {
90+
var textNode = this.element.contents().filter( function() {
8791
return this.nodeType === 3;
88-
})[0].nodeValue = this.options.label;
92+
})[ 0 ];
93+
if( textNode !== undefined ) {
94+
textNode.nodeValue = this.options.label;
95+
} else {
96+
this.element.html( this.options.label + this.element.html() );
97+
}
8998
}
9099
}
91100

@@ -112,7 +121,7 @@ $.widget( "ui.button", {
112121

113122
_destroy: function() {
114123
this.element
115-
.removeClass( "ui-helper-hidden-accessible" + baseClasses + " ui-state-active " + typeClasses )
124+
.removeClass( "ui-helper-hidden-accessible " + baseClasses + " ui-state-active " + typeClasses )
116125
.removeAttr( "role" )
117126
.removeAttr( "aria-pressed" );
118127

@@ -145,14 +154,14 @@ $.widget( "ui.button", {
145154
this._super( key, value );
146155
if ( key === "disabled" ) {
147156
this.element.toggleClass( " ui-state-disabled", !!value );
148-
this.element.prop( "disabled", !!value );
157+
this.element.prop( "disabled", !!value ).blur();
149158
return;
150159
}
151160
},
152161

153162
refresh: function() {
154163
//See #8237 & #8828
155-
var isDisabled = this.element.hasClass( "ui-button-disabled" );
164+
var isDisabled = this.element.is( "input, button" ) ? this.element.is( ":disabled" ) : this.element.hasClass( "ui-button-disabled" );
156165

157166
if ( isDisabled !== this.options.disabled ) {
158167
this._setOptions( { "disabled": isDisabled } );

ui/jquery.ui.checkboxradio.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -67,8 +67,11 @@ $.widget( "ui.checkboxradio", {
6767
this.element.closest( "form" )
6868
.unbind( "reset" + "." + this.widgetName )
6969
.bind( "reset" + "."+ this.widgetName, formResetHandler );
70+
7071
if ( typeof this.options.disabled === "boolean" ) {
7172
this.element.prop( "disabled", this.options.disabled );
73+
} else {
74+
this.options.disabled = !!this.element.prop( "disabled" );
7275
}
7376

7477
this._getType();

0 commit comments

Comments
 (0)