diff options
Diffstat (limited to 'tests/unit/selectmenu')
| -rw-r--r-- | tests/unit/selectmenu/all.html | 30 | ||||
| -rw-r--r-- | tests/unit/selectmenu/selectmenu.html | 87 | ||||
| -rw-r--r-- | tests/unit/selectmenu/selectmenu_core.js | 59 | ||||
| -rw-r--r-- | tests/unit/selectmenu/selectmenu_defaults.js | 20 | ||||
| -rw-r--r-- | tests/unit/selectmenu/selectmenu_events.js | 7 | ||||
| -rw-r--r-- | tests/unit/selectmenu/selectmenu_methods.js | 136 | ||||
| -rw-r--r-- | tests/unit/selectmenu/selectmenu_options.js | 7 |
7 files changed, 346 insertions, 0 deletions
diff --git a/tests/unit/selectmenu/all.html b/tests/unit/selectmenu/all.html new file mode 100644 index 000000000..9bb6835d0 --- /dev/null +++ b/tests/unit/selectmenu/all.html @@ -0,0 +1,30 @@ +<!doctype html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Selectmenu Test Suite</title> + + <script src="../../../jquery-1.6.2.js"></script> + + <link rel="stylesheet" href="../../../external/qunit.css"> + <link rel="stylesheet" href="../subsuiteRunner.css"> + <script src="../../../external/qunit.js"></script> + <script src="../subsuiteRunner.js"></script> + <script src="../subsuite.js"></script> + + <script> + testAllVersions( "selectmenu" ); + </script> +</head> +<body> + +<h1 id="qunit-header">jQuery UI Selectmenu Test Suite</h1> +<h2 id="qunit-banner"></h2> +<div id="qunit-testrunner-toolbar"></div> +<h2 id="qunit-userAgent"></h2> +<ol id="qunit-tests"></ol> +<div id="qunit-fixture"> + +</div> +</body> +</html> diff --git a/tests/unit/selectmenu/selectmenu.html b/tests/unit/selectmenu/selectmenu.html new file mode 100644 index 000000000..c64b364fa --- /dev/null +++ b/tests/unit/selectmenu/selectmenu.html @@ -0,0 +1,87 @@ +<!doctype html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Selectmenu Test Suite</title> + + <link rel="stylesheet" href="../../../themes/base/jquery.ui.core.css"> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.button.css"> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.menu.css"> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.selectmenu.css"> + + <script src="../../jquery.js"></script> + <script src="../../../ui/jquery.ui.core.js"></script> + <script src="../../../ui/jquery.ui.widget.js"></script> + <script src="../../../ui/jquery.ui.button.js"></script> + <script src="../../../ui/jquery.ui.menu.js"></script> + <script src="../../../ui/jquery.ui.selectmenu.js"></script> + + <link rel="stylesheet" href="../../../external/qunit.css"> + <script src="../../../external/qunit.js"></script> + <script src="../../jquery.simulate.js"></script> + <script src="../testsuite.js"></script> + + <script src="selectmenu_core.js"></script> + <script src="selectmenu_defaults.js"></script> + <script src="selectmenu_events.js"></script> + <script src="selectmenu_methods.js"></script> + <script src="selectmenu_options.js"></script> + + <script src="../swarminject.js"></script> +</head> +<body> + +<h1 id="qunit-header">jQuery UI Selectmenu Test Suite</h1> +<h2 id="qunit-banner"></h2> +<div id="qunit-testrunner-toolbar"></div> +<h2 id="qunit-userAgent"></h2> +<ol id="qunit-tests"></ol> +<div id="qunit-fixture"> + + <label for="speed">Select a speed:</label> + <select name="speed" id="speed"> + <option value="Slower">Slower</option> + <option value="Slow">Slow</option> + <option value="Medium" selected="selected">Medium</option> + <option value="Fast">Fast</option> + <option value="Faster">Faster</option> + </select> + + <label for="number">Select a number:</label> + <select name="number" id="number"> + <option value="1">1</option> + <option value="2" selected="selected">2</option> + <option value="3">3</option> + <option value="4">4</option> + <option value="5">5</option> + <option value="6">6</option> + <option value="7">7</option> + <option value="8">8</option> + <option value="9">9</option> + <option value="10">10</option> + <option value="11">11</option> + <option value="12">12</option> + <option value="13">13</option> + <option value="14">14</option> + <option value="15">15</option> + <option value="16">16</option> + <option value="17">17</option> + <option value="18">18</option> + <option value="19">19</option> + </select> + + <label for="files">Select a file:</label> + <select name="files" id="files"> + <optgroup label="Scripts"> + <option value="jquery">jQuery.js</option> + <option value="jqueryui">ui.jQuery.js</option> + </optgroup> + <optgroup label="Other files"> + <option value="somefile">Some unknown file</option> + <option value="someotherfile">Some other file</option> + </optgroup> + </select> + +</div> +</body> +</html> diff --git a/tests/unit/selectmenu/selectmenu_core.js b/tests/unit/selectmenu/selectmenu_core.js new file mode 100644 index 000000000..e19fefeea --- /dev/null +++ b/tests/unit/selectmenu/selectmenu_core.js @@ -0,0 +1,59 @@ +(function( $ ) { + +module( "selectmenu: core" ); + +test("accessibility", function () { + var element = $('#speed').selectmenu(); + var widget = element.selectmenu("widget"); + var button = widget.filter(".ui-selectmenu-button"); + var menu = widget.filter(".ui-selectmenu-menu"); + var link = button.children("a"); + var ul = menu.children("ul") + var links = ul.find("li.ui-menu-item a"); + expect(6 + links.length); + + equals( button.attr("aria-disabled"), "false", "button aria-disabled" ); + equals( link.attr("aria-disabled"), "false", "button link aria-disabled" ); + equals( link.attr("aria-haspopup"), "true", "button link aria-haspopup" ); + equals( link.attr("role"), "button", "button link role" ); + equals( link.attr("aria-owns"), ul.attr("id"), "button link aria-owns" ); + equals( link.attr("tabindex"), 0, "button link tabindex" ); + + $.each( links, function(index){ + equals( $(this).attr("role"), "option", "menu link #" + index +" role" ); + }); +}); + + +$.each([ + { + type: "default", + selector: "#speed" + }, + { + type: "optgroups", + selector: "#files" + } +], function( i, settings ) { + test("state synchronization - " + settings.type, function () { + expect(6); + var element = $(settings.selector).selectmenu(); + var widget = element.selectmenu("widget"); + var button = widget.filter(".ui-selectmenu-button"); + var menu = widget.filter(".ui-selectmenu-menu"); + + equals( element[0].value, element.selectmenu("option", "value"), "inital value" ); + equals( element.find("option:selected").text(), button.text(), "inital button text" ); + + button.find("a").simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + equals( element[0].value, element.selectmenu("option", "value"), "after keydown value" ); + equals( element.find("option:selected").text(), button.text(), "after keydown button text" ); + + button.find("a").simulate( "click" ); + menu.find("a").last().simulate( "click" ); + equals( element[0].value, element.selectmenu("option", "value"), "after click value" ); + equals( element.find("option:selected").text(), button.text(), "after click button text" ); + }); +}); + +})( jQuery ); diff --git a/tests/unit/selectmenu/selectmenu_defaults.js b/tests/unit/selectmenu/selectmenu_defaults.js new file mode 100644 index 000000000..a0f4f985e --- /dev/null +++ b/tests/unit/selectmenu/selectmenu_defaults.js @@ -0,0 +1,20 @@ +commonWidgetTests( "selectmenu", { + defaults: { + appendTo: "body", + disabled: false, + dropdown: true, + position: { + my: "left top", + at: "left bottom", + collision: "none" + }, + value: null, + // callbacks, + create: null, + open: null, + focus: null, + select: null, + close: null, + change: null + } +}); diff --git a/tests/unit/selectmenu/selectmenu_events.js b/tests/unit/selectmenu/selectmenu_events.js new file mode 100644 index 000000000..888ab9e9b --- /dev/null +++ b/tests/unit/selectmenu/selectmenu_events.js @@ -0,0 +1,7 @@ +(function( $ ) { + +module( "selectmenu: events" ); + + + +})( jQuery ); diff --git a/tests/unit/selectmenu/selectmenu_methods.js b/tests/unit/selectmenu/selectmenu_methods.js new file mode 100644 index 000000000..263d27be2 --- /dev/null +++ b/tests/unit/selectmenu/selectmenu_methods.js @@ -0,0 +1,136 @@ +(function( $ ) { + +module( "selectmenu: methods" ); + +test( "destroy", function() { + expect( 1 ); + domEqual( "#speed", function() { + $( "#speed" ).selectmenu().selectmenu( "destroy" ); + }); +}); + + +test( "open / close", function() { + expect( 4 ); + + var element = $("#speed").selectmenu(); + var widget = element.selectmenu("widget"); + var button = widget.filter(".ui-selectmenu-button"); + var menu = widget.filter(".ui-selectmenu-menu"); + + element.selectmenu("open"); + ok( menu.is( ":visible" ), "menu visible" ); + equals( menu.find("ul").attr("aria-hidden"), "false", "menu aria-disabled" ); + + element.selectmenu("close"); + ok( menu.is( ":hidden" ), "menu hidden" ); + equals( menu.find("ul").attr("aria-hidden"), "true", "menu aria-disabled" ); +}); + + +test("enable / disable", function () { + expect(12); + var element = $("#speed").selectmenu(); + var widget = element.selectmenu("widget"); + var button = widget.filter(".ui-selectmenu-button"); + var menu = widget.filter(".ui-selectmenu-menu"); + + element.selectmenu("disable") + ok( element.selectmenu("option", "disabled"), "disable: widget option" ); + equals( button.attr("aria-disabled"), "true", "disable: button wrapper ARIA" ); + equals( button.children("a").attr("aria-disabled"), "true", "disable: button ARIA" ); + equals( button.children("a").attr("tabindex"), -1, "disable: button tabindex" ); + equals( menu.attr("aria-disabled"), "true", "disable: menu wrapper ARIA" ); + equals( menu.children("ul").attr("aria-disabled"), "true", "disable: menu ARIA" ); + + element.selectmenu("enable") + ok( !element.selectmenu("option", "disabled"), "enable: widget option" ); + equals( button.attr("aria-disabled"), "false", "enable: button wrapper ARIA" ); + equals( button.children("a").attr("aria-disabled"), "false", "enable: button ARIA" ); + equals( button.children("a").attr("tabindex"), 0, "enable: button tabindex" ); + equals( menu.attr("aria-disabled"), "false", "enable: menu wrapper ARIA" ); + equals( menu.children("ul").attr("aria-disabled"), "false", "enable: menu ARIA" ); +}); + + +test("refresh - structure", function () { + expect(3); + var element = $("#number").selectmenu(); + var widget = element.selectmenu("widget"); + var button = widget.filter(".ui-selectmenu-button"); + var menu = widget.filter(".ui-selectmenu-menu"); + + element.find("option").eq(2).remove(); + element.find("option").eq(3).remove(); + element.append('<option value="added_option">Added option</option>'); + element.find("option").first() + .attr("value", "changed_value") + .text("Changed value"); + element.selectmenu("refresh"); + + equals( element.find("option").length, menu.find("li").not(".ui-selectmenu-optgroup").length, "menu item length" ); + equals( element.find("option").last().text(), menu.find("li").not(".ui-selectmenu-optgroup").last().text(), "added item" ); + equals( element.find("option").first().text(), menu.find("li").not(".ui-selectmenu-optgroup").first().text(), "chnaged item" ); +}); + + +test("refresh - disabled select", function () { + expect(6); + var element = $("#speed").selectmenu(); + var widget = element.selectmenu("widget"); + var button = widget.filter(".ui-selectmenu-button"); + var menu = widget.filter(".ui-selectmenu-menu"); + + element.attr("disabled", "disabled"); + element.selectmenu("refresh"); + + ok( element.selectmenu("option", "disabled"), "widget option" ); + equals( button.attr("aria-disabled"), "true", "button wrapper ARIA" ); + equals( button.children("a").attr("aria-disabled"), "true", "button ARIA" ); + equals( button.children("a").attr("tabindex"), -1, "button tabindex" ); + equals( menu.attr("aria-disabled"), "true", "menu wrapper ARIA" ); + equals( menu.children("ul").attr("aria-disabled"), "true", "mene ARIA" ); +}); + +test("refresh - disabled option", function () { + expect(2); + var element = $("#speed").selectmenu(); + var widget = element.selectmenu("widget"); + var button = widget.filter(".ui-selectmenu-button"); + var menu = widget.filter(".ui-selectmenu-menu"); + + element.attr("disabled", "disabled"); + element.find("option").eq(2).attr("disabled", "disabled"); + element.selectmenu("refresh"); + + var disabledItem = menu.find("li").not(".ui-selectmenu-optgroup").eq(2); + ok( disabledItem.hasClass("ui-state-disabled"), "class" ); + ok( disabledItem.children("a").length <= 0, "has no link" ); +}); + +test("refresh - disabled optgroup", function () { + var element = $("#files").selectmenu(); + var widget = element.selectmenu("widget"); + var button = widget.filter(".ui-selectmenu-button"); + var menu = widget.filter(".ui-selectmenu-menu"); + + var originalDisabledOptgroup = element.find("optgroup").first(); + var originalDisabledOptions = originalDisabledOptgroup.find("option"); + expect(2 + originalDisabledOptions.length * 2); + + originalDisabledOptgroup.attr("disabled", "disabled"); + element.selectmenu("refresh"); + + var item = menu.find("li.ui-selectmenu-optgroup").first(); + ok( item.hasClass("ui-state-disabled"), "class" ); + + equals( menu.find("li").not(".ui-selectmenu-optgroup").filter(".ui-state-disabled").length, originalDisabledOptions.length, "disabled options" ); + for ( var i = 0; i < originalDisabledOptions.length; i++ ) { + item = item.next("li"); + ok( item.hasClass("ui-state-disabled"), "item #" + i + ": class" ); + ok( item.children("a").length <= 0, "item #" + i + ": has no link" ); + } +}); + + +})( jQuery ); diff --git a/tests/unit/selectmenu/selectmenu_options.js b/tests/unit/selectmenu/selectmenu_options.js new file mode 100644 index 000000000..b19dac4d4 --- /dev/null +++ b/tests/unit/selectmenu/selectmenu_options.js @@ -0,0 +1,7 @@ +(function( $ ) { + +module( "selectmenu: options" ); + + + +})( jQuery ); |