1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
|
define( [
"qunit",
"jquery",
"lib/helper",
"./helper",
"ui/widgets/menu"
], function( QUnit, $, helper, testHelper ) {
QUnit.module( "menu: core", { afterEach: helper.moduleAfterEach } );
QUnit.test( "markup structure", function( assert ) {
assert.expect( 11 );
var element = $( "#menu9" ).menu(),
items = element.children(),
firstItemChildren = items.eq( 0 ).children();
assert.hasClasses( element, "ui-menu ui-widget ui-widget-content" );
assert.hasClasses( items[ 0 ], "ui-menu-item" );
assert.equal( items.eq( 0 ).children().length, 2, "Item has exactly 2 children when it has a sub menu" );
assert.hasClasses( firstItemChildren[ 0 ], "ui-menu-item-wrapper" );
assert.hasClasses( firstItemChildren[ 1 ], "ui-menu ui-widget ui-widget-content" );
assert.hasClasses( firstItemChildren.eq( 1 ).children()[ 0 ], "ui-menu-item" );
assert.hasClasses( firstItemChildren.eq( 1 ).children().eq( 0 ).children(), "ui-menu-item-wrapper" );
assert.hasClasses( items[ 1 ], "ui-menu-item" );
assert.equal( items.eq( 1 ).children().length, 1, "Item has exactly 1 child when it does not have a sub menu" );
assert.hasClasses( items[ 2 ], "ui-menu-item" );
assert.equal( items.eq( 2 ).children().length, 1, "Item has exactly 1 child when it does not have a sub menu" );
} );
QUnit.test( "accessibility", function( assert ) {
assert.expect( 4 );
var element = $( "#menu1" ).menu();
assert.equal( element.attr( "role" ), "menu", "main role" );
assert.ok( !element.attr( "aria-activedescendant" ), "aria-activedescendant not set" );
element.menu( "focus", $.Event(), element.children().eq( -2 ) );
assert.equal( element.attr( "aria-activedescendant" ), "testID1", "aria-activedescendant from existing id" );
element.menu( "focus", $.Event(), element.children().eq( 0 ) );
assert.ok( /^ui-id-\d+$/.test( element.attr( "aria-activedescendant" ) ), "aria-activedescendant from generated id" );
// Item roles are tested in the role option tests
} );
QUnit.test( "#9044: Autofocus issue with dialog opened from menu widget", function( assert ) {
var ready = assert.async();
assert.expect( 1 );
var element = $( "#menu1" ).menu();
$( "<input>", { id: "test9044" } ).appendTo( "body" );
$( "#testID1" ).on( "click", function() {
$( "#test9044" ).trigger( "focus" );
} );
testHelper.click( element, "3" );
setTimeout( function() {
assert.equal( document.activeElement.id, "test9044", "Focus was swallowed by menu" );
$( "#test9044" ).remove();
ready();
} );
} );
QUnit.test( "#9532: Need a way in Menu to keep ui-state-active class on selected item for Selectmenu", function( assert ) {
var ready = assert.async();
assert.expect( 1 );
var element = $( "#menu1" ).menu(),
firstChild = element.children().eq( 0 ),
wrapper = firstChild.children( ".ui-menu-item-wrapper" );
element.menu( "focus", null, firstChild );
wrapper.addClass( "ui-state-active" );
setTimeout( function() {
assert.hasClasses( wrapper, "ui-state-active" );
ready();
} );
} );
QUnit.test( "active menu item styling", function( assert ) {
var ready = assert.async();
assert.expect( 5 );
function isActive( item ) {
assert.hasClasses( item.children( ".ui-menu-item-wrapper" ), "ui-state-active" );
}
function isInactive( item ) {
assert.lacksClasses( item.children( ".ui-menu-item-wrapper" ), "ui-state-active" );
}
$.ui.menu.prototype.delay = 0;
var element = $( "#menu4" ).menu();
var parentItem = element.children( "li" ).eq( 1 );
var childItem = parentItem.find( "li" ).eq( 0 );
element.menu( "focus", null, parentItem );
setTimeout( function() {
isActive( parentItem );
element.menu( "focus", null, childItem );
setTimeout( function() {
isActive( parentItem );
isActive( childItem );
element.trigger( "blur" );
setTimeout( function() {
isInactive( parentItem );
isInactive( childItem );
$.ui.menu.prototype.delay = 300;
ready();
}, 50 );
} );
} );
} );
} );
|
