aboutsummaryrefslogtreecommitdiffstats
path: root/tests/unit/selectmenu
diff options
context:
space:
mode:
Diffstat (limited to 'tests/unit/selectmenu')
-rw-r--r--tests/unit/selectmenu/all.html30
-rw-r--r--tests/unit/selectmenu/selectmenu.html87
-rw-r--r--tests/unit/selectmenu/selectmenu_common.js19
-rw-r--r--tests/unit/selectmenu/selectmenu_core.js88
-rw-r--r--tests/unit/selectmenu/selectmenu_events.js107
-rw-r--r--tests/unit/selectmenu/selectmenu_methods.js144
-rw-r--r--tests/unit/selectmenu/selectmenu_options.js41
7 files changed, 516 insertions, 0 deletions
diff --git a/tests/unit/selectmenu/all.html b/tests/unit/selectmenu/all.html
new file mode 100644
index 000000000..98ff533c7
--- /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.8.3.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..d05b4f2be
--- /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>
+
+ <script src="../../jquery.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>
+ TestHelpers.loadResources({
+ css: [ "ui.core", "ui.menu" , "ui.selectmenu" ],
+ js: [
+ "ui/jquery.ui.core.js",
+ "ui/jquery.ui.widget.js",
+ "ui/jquery.ui.menu.js",
+ "ui/jquery.ui.selectmenu.js"
+ ]
+ });
+ </script>
+
+ <script src="selectmenu_common.js"></script>
+ <script src="selectmenu_core.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_common.js b/tests/unit/selectmenu/selectmenu_common.js
new file mode 100644
index 000000000..6ce79ff15
--- /dev/null
+++ b/tests/unit/selectmenu/selectmenu_common.js
@@ -0,0 +1,19 @@
+TestHelpers.commonWidgetTests( "selectmenu", {
+ defaults: {
+ appendTo: "body",
+ disabled: false,
+ dropdown: true,
+ position: {
+ my: "left top",
+ at: "left bottom",
+ collision: "none"
+ },
+ // callbacks,
+ create: null,
+ open: null,
+ focus: null,
+ select: null,
+ close: null,
+ change: null
+ }
+});
diff --git a/tests/unit/selectmenu/selectmenu_core.js b/tests/unit/selectmenu/selectmenu_core.js
new file mode 100644
index 000000000..54e06cf40
--- /dev/null
+++ b/tests/unit/selectmenu/selectmenu_core.js
@@ -0,0 +1,88 @@
+(function( $ ) {
+
+module( "selectmenu: core" );
+
+test("accessibility", function () {
+ var links,
+ element = $('#speed').selectmenu(),
+ button = element.selectmenu("widget"),
+ menu = element.selectmenu("menuWidget");
+
+ button.simulate( "focus" );
+ links = menu.find("li.ui-menu-item a");
+
+ expect(13 + links.length * 2);
+
+ equal( button.attr("role"), "combobox", "button link role" );
+ equal( button.attr("aria-haspopup"), "true", "button link aria-haspopup" );
+ equal( button.attr("aria-expanded"), "false", "button link aria-expanded" );
+ equal( button.attr("aria-autocomplete"), "list", "button link aria-autocomplete" );
+ equal( button.attr("aria-owns"), menu.attr("id"), "button link aria-owns" );
+ equal( button.attr("aria-labelledby"), links.eq( element[0].selectedIndex ).attr( "id" ), "button link aria-labelledby" );
+ equal( button.attr("tabindex"), 0, "button link tabindex" );
+
+ equal( menu.attr("role"), "listbox", "menu role" );
+ equal( menu.attr("aria-labelledby"), button.attr("id"), "menu aria-labelledby" );
+ equal( menu.attr("aria-hidden"), "true", "menu aria-hidden" );
+ equal( menu.attr("tabindex"), 0, "menu tabindex" );
+ equal( menu.attr("aria-activedescendant"), links.eq(element[0].selectedIndex).attr("id"), "menu aria-activedescendant" );
+ $.each( links, function(index){
+ equal( $(this).attr("role"), "option", "menu link #" + index +" role" );
+ equal( $(this).attr("tabindex"), -1, "menu link #" + index +" tabindex" );
+ });
+ equal( links.eq(element[0].selectedIndex).attr("aria-selected"), "true", "selected menu link aria-selected" );
+});
+
+
+$.each([
+ {
+ type: "default",
+ selector: "#speed"
+ },
+ {
+ type: "optgroups",
+ selector: "#files"
+ }
+], function( i, settings ) {
+ test("state synchronization - after keydown - " + settings.type, function () {
+ expect(5);
+
+ var links,
+ element = $(settings.selector).selectmenu(),
+ button = element.selectmenu("widget"),
+ menu = element.selectmenu("menuWidget"),
+ selected = element.find("option:selected");
+
+ button.simulate( "focus" );
+ links = menu.find("li.ui-menu-item a");
+
+ button.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
+ equal( menu.attr("aria-activedescendant"), links.eq(element[0].selectedIndex).attr("id"), "menu aria-activedescendant" );
+ equal( links.eq(element[0].selectedIndex).attr("aria-selected"), "true", "selected menu link aria-selected" );
+ equal( button.attr("aria-activedescendant"), links.eq(element[0].selectedIndex).attr("id"), "button aria-activedescendant" );
+ equal( element.find("option:selected").val(), selected.next("option").val() , "original select state" );
+ equal( button.text(), selected.next("option").text(), "button text" );
+ });
+
+ test("state synchronization - after click - " + settings.type, function () {
+ expect(5);
+
+ var links,
+ element = $(settings.selector).selectmenu(),
+ button = element.selectmenu("widget"),
+ menu = element.selectmenu("menuWidget");
+
+ button.simulate( "focus" );
+ links = menu.find("li.ui-menu-item a");
+
+ button.simulate( "click" );
+ menu.find("a").last().simulate( "mouseover" ).trigger( "click" );
+ equal( menu.attr("aria-activedescendant"), links.eq(element[0].selectedIndex).attr("id"), "menu aria-activedescendant" );
+ equal( links.eq(element[0].selectedIndex).attr("aria-selected"), "true", "selected menu link aria-selected" );
+ equal( button.attr("aria-activedescendant"), links.eq(element[0].selectedIndex).attr("id"), "button aria-activedescendant" );
+ equal( element.find("option:selected").val(), element.find("option").last().val(), "original select state" );
+ equal( button.text(), element.find("option").last().text(), "button text" );
+ });
+});
+
+})( jQuery );
diff --git a/tests/unit/selectmenu/selectmenu_events.js b/tests/unit/selectmenu/selectmenu_events.js
new file mode 100644
index 000000000..eb15fea0a
--- /dev/null
+++ b/tests/unit/selectmenu/selectmenu_events.js
@@ -0,0 +1,107 @@
+(function ($) {
+
+module("selectmenu: events", {
+ setup: function () {
+ this.element = $("#speed");
+ }
+});
+
+test("change", function () {
+ expect(5);
+
+ this.element.selectmenu({
+ change: function (event, ui) {
+ ok(event, "change event fired on change");
+ equal(event.type, "selectmenuchange", "event type set to selectmenuchange");
+ ok(ui, "ui object is passed as second argument to event handler");
+ equal(ui.item.element[0].nodeName, "OPTION", "ui.item.element[0] points to original option element");
+ equal(ui.item.value, value, "ui.item.value property updated correctly");
+ }
+ });
+
+ var button = this.element.selectmenu("widget").parent(),
+ menu = this.element.selectmenu("menuWidget").parent(),
+ value = this.element.find("option").first().text();
+
+ button.find("a").simulate( "focus" ).simulate( "click" );
+ menu.find("a").first().simulate( "mouseover" ).trigger( "click" );
+});
+
+
+test("close", function () {
+ expect(3);
+
+ this.element.selectmenu({
+ close: function (event, ui) {
+ ok(event, "close event fired on close");
+ equal(event.type, "selectmenuclose", "event type set to selectmenuclose");
+ ok(ui, "ui object is passed as second argument to event handler");
+ }
+ });
+
+ this.element.selectmenu("open").selectmenu("close");
+});
+
+
+test("focus", function () {
+ expect(4);
+
+ var counter = 0,
+ button,
+ menu;
+
+ this.element.selectmenu({
+ focus: function (event, ui) {
+ counter++;
+ if (counter === 1) {
+ ok(event, "focus event fired on mouseover");
+ equal(event.type, "selectmenufocus", "event type set to selectmenufocus");
+ ok(ui, "ui object is passed as second argument to event handler");
+ equal(ui.item.element[0].nodeName, "OPTION", "ui points to original option element");
+ }
+ }
+ });
+
+ button = this.element.selectmenu("widget").parent();
+ menu = this.element.selectmenu("menuWidget").parent();
+
+ button.find("a").simulate( "focus" ).simulate( "click" );
+ menu.find(".ui-menu-item").simulate("mouseover");
+});
+
+
+test("open", function () {
+ expect(3);
+
+ this.element.selectmenu({
+ open: function (event, ui) {
+ ok(event, "open event fired on open");
+ equal(event.type, "selectmenuopen", "event type set to selectmenuopen");
+ ok(ui, "ui object is passed as second argument to event handler");
+ }
+ });
+
+ this.element.selectmenu("open");
+});
+
+
+test("select", function () {
+ expect(4);
+
+ this.element.selectmenu({
+ select: function (event, ui) {
+ ok(event, "select event fired on item select");
+ equal(event.type, "selectmenuselect", "event type set to selectmenuselect");
+ ok(ui, "ui object is passed as second argument to event handler");
+ equal(ui.item.element[0].nodeName, "OPTION", "ui points to original option element");
+ }
+ });
+
+ var button = this.element.selectmenu("widget").parent(),
+ menu = this.element.selectmenu("menuWidget").parent();
+
+ button.find("a").simulate( "focus" ).simulate( "click" );
+ menu.find("a").first().simulate( "mouseover" ).trigger("click");
+});
+
+})(jQuery);
diff --git a/tests/unit/selectmenu/selectmenu_methods.js b/tests/unit/selectmenu/selectmenu_methods.js
new file mode 100644
index 000000000..68ff6110c
--- /dev/null
+++ b/tests/unit/selectmenu/selectmenu_methods.js
@@ -0,0 +1,144 @@
+(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(),
+ menu = element.selectmenu("menuWidget");
+
+ element.selectmenu("open");
+ ok( menu.is( ":visible" ), "open: menu visible" );
+ equal( menu.attr("aria-hidden"), "false", "open: menu aria-disabled" );
+
+ element.selectmenu("close");
+ ok( menu.is( ":hidden" ), "close: menu hidden" );
+ equal( menu.attr("aria-hidden"), "true", "close: menu aria-disabled" );
+});
+
+
+test("enable / disable", function () {
+ expect(10);
+
+ var element = $('#speed').selectmenu(),
+ button = element.selectmenu("widget"),
+ menu = element.selectmenu("menuWidget");
+
+ element.selectmenu("disable");
+ ok( element.selectmenu("option", "disabled"), "disable: widget option" );
+ equal( element.attr("disabled"), "disabled", "disable: native select disabled" );
+ equal( button.attr("aria-disabled"), "true", "disable: button wrapper ARIA" );
+ equal( button.attr("tabindex"), -1, "disable: button tabindex" );
+ equal( menu.attr("aria-disabled"), "true", "disable: menu wrapper ARIA" );
+
+ element.selectmenu("enable");
+ ok( !element.selectmenu("option", "disabled"), "enable: widget option" );
+ equal( element.attr("disabled"), undefined, "enable: native select disabled" );
+ equal( button.attr("aria-disabled"), "false", "enable: button wrapper ARIA" );
+ equal( button.attr("tabindex"), 0, "enable: button tabindex" );
+ equal( menu.attr("aria-disabled"), "false", "enable: menu wrapper ARIA" );
+});
+
+
+test("refresh - structure", function () {
+ expect(3);
+
+ var element = $('#speed').selectmenu(),
+ menu = element.selectmenu("menuWidget").parent();
+
+ 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");
+
+ equal( element.find("option").length, menu.find("li").not(".ui-selectmenu-optgroup").length, "menu item length" );
+ equal( element.find("option").last().text(), menu.find("li").not(".ui-selectmenu-optgroup").last().text(), "added item" );
+ equal( element.find("option").first().text(), menu.find("li").not(".ui-selectmenu-optgroup").first().text(), "changed item" );
+});
+
+
+test("refresh - disabled select", function () {
+ expect(4);
+
+ var element = $('#speed').selectmenu(),
+ button = element.selectmenu("widget"),
+ menu = element.selectmenu("menuWidget");
+
+ element.attr("disabled", "disabled");
+ element.selectmenu("refresh");
+
+ ok( element.selectmenu("option", "disabled"), "widget option" );
+ equal( button.attr("aria-disabled"), "true", "button wrapper ARIA" );
+ equal( button.attr("tabindex"), -1, "button tabindex" );
+ equal( menu.attr("aria-disabled"), "true", "menu wrapper ARIA" );
+});
+
+
+test("refresh - disabled option", function () {
+ expect(1);
+
+ var disabledItem,
+ element = $('#speed').selectmenu(),
+ menu = element.selectmenu("menuWidget").parent();
+
+ element.attr("disabled", "disabled");
+ element.find("option").eq(2).attr("disabled", "disabled");
+ element.selectmenu("refresh");
+
+ disabledItem = menu.find("li").not(".ui-selectmenu-optgroup").eq(2);
+ ok( disabledItem.hasClass("ui-state-disabled"), "class" );
+});
+
+
+test("refresh - disabled optgroup", function () {
+
+ var i,
+ item,
+ element = $('#files').selectmenu(),
+ menu = element.selectmenu("menuWidget").parent(),
+ originalDisabledOptgroup = element.find("optgroup").first(),
+ originalDisabledOptions = originalDisabledOptgroup.find("option");
+
+ expect(2 + originalDisabledOptions.length);
+
+ originalDisabledOptgroup.attr("disabled", "disabled");
+ element.selectmenu("refresh");
+
+ item = menu.find("li.ui-selectmenu-optgroup").first();
+ ok( item.hasClass("ui-state-disabled"), "class" );
+
+ equal( menu.find("li").not(".ui-selectmenu-optgroup").filter(".ui-state-disabled").length, originalDisabledOptions.length, "disabled options" );
+ for ( i = 0; i < originalDisabledOptions.length; i++ ) {
+ item = item.next("li");
+ ok( item.hasClass("ui-state-disabled"), "item #" + i + ": class" );
+ }
+});
+
+test( "widget", function() {
+ expect( 4 );
+ var element = $('#speed').selectmenu(),
+ widgetElement = element.selectmenu( "widget" ),
+ menuWidgetElement = element.selectmenu( "menuWidget" );
+
+ element.selectmenu("refresh");
+
+ equal( widgetElement.length, 1, "widget: one element" );
+ ok( widgetElement.is("a.ui-button"), "widget: button element" );
+
+ equal( menuWidgetElement.length, 1, "menuWidget: one element" );
+ ok( menuWidgetElement.is("ul.ui-menu"), "menuWidget: menu element" );
+});
+
+})( jQuery );
diff --git a/tests/unit/selectmenu/selectmenu_options.js b/tests/unit/selectmenu/selectmenu_options.js
new file mode 100644
index 000000000..440df04be
--- /dev/null
+++ b/tests/unit/selectmenu/selectmenu_options.js
@@ -0,0 +1,41 @@
+(function ($) {
+
+module("selectmenu: options");
+
+test("appendTo another element", function () {
+ expect(2);
+
+ var element = $("#speed").selectmenu();
+
+ ok(element.selectmenu("option", "appendTo", "#qunit-fixture"), "appendTo accepts selector");
+ ok($("#qunit-fixture").find(".ui-selectmenu-menu").length, "selectmenu appendedTo other element");
+});
+
+
+test("dropdown: CSS styles", function () {
+ expect(2);
+
+ var element = $("#speed").selectmenu(),
+ button = element.selectmenu("widget"),
+ menu = element.selectmenu("menuWidget");
+
+ element.selectmenu("open");
+ ok( button.hasClass("ui-corner-top") && !button.hasClass("ui-corner-all") && button.find("span.ui-icon").hasClass("ui-icon-triangle-1-s"), "button styles dropdown");
+ ok( menu.hasClass("ui-corner-bottom") && !menu.hasClass("ui-corner-all"), "menu styles dropdown");
+});
+
+test("pop-up: CSS styles", function () {
+ expect(2);
+
+ var element = $("#speed").selectmenu({
+ dropdown: false
+ }),
+ button = element.selectmenu("widget"),
+ menu = element.selectmenu("menuWidget");
+
+ element.selectmenu("close");
+ ok( !button.hasClass("ui-corner-top") && button.hasClass("ui-corner-all") && button.find("span.ui-icon").hasClass("ui-icon-triangle-2-n-s"), "button styles pop-up");
+ ok( !menu.hasClass("ui-corner-bottom") && menu.hasClass("ui-corner-all"), "menu styles pop-up");
+});
+
+})(jQuery);
generated by cgit v1.2.3 (git 2.39.1) at 2024-12-26 00:36:29 +0000