Checkboxradio: Shift to use no globals

This commit is contained in:
Amanpreet Singh 2016-04-03 20:23:34 +05:30
parent fd1c236c0f
commit e089b1dd49
4 changed files with 98 additions and 91 deletions

View File

@ -1,12 +1,13 @@
define( [
"qunit",
"jquery",
"ui/widgets/checkboxradio"
], function( $ ) {
], function( QUnit, $ ) {
module( "Checkboxradio: core" );
QUnit.module( "Checkboxradio: core" );
test( "Checkbox - Initial class structure", function( assert ) {
expect( 2 );
QUnit.test( "Checkbox - Initial class structure", function( assert ) {
assert.expect( 2 );
var input = $( "#check" ),
label = $( "label[for=check]" );
@ -15,8 +16,8 @@ test( "Checkbox - Initial class structure", function( assert ) {
assert.hasClasses( label, "ui-button ui-widget ui-checkboxradio-label ui-corner-all" );
} );
test( "Radios - Initial class structure", function( assert ) {
expect( 6 );
QUnit.test( "Radios - Initial class structure", function( assert ) {
assert.expect( 6 );
var inputs = $( "#radio0 input" ),
labels = $( "#radio0 label" );
@ -29,12 +30,13 @@ test( "Radios - Initial class structure", function( assert ) {
} );
} );
asyncTest( "Ensure checked after single click on checkbox label button", function( assert ) {
expect( 2 );
QUnit.test( "Ensure checked after single click on checkbox label button", function( assert ) {
var ready = assert.async();
assert.expect( 2 );
$( "#check2" ).checkboxradio().change( function() {
var label = $( this ).checkboxradio( "widget" );
ok( this.checked, "checked ok" );
assert.ok( this.checked, "checked ok" );
assert.hasClasses( label, "ui-state-active" );
} );
@ -45,12 +47,12 @@ asyncTest( "Ensure checked after single click on checkbox label button", functio
// tracked down, this delay will have to do.
setTimeout( function() {
$( "#check2" ).checkboxradio( "widget" ).simulate( "click" );
start();
ready();
} );
} );
test( "Handle form association via form attribute", function( assert ) {
expect( 4 );
QUnit.test( "Handle form association via form attribute", function( assert ) {
assert.expect( 4 );
var radio1 = $( "#crazy-form-1" ).checkboxradio();
var radio1Label = radio1.checkboxradio( "widget" );
@ -58,8 +60,8 @@ test( "Handle form association via form attribute", function( assert ) {
var radio2Label = radio2.checkboxradio( "widget" );
radio2.change( function() {
ok( this.checked, "#2 checked" );
ok( !radio1[ 0 ].checked, "#1 not checked" );
assert.ok( this.checked, "#2 checked" );
assert.ok( !radio1[ 0 ].checked, "#1 not checked" );
assert.hasClasses( radio2Label, "ui-state-active" );
assert.lacksClasses( radio1Label, "ui-state-active" );
@ -68,8 +70,8 @@ test( "Handle form association via form attribute", function( assert ) {
radio2Label.simulate( "click" );
} );
test( "Checkbox creation requires a label, and finds it in all cases", function( assert ) {
expect( 7 );
QUnit.test( "Checkbox creation requires a label, and finds it in all cases", function( assert ) {
assert.expect( 7 );
var groups = [
"<span><label for='t7092a'></label><input type='checkbox' id='t7092a'></span>",
"<span><input type='checkbox' id='t7092b'><label for='t7092b'></label></span>",
@ -88,8 +90,8 @@ test( "Checkbox creation requires a label, and finds it in all cases", function(
} );
} );
test( "Calling checkboxradio on an unsupported element throws an error", function( assert ) {
expect( 2 );
QUnit.test( "Calling checkboxradio on an unsupported element throws an error", function( assert ) {
assert.expect( 2 );
var errorMessage =
"Can't create checkboxradio on element.nodeName=div and element.type=undefined";
@ -117,8 +119,8 @@ test( "Calling checkboxradio on an unsupported element throws an error", functio
);
} );
test( "Calling checkboxradio on an input with no label throws an error", function( assert ) {
expect( 1 );
QUnit.test( "Calling checkboxradio on an input with no label throws an error", function( assert ) {
assert.expect( 1 );
var errorMessage = "No label found for checkboxradio widget";
var error = new Error( errorMessage );

View File

@ -1,14 +1,16 @@
define( [
"qunit",
"jquery",
"ui/widgets/checkboxradio"
], function( $ ) {
], function( QUnit, $ ) {
module( "Checkboxradio: events" );
QUnit.module( "Checkboxradio: events" );
asyncTest(
QUnit.test(
"Resetting a checkbox's form should refresh the visual state of the checkbox",
function( assert ) {
expect( 2 );
var ready = assert.async();
assert.expect( 2 );
var form = $( "<form>" +
"<label for='c1'></label><input id='c1' type='checkbox' checked>" +
"</form>" ),
@ -22,20 +24,21 @@ asyncTest(
setTimeout( function() {
assert.hasClasses( widget, "ui-state-active" );
start();
ready();
}, 1 );
}
);
asyncTest( "Checkbox shows focus when using keyboard navigation", function( assert ) {
expect( 2 );
QUnit.test( "Checkbox shows focus when using keyboard navigation", function( assert ) {
var ready = assert.async();
assert.expect( 2 );
var check = $( "#check" ).checkboxradio(),
label = $( "label[for='check']" );
assert.lacksClasses( label, "ui-state-focus" );
check.focus();
setTimeout( function() {
assert.hasClasses( label, "ui-state-focus" );
start();
ready();
} );
} );

View File

@ -1,29 +1,30 @@
define( [
"qunit",
"jquery",
"ui/widgets/checkboxradio"
], function( $ ) {
], function( QUnit, $ ) {
module( "Checkboxradio: methods" );
QUnit.module( "Checkboxradio: methods" );
$.each( [ "checkbox", "radio" ], function( index, value ) {
test( value + ": refresh", function( assert ) {
QUnit.test( value + ": refresh", function( assert ) {
var widget, icon,
checkbox = value === "checkbox",
input = $( "#" + value + "-method-refresh" );
expect( checkbox ? 11 : 8 );
assert.expect( checkbox ? 11 : 8 );
input.checkboxradio();
widget = input.checkboxradio( "widget" );
icon = widget.find( ".ui-icon" );
strictEqual( icon.length, 1,
assert.strictEqual( icon.length, 1,
"There is initally one icon" );
icon.remove();
input.checkboxradio( "refresh" );
icon = widget.find( ".ui-icon" );
strictEqual( icon.length, 1,
assert.strictEqual( icon.length, 1,
"Icon is recreated on refresh if absent" );
assert.hasClasses( icon, "ui-icon-blank" );
if ( checkbox ) {
@ -48,49 +49,49 @@ $.each( [ "checkbox", "radio" ], function( index, value ) {
assert.lacksClasses( widget, "ui-checkboxradio-checked" );
} );
test( value + ": destroy", function( assert ) {
expect( 1 );
QUnit.test( value + ": destroy", function( assert ) {
assert.expect( 1 );
assert.domEqual( "#" + value + "-method-destroy", function() {
$( "#" + value + "-method-destroy" ).checkboxradio().checkboxradio( "destroy" );
} );
} );
test( value + ": disable / enable", function( assert ) {
expect( 4 );
QUnit.test( value + ": disable / enable", function( assert ) {
assert.expect( 4 );
var input = $( "#" + value + "-method-disable" ),
widget = input.checkboxradio().checkboxradio( "widget" );
input.checkboxradio( "disable" );
assert.hasClasses( widget, "ui-state-disabled" );
strictEqual( input.is( ":disabled" ), true,
assert.strictEqual( input.is( ":disabled" ), true,
value + " is disabled when disable is called" );
input.checkboxradio( "enable" );
assert.lacksClasses( widget, "ui-state-disabled" );
strictEqual( input.is( ":disabled" ), false,
assert.strictEqual( input.is( ":disabled" ), false,
value + " has disabled prop removed when enable is called" );
} );
test( value + ": widget returns the label", function() {
expect( 1 );
QUnit.test( value + ": widget returns the label", function( assert ) {
assert.expect( 1 );
var input = $( "#" + value + "-method-refresh" ),
label = $( "#" + value + "-method-refresh-label" );
input.checkboxradio();
strictEqual( input.checkboxradio( "widget" )[ 0 ], label[ 0 ],
assert.strictEqual( input.checkboxradio( "widget" )[ 0 ], label[ 0 ],
"widget method returns label" );
} );
} );
test( "Input wrapped in a label preserved on refresh", function() {
QUnit.test( "Input wrapped in a label preserved on refresh", function( assert ) {
var input = $( "#label-with-no-for" ).checkboxradio(),
element = input.checkboxradio( "widget" );
expect( 1 );
assert.expect( 1 );
input.checkboxradio( "refresh" );
strictEqual( input.parent()[ 0 ], element[ 0 ], "Input preserved" );
assert.strictEqual( input.parent()[ 0 ], element[ 0 ], "Input preserved" );
} );
} );

View File

@ -1,25 +1,26 @@
define( [
"qunit",
"jquery",
"ui/widgets/checkboxradio"
], function( $ ) {
], function( QUnit, $ ) {
module( "Checkboxradio: options" );
QUnit.module( "Checkboxradio: options" );
function assertDisabled( checkbox, assert ) {
assert.hasClasses( checkbox.checkboxradio( "widget" ), "ui-state-disabled",
"label gets ui-state-disabled" );
strictEqual( checkbox.is( ":disabled" ), true, "checkbox is disabled" );
assert.strictEqual( checkbox.is( ":disabled" ), true, "checkbox is disabled" );
}
function assertEnabled( checkbox, assert ) {
assert.lacksClasses( checkbox.checkboxradio( "widget" ), "ui-state-disabled",
"label has ui-state-disabled removed when disabled set to false" );
strictEqual( checkbox.is( ":disabled" ), false,
assert.strictEqual( checkbox.is( ":disabled" ), false,
"checkbox has disabled prop removed when disabled set to false" );
}
test( "disabled", function( assert ) {
expect( 6 );
QUnit.test( "disabled", function( assert ) {
assert.expect( 6 );
var checkbox = $( "#checkbox-option-disabled" );
checkbox.checkboxradio( {
@ -35,8 +36,8 @@ test( "disabled", function( assert ) {
assertDisabled( checkbox, assert );
} );
test( "disabled - prop true on init", function( assert ) {
expect( 2 );
QUnit.test( "disabled - prop true on init", function( assert ) {
assert.expect( 2 );
var checkbox = $( "#checkbox-option-disabled" );
checkbox.prop( "disabled", true );
@ -45,8 +46,8 @@ test( "disabled - prop true on init", function( assert ) {
assertDisabled( checkbox, assert );
} );
test( "disabled - explicit null value, checks the DOM", function( assert ) {
expect( 2 );
QUnit.test( "disabled - explicit null value, checks the DOM", function( assert ) {
assert.expect( 2 );
var checkbox = $( "#checkbox-option-disabled" );
checkbox.prop( "disabled", true );
@ -56,8 +57,8 @@ test( "disabled - explicit null value, checks the DOM", function( assert ) {
assertDisabled( checkbox, assert );
} );
function assertNoIcon( checkbox ) {
strictEqual( checkbox.checkboxradio( "widget" ).find( "span.ui-icon" ).length, 0,
function assertNoIcon( assert, checkbox ) {
assert.strictEqual( checkbox.checkboxradio( "widget" ).find( "span.ui-icon" ).length, 0,
"Label does not contain an icon" );
}
@ -65,7 +66,7 @@ function assertIcon( checkbox, icon, assert ) {
var iconElement = checkbox.checkboxradio( "widget" ).find( ".ui-icon" );
icon = icon || "blank";
strictEqual( iconElement.length, 1,
assert.strictEqual( iconElement.length, 1,
"Label contains icon" );
assert.hasClasses( iconElement, "ui-checkboxradio-icon ui-corner-all ui-icon " +
"ui-icon-background ui-icon-" + icon,
@ -75,37 +76,37 @@ function assertIcon( checkbox, icon, assert ) {
}
}
test( "icon - false on init", function() {
QUnit.test( "icon - false on init", function( assert ) {
var checkbox = $( "#checkbox-option-icon" );
expect( 1 );
assert.expect( 1 );
checkbox.checkboxradio( { icon: false } );
assertNoIcon( checkbox );
assertNoIcon( assert, checkbox );
} );
test( "icon - default unchecked", function( assert ) {
QUnit.test( "icon - default unchecked", function( assert ) {
var checkbox = $( "#checkbox-option-icon" );
expect( 3 );
assert.expect( 3 );
checkbox.checkboxradio();
assertIcon( checkbox, false, assert );
} );
test( "icon - default checked", function( assert ) {
QUnit.test( "icon - default checked", function( assert ) {
var checkbox = $( "#checkbox-option-icon" ).attr( "checked", true );
expect( 2 );
assert.expect( 2 );
checkbox.checkboxradio();
assertIcon( checkbox, "check ui-state-highlight", assert );
} );
test( "icon", function( assert ) {
QUnit.test( "icon", function( assert ) {
var checkbox = $( "#checkbox-option-icon" );
expect( 9 );
assert.expect( 9 );
checkbox.prop( "checked", true );
@ -113,35 +114,35 @@ test( "icon", function( assert ) {
assertIcon( checkbox, "check ui-state-highlight", assert );
checkbox.checkboxradio( "option", "icon", false );
assertNoIcon( checkbox );
assertNoIcon( assert, checkbox );
checkbox.checkboxradio( "option", "icon", true );
assertIcon( checkbox, "check ui-state-highlight", assert );
checkbox.checkboxradio( "option", "icon", false );
assertNoIcon( checkbox );
assertNoIcon( assert, checkbox );
checkbox.checkboxradio( "option", "icon", true );
checkbox.prop( "checked", false ).checkboxradio( "refresh" );
assertIcon( checkbox, false, assert );
} );
test( "label - default", function() {
QUnit.test( "label - default", function( assert ) {
var checkbox = $( "#checkbox-option-label" ),
widget;
expect( 2 );
assert.expect( 2 );
checkbox.checkboxradio();
widget = checkbox.checkboxradio( "widget" );
strictEqual( checkbox.checkboxradio( "option", "label" ),
assert.strictEqual( checkbox.checkboxradio( "option", "label" ),
"checkbox label", "When no value passed on create text from dom is used for option" );
strictEqual( $.trim( widget.text() ),
assert.strictEqual( $.trim( widget.text() ),
"checkbox label", "When no value passed on create text from dom is used in dom" );
} );
test( "label - explicit value", function() {
expect( 5 );
QUnit.test( "label - explicit value", function( assert ) {
assert.expect( 5 );
var checkbox = $( "#checkbox-option-label" ).checkboxradio( {
label: "foo"
} ),
@ -149,23 +150,23 @@ test( "label - explicit value", function() {
icon = widget.find( ".ui-icon" ),
iconSpace = widget.find( ".ui-checkboxradio-icon-space" );
strictEqual( checkbox.checkboxradio( "option", "label" ),
assert.strictEqual( checkbox.checkboxradio( "option", "label" ),
"foo", "When value is passed on create value is used for option" );
strictEqual( $.trim( widget.text() ),
assert.strictEqual( $.trim( widget.text() ),
"foo", "When value is passed on create value is used in dom" );
strictEqual( icon.length, 1,
assert.strictEqual( icon.length, 1,
"Icon is preserved when label is set on init when wrapped in label" );
strictEqual( iconSpace.length, 1,
assert.strictEqual( iconSpace.length, 1,
"Icon space is preserved when label is set on init when wrapped in label" );
strictEqual( $( "#checkbox-option-label" ).length, 1,
assert.strictEqual( $( "#checkbox-option-label" ).length, 1,
"Element is preserved when label is set on init when wrapped in label" );
} );
test( "label - explicit null value", function() {
QUnit.test( "label - explicit null value", function( assert ) {
var checkbox = $( "#checkbox-option-label" ),
widget;
expect( 2 );
assert.expect( 2 );
// The default null is a special value which means to check the DOM.
// We need to make sure that the option never return null.
@ -174,15 +175,15 @@ test( "label - explicit null value", function() {
label: null
} );
widget = checkbox.checkboxradio( "widget" );
strictEqual( checkbox.checkboxradio( "option", "label" ),
assert.strictEqual( checkbox.checkboxradio( "option", "label" ),
"checkbox label", "When null is passed on create text from dom is used for option" );
strictEqual( $.trim( widget.text() ),
assert.strictEqual( $.trim( widget.text() ),
"checkbox label", "When null is passed on create text from dom is used in dom" );
} );
test( "label", function() {
expect( 4 );
QUnit.test( "label", function( assert ) {
assert.expect( 4 );
var checkbox = $( "#checkbox-option-label" ),
widget;
@ -190,15 +191,15 @@ test( "label", function() {
checkbox.checkboxradio();
widget = checkbox.checkboxradio( "widget" );
checkbox.checkboxradio( "option", "label", "bar" );
strictEqual( checkbox.checkboxradio( "option", "label" ),
assert.strictEqual( checkbox.checkboxradio( "option", "label" ),
"bar", "When value is passed value is used for option" );
strictEqual( $.trim( widget.text() ),
assert.strictEqual( $.trim( widget.text() ),
"bar", "When value is passed value is used in dom" );
checkbox.checkboxradio( "option", "label", null );
strictEqual( checkbox.checkboxradio( "option", "label" ),
assert.strictEqual( checkbox.checkboxradio( "option", "label" ),
"bar", "When null is passed text from dom is used for option" );
strictEqual( $.trim( widget.text() ),
assert.strictEqual( $.trim( widget.text() ),
"bar", "When null is passed text from dom is used in dom" );
} );