diff options
Diffstat (limited to 'tests')
-rw-r--r-- | tests/unit/menu/menu.html | 38 | ||||
-rw-r--r-- | tests/unit/menu/menu_defaults.js | 1 | ||||
-rw-r--r-- | tests/unit/menu/menu_events.js | 57 | ||||
-rw-r--r-- | tests/unit/menu/menu_test_helpers.js | 4 | ||||
-rw-r--r-- | tests/visual/menu/menu.html | 102 |
5 files changed, 198 insertions, 4 deletions
diff --git a/tests/unit/menu/menu.html b/tests/unit/menu/menu.html index dc5b71a00..014123144 100644 --- a/tests/unit/menu/menu.html +++ b/tests/unit/menu/menu.html @@ -207,6 +207,44 @@ <li class="foo"><a class="foo" href="#">Amesville</a></li> </ul> +<div id="menu5"> + <blockquote><a href="#">Aberdeen</a></blockquote> + <blockquote><a href="#">Ada</a></blockquote> + <blockquote><a href="#">Adamsville</a></blockquote> + <blockquote><a href="#">Addyston</a></blockquote> + <blockquote> + <a href="#">Delphi</a> + <div> + <blockquote><a href="#">Ada</a></blockquote> + <blockquote><a href="#">Saarland</a></blockquote> + <blockquote><a href="#">Salzburg</a></blockquote> + </div> + </blockquote> + <blockquote><a href="#">Saarland</a></blockquote> + <blockquote> + <a href="#">Salzburg</a> + <div> + <blockquote> + <a href="#">Delphi</a> + <div> + <blockquote><a href="#">Ada</a></blockquote> + <blockquote><a href="#">Saarland</a></blockquote> + <blockquote><a href="#">Salzburg</a></blockquote> + </div> + </blockquote> + <blockquote> + <a href="#">Delphi</a> + <div> + <blockquote><a href="#">Ada</a></blockquote> + <blockquote><a href="#">Saarland</a></blockquote> + <blockquote><a href="#">Salzburg</a></blockquote> + </div> + </blockquote> + <blockquote><a href="#">Perch</a></blockquote> + </div> + </blockquote> +</div> + <div id="log"></div> </div> diff --git a/tests/unit/menu/menu_defaults.js b/tests/unit/menu/menu_defaults.js index dd182ca09..1756e4648 100644 --- a/tests/unit/menu/menu_defaults.js +++ b/tests/unit/menu/menu_defaults.js @@ -5,6 +5,7 @@ commonWidgetTests( "menu", { my: "left top", at: "right top" }, + items: "ul", // callbacks create: null diff --git a/tests/unit/menu/menu_events.js b/tests/unit/menu/menu_events.js index 563ed7c2d..6d1b02b87 100644 --- a/tests/unit/menu/menu_events.js +++ b/tests/unit/menu/menu_events.js @@ -21,6 +21,23 @@ test("handle click on menu", function() { equals( $("#log").html(), "1,3,2,afterclick,1,click,", "Click order not valid."); }); +test("handle click on custom item menu", function() { + expect(1); + var ac = $('#menu5').menu({ + select: function(event, ui) { + menu_log(); + }, + items: "div" + }); + menu_log("click",true); + menu_click($('#menu5'),"1"); + menu_log("afterclick"); + menu_click( ac,"2"); + menu_click($('#menu5'),"3"); + menu_click( ac,"1"); + equals( $("#log").html(), "1,3,2,afterclick,1,click,", "Click order not valid."); +}); + test( "handle blur: click", function() { expect( 4 ); var $menu = $( "#menu1" ).menu({ @@ -41,6 +58,27 @@ test( "handle blur: click", function() { $("#remove").remove(); }); +test( "handle blur on custom item menu: click", function() { + expect( 4 ); + var $menu = $( "#menu5" ).menu({ + focus: function( event, ui ) { + equal( event.originalEvent.type, "click", "focus triggered 'click'" ); + equal( event.type, "menufocus", "focus event.type is 'menufocus'" ); + + }, + blur: function( event, ui ) { + equal( event.originalEvent.type, "click", "blur triggered 'click'" ); + equal( event.type, "menublur", "blur event.type is 'menublur'" ); + }, + items: "div" + }); + + menu_click($('#menu5'),"1"); + $( "<a>", { id: "remove"} ).appendTo("body").trigger( "click" ); + + $("#remove").remove(); +}); + asyncTest( "handle submenu auto collapse: mouseleave", function() { expect( 4 ); var $menu = $( "#menu2" ).menu(); @@ -60,6 +98,25 @@ asyncTest( "handle submenu auto collapse: mouseleave", function() { }, 200); }); +asyncTest( "handle custom menu item submenu auto collapse: mouseleave", function() { + expect( 4 ); + var $menu = $( "#menu5" ).menu( { items: "div" } ); + + $menu.children( ":nth-child(7)" ).trigger( "mouseover" ); + setTimeout(function() { + equal( $menu.find( "div[aria-expanded='true']" ).length, 1, "first submenu expanded" ); + $menu.children( ":nth-child(7)" ).find( "div:first" ).children( ":first" ).trigger( "mouseover" ); + setTimeout(function() { + equal( $menu.find( "div[aria-expanded='true']" ).length, 2, "second submenu expanded" ); + $menu.find( "div[aria-expanded='true']:first" ).trigger( "mouseleave" ); + equal( $menu.find( "div[aria-expanded='true']" ).length, 1, "second submenu collapsed" ); + $menu.trigger( "mouseleave" ); + equal( $menu.find( "div[aria-expanded='true']" ).length, 0, "first submenu collapsed" ); + start(); + }, 400); + }, 200); +}); + test("handle keyboard navigation on menu without scroll and without submenus", function() { expect(12); var element = $('#menu1').menu({ diff --git a/tests/unit/menu/menu_test_helpers.js b/tests/unit/menu/menu_test_helpers.js index 717cfc45d..052c9226b 100644 --- a/tests/unit/menu/menu_test_helpers.js +++ b/tests/unit/menu/menu_test_helpers.js @@ -10,5 +10,5 @@ function menu_log( message, clear ) { function menu_click( menu, item ) { $( "#log" ).data( "lastItem", item ); - menu.find( "li:eq(" + item + ") a" ).trigger( "click" ); -} + menu.children( ":eq(" + item + ")" ).find( "a:first" ).trigger( "click" ); +}
\ No newline at end of file diff --git a/tests/visual/menu/menu.html b/tests/visual/menu/menu.html index 195488184..06e34cbdd 100644 --- a/tests/visual/menu/menu.html +++ b/tests/visual/menu/menu.html @@ -23,8 +23,22 @@ $("<div/>").text("Selected: " + ui.item.text()).appendTo("#log"); } }); - } + $("#menu5").menu({ + select: function(event, ui) { + $("<div/>").text("Selected: " + ui.item.text()).appendTo("#log"); + }, + items: "div" + }); + + $("#menu6").menu({ + select: function(event, ui) { + $("<div/>").text("Selected: " + ui.item.text()).appendTo("#log"); + }, + items: ".menuElement" + }); + } + var menus = $("#menu1, #menu2, #menu3, .menu4"); create(); @@ -42,6 +56,9 @@ body { font-size:62.5%; } .ui-menu { width: 200px; margin-bottom: 2em; } .menu4 { height: 200px; overflow: auto; } + .address-item { border-bottom: 1px solid #999; } + .address-header { display: block; margin-bottom: .2em; font-weight: bold; } + .address-content { display: block; margin-bottom: .2em; padding-left: 10px; } </style> </head> <body> @@ -173,6 +190,87 @@ <li><a href="#">Amesville</a></li> </ul> +<div id="menu5"> + <blockquote><a href="#">Aberdeen</a></blockquote> + <blockquote><a href="#">Ada</a></blockquote> + <blockquote><a href="#">Adamsville</a></blockquote> + <blockquote><a href="#">Addyston</a></blockquote> + <blockquote> + <a href="#">Delphi</a> + <div> + <blockquote><a href="#">Ada</a></blockquote> + <blockquote><a href="#">Saarland</a></blockquote> + <blockquote><a href="#">Salzburg</a></blockquote> + </div> + </blockquote> + <blockquote><a href="#">Saarland</a></blockquote> + <blockquote> + <a href="#">Salzburg</a> + <div> + <blockquote> + <a href="#">Delphi</a> + <div> + <blockquote><a href="#">Ada</a></blockquote> + <blockquote><a href="#">Saarland</a></blockquote> + <blockquote><a href="#">Salzburg</a></blockquote> + </div> + </blockquote> + <blockquote> + <a href="#">Delphi</a> + <div> + <blockquote><a href="#">Ada</a></blockquote> + <blockquote><a href="#">Saarland</a></blockquote> + <blockquote><a href="#">Salzburg</a></blockquote> + </div> + </blockquote> + <blockquote><a href="#">Perch</a></blockquote> + </div> + </blockquote> +</div> + +<div class="menuElement" id="menu6"> + <div class="address-item"> + <a href="#"> + <span class="address-header">John Doe</span> + <span class="address-content">78 West Main St Apt 3A</span> + <span class="address-content">Bloomsburg, PA 12345</span> + </a> + </div> + <div class="address-item"> + <a href="#"> + <span class="address-header">Jane Doe</span> + <span class="address-content">78 West Main St Apt 3A</span> + <span class="address-content">Bloomsburg, PA 12345</span> + </a> + </div> + <div class="address-item"> + <a href="#"> + <span class="address-header">James Doe</span> + <span class="address-content">78 West Main St Apt 3A</span> + <span class="address-content">Bloomsburg, PA 12345</span> + </a> + </div> + <div class="address-item"> + <a href="#"> + <span class="address-header">Jenny Doe</span> + <span class="address-content">78 West Main St Apt 3A</span> + <span class="address-content">Bloomsburg, PA 12345</span> + </a> + </div> + <div class="address-item"> + <a href="#"> + <span class="address-header">John Doe</span> + <span class="address-content">78 West Main St Apt 3A</span> + <span class="address-content">Bloomsburg, PA 12345</span> + </a> + <div class="menuElement"> + <div><a href="#">Ada</a></div> + <div><a href="#">Saarland</a></div> + <div><a href="#">Salzburg</a></div> + </div> + </div> +</div> + <div class="ui-widget" style="clear: left; margin-top:2em; font-family:Arial"> Log: <div id="log" style="height: 400px; width: 300px; overflow: auto;" class="ui-widget-content"></div> @@ -182,4 +280,4 @@ <button id="toggle-destroy">Destroy / Create</button> </body> -</html> +</html>
\ No newline at end of file |