Skip to content

Commit 86fd11d

Browse files
committed
Dialog: Shift to use no globals
1 parent e8e8867 commit 86fd11d

File tree

6 files changed

+454
-431
lines changed

6 files changed

+454
-431
lines changed

tests/unit/dialog/core.js

Lines changed: 70 additions & 59 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,14 @@
11
define( [
2+
"qunit",
23
"jquery",
34
"ui/widgets/dialog"
4-
], function( $ ) {
5+
], function( QUnit, $ ) {
56

67
// TODO add teardown callback to remove dialogs
7-
module( "dialog: core" );
8+
QUnit.module( "dialog: core" );
89

9-
test( "markup structure", function( assert ) {
10-
expect( 11 );
10+
QUnit.test( "markup structure", function( assert ) {
11+
assert.expect( 11 );
1112

1213
var element = $( "<div>" ).dialog( {
1314
buttons: [ {
@@ -25,20 +26,20 @@ test( "markup structure", function( assert ) {
2526

2627
assert.hasClasses( widget, "ui-dialog ui-dialog-buttons ui-widget ui-widget-content" );
2728
assert.hasClasses( titlebar, "ui-dialog-titlebar ui-widget-header" );
28-
equal( titlebar.length, 1, "Dialog has exactly one titlebar" );
29+
assert.equal( titlebar.length, 1, "Dialog has exactly one titlebar" );
2930
assert.hasClasses( close, "ui-dialog-titlebar-close ui-widget" );
30-
equal( close.length, 1, "Titlebar has exactly one close button" );
31-
equal( title.length, 1, "Titlebar has exactly one title" );
31+
assert.equal( close.length, 1, "Titlebar has exactly one close button" );
32+
assert.equal( title.length, 1, "Titlebar has exactly one title" );
3233
assert.hasClasses( element, "ui-dialog-content ui-widget-content" );
3334
assert.hasClasses( buttonpane, "ui-dialog-buttonpane ui-widget-content" );
34-
equal( buttonpane.length, 1, "Dialog has exactly one buttonpane" );
35-
equal( buttonset.length, 1, "Buttonpane has exactly one buttonset" );
36-
equal( buttons.length, 1, "Buttonset contains exactly 1 button when created with 1" );
35+
assert.equal( buttonpane.length, 1, "Dialog has exactly one buttonpane" );
36+
assert.equal( buttonset.length, 1, "Buttonpane has exactly one buttonset" );
37+
assert.equal( buttons.length, 1, "Buttonset contains exactly 1 button when created with 1" );
3738

3839
} );
3940

40-
test( "markup structure - no buttons", function( assert ) {
41-
expect( 7 );
41+
QUnit.test( "markup structure - no buttons", function( assert ) {
42+
assert.expect( 7 );
4243

4344
var element = $( "<div>" ).dialog(),
4445
widget = element.dialog( "widget" ),
@@ -48,48 +49,49 @@ test( "markup structure - no buttons", function( assert ) {
4849

4950
assert.hasClasses( widget, "ui-dialog ui-widget ui-widget-content" );
5051
assert.hasClasses( titlebar, "ui-dialog-titlebar ui-widget-header" );
51-
equal( titlebar.length, 1, "Dialog has exactly one titlebar" );
52+
assert.equal( titlebar.length, 1, "Dialog has exactly one titlebar" );
5253
assert.hasClasses( close, "ui-dialog-titlebar-close ui-widget" );
53-
equal( close.length, 1, "Titlebar has exactly one close button" );
54-
equal( title.length, 1, "Titlebar has exactly one title" );
54+
assert.equal( close.length, 1, "Titlebar has exactly one close button" );
55+
assert.equal( title.length, 1, "Titlebar has exactly one title" );
5556
assert.hasClasses( element, "ui-dialog-content ui-widget-content" );
5657
} );
5758

58-
test( "title id", function() {
59-
expect( 1 );
59+
QUnit.test( "title id", function( assert ) {
60+
assert.expect( 1 );
6061

6162
var titleId,
6263
element = $( "<div>" ).dialog();
6364

6465
titleId = element.dialog( "widget" ).find( ".ui-dialog-title" ).attr( "id" );
65-
ok( /ui-id-\d+$/.test( titleId ), "auto-numbered title id" );
66+
assert.ok( /ui-id-\d+$/.test( titleId ), "auto-numbered title id" );
6667
element.remove();
6768
} );
6869

69-
test( "ARIA", function() {
70-
expect( 4 );
70+
QUnit.test( "ARIA", function( assert ) {
71+
assert.expect( 4 );
7172

7273
var element = $( "<div>" ).dialog(),
7374
wrapper = element.dialog( "widget" );
74-
equal( wrapper.attr( "role" ), "dialog", "dialog role" );
75-
equal( wrapper.attr( "aria-labelledby" ), wrapper.find( ".ui-dialog-title" ).attr( "id" ) );
76-
equal( wrapper.attr( "aria-describedby" ), element.attr( "id" ), "aria-describedby added" );
75+
assert.equal( wrapper.attr( "role" ), "dialog", "dialog role" );
76+
assert.equal( wrapper.attr( "aria-labelledby" ), wrapper.find( ".ui-dialog-title" ).attr( "id" ) );
77+
assert.equal( wrapper.attr( "aria-describedby" ), element.attr( "id" ), "aria-describedby added" );
7778
element.remove();
7879

7980
element = $( "<div><div aria-describedby='section2'><p id='section2'>descriotion</p></div></div>" ).dialog();
80-
equal( element.dialog( "widget" ).attr( "aria-describedby" ), null, "no aria-describedby added, as already present in markup" );
81+
assert.equal( element.dialog( "widget" ).attr( "aria-describedby" ), null, "no aria-describedby added, as already present in markup" );
8182
element.remove();
8283
} );
8384

84-
test( "widget method", function() {
85-
expect( 1 );
85+
QUnit.test( "widget method", function( assert ) {
86+
assert.expect( 1 );
8687
var dialog = $( "<div>" ).appendTo( "#qunit-fixture" ).dialog();
87-
deepEqual( dialog.parent()[ 0 ], dialog.dialog( "widget" )[ 0 ] );
88+
assert.deepEqual( dialog.parent()[ 0 ], dialog.dialog( "widget" )[ 0 ] );
8889
dialog.remove();
8990
} );
9091

91-
asyncTest( "focus tabbable", function() {
92-
expect( 8 );
92+
QUnit.test( "focus tabbable", function( assert ) {
93+
var ready = assert.async();
94+
assert.expect( 8 );
9395
var element,
9496
options = {
9597
buttons: [ {
@@ -119,7 +121,7 @@ asyncTest( "focus tabbable", function() {
119121
var input = element.find( "input:last" ).trigger( "focus" ).trigger( "blur" );
120122
element.dialog( "instance" )._focusTabbable();
121123
setTimeout( function() {
122-
equal( document.activeElement, input[ 0 ],
124+
assert.equal( document.activeElement, input[ 0 ],
123125
"1. an element that was focused previously." );
124126
done();
125127
} );
@@ -128,23 +130,23 @@ asyncTest( "focus tabbable", function() {
128130

129131
function step2() {
130132
checkFocus( "<div><input><input autofocus></div>", options, function( done ) {
131-
equal( document.activeElement, element.find( "input" )[ 1 ],
133+
assert.equal( document.activeElement, element.find( "input" )[ 1 ],
132134
"2. first element inside the dialog matching [autofocus]" );
133135
done();
134136
}, step3 );
135137
}
136138

137139
function step3() {
138140
checkFocus( "<div><input><input></div>", options, function( done ) {
139-
equal( document.activeElement, element.find( "input" )[ 0 ],
141+
assert.equal( document.activeElement, element.find( "input" )[ 0 ],
140142
"3. tabbable element inside the content element" );
141143
done();
142144
}, step4 );
143145
}
144146

145147
function step4() {
146148
checkFocus( "<div>text</div>", options, function( done ) {
147-
equal( document.activeElement,
149+
assert.equal( document.activeElement,
148150
element.dialog( "widget" ).find( ".ui-dialog-buttonpane button" )[ 0 ],
149151
"4. tabbable element inside the buttonpane" );
150152
done();
@@ -153,7 +155,7 @@ asyncTest( "focus tabbable", function() {
153155

154156
function step5() {
155157
checkFocus( "<div>text</div>", {}, function( done ) {
156-
equal( document.activeElement,
158+
assert.equal( document.activeElement,
157159
element.dialog( "widget" ).find( ".ui-dialog-titlebar .ui-dialog-titlebar-close" )[ 0 ],
158160
"5. the close button" );
159161
done();
@@ -165,7 +167,7 @@ asyncTest( "focus tabbable", function() {
165167
element.dialog( "widget" ).find( ".ui-dialog-titlebar-close" ).hide();
166168
element.dialog( "open" );
167169
setTimeout( function() {
168-
equal( document.activeElement, element.parent()[ 0 ], "6. the dialog itself" );
170+
assert.equal( document.activeElement, element.parent()[ 0 ], "6. the dialog itself" );
169171
done();
170172
} );
171173
}, step7 );
@@ -184,36 +186,39 @@ asyncTest( "focus tabbable", function() {
184186
}
185187
},
186188
function( done ) {
187-
var inputs = element.find( "input" );
188-
equal( document.activeElement, inputs[ 1 ], "Focus starts on second input" );
189+
var inputs = element.find( "input"
190+
);
191+
assert.equal
192+
( document.activeElement, inputs[ 1 ], "Focus starts on second input" );
189193
inputs.last().simulate( "keydown", { keyCode: $.ui.keyCode.TAB } );
190194
setTimeout( function() {
191-
equal( document.activeElement, inputs[ 0 ],
195+
assert.equal( document.activeElement, inputs[ 0 ],
192196
"Honor preventDefault, allowing custom focus management" );
193197
done();
194198
}, 50 );
195199
},
196-
start
200+
ready
197201
);
198202
}
199203

200204
step1();
201205
} );
202206

203-
test( "#7960: resizable handles below modal overlays", function() {
204-
expect( 1 );
207+
QUnit.test( "#7960: resizable handles below modal overlays", function( assert ) {
208+
assert.expect( 1 );
205209

206210
var resizable = $( "<div>" ).resizable(),
207211
dialog = $( "<div>" ).dialog( { modal: true } ),
208212
resizableZindex = parseInt( resizable.find( ".ui-resizable-handle" ).css( "zIndex" ), 10 ),
209213
overlayZindex = parseInt( $( ".ui-widget-overlay" ).css( "zIndex" ), 10 );
210214

211-
ok( resizableZindex < overlayZindex, "Resizable handles have lower z-index than modal overlay" );
215+
assert.ok( resizableZindex < overlayZindex, "Resizable handles have lower z-index than modal overlay" );
212216
dialog.dialog( "destroy" );
213217
} );
214218

215-
asyncTest( "Prevent tabbing out of dialogs", function() {
216-
expect( 3 );
219+
QUnit.test( "Prevent tabbing out of dialogs", function( assert ) {
220+
var ready = assert.async();
221+
assert.expect( 3 );
217222

218223
var element = $( "<div><input name='0'><input name='1'></div>" ).dialog(),
219224
inputs = element.find( "input" );
@@ -222,51 +227,54 @@ asyncTest( "Prevent tabbing out of dialogs", function() {
222227
element.dialog( "widget" ).find( ".ui-button" ).remove();
223228

224229
function checkTab() {
225-
equal( document.activeElement, inputs[ 0 ], "Tab key event moved focus within the modal" );
230+
assert.equal( document.activeElement, inputs[ 0 ], "Tab key event move d focus within the modal" );
226231

227232
// Check shift tab
228233
$( document.activeElement ).simulate( "keydown", { keyCode: $.ui.keyCode.TAB, shiftKey: true } );
229234
setTimeout( checkShiftTab );
230235
}
231236

232237
function checkShiftTab() {
233-
equal( document.activeElement, inputs[ 1 ], "Shift-Tab key event moved focus back to second input" );
238+
assert.equal( document.activeElement, inputs[ 1 ], "Shift-Tab key event moved focus back to second input" );
234239

235240
element.remove();
236-
setTimeout( start );
241+
setTimeout( ready );
237242
}
238243

239244
inputs[ 1 ].focus();
240245
setTimeout( function() {
241-
equal( document.activeElement, inputs[ 1 ], "Focus set on second input" );
246+
assert.equal( document.activeElement, inputs[ 1 ], "Focus set on second input" );
242247
inputs.eq( 1 ).simulate( "keydown", { keyCode: $.ui.keyCode.TAB } );
243248

244249
setTimeout( checkTab );
245250
} );
246251
} );
247252

248-
asyncTest( "#9048: multiple modal dialogs opened and closed in different order", function() {
249-
expect( 1 );
253+
QUnit.test( "#9048: multiple modal dialogs opened and closed in different order",
254+
function( assert ) {
255+
var ready = assert.async();
256+
assert.expect( 1 );
250257
$( "#dialog1, #dialog2" ).dialog( { autoOpen: false, modal:true } );
251258
$( "#dialog1" ).dialog( "open" );
252259
$( "#dialog2" ).dialog( "open" );
253260
$( "#dialog1" ).dialog( "close" );
254261
setTimeout( function() {
255262
$( "#dialog2" ).dialog( "close" );
256263
$( "#favorite-animal" ).trigger( "focus" );
257-
ok( true, "event handlers cleaned up (no errors thrown)" );
258-
start();
264+
assert.ok( true, "event handlers cleaned up (no errors thrown)" );
265+
ready();
259266
} );
260267
} );
261268

262-
asyncTest( "interaction between overlay and other dialogs", function() {
269+
QUnit.test( "interaction between overlay and other dialogs", function( assert ) {
270+
var ready = assert.async();
263271
$.widget( "ui.testWidget", $.ui.dialog, {
264272
options: {
265273
modal: true,
266274
autoOpen: false
267275
}
268276
} );
269-
expect( 2 );
277+
assert.expect( 2 );
270278
var first = $( "<div><input id='input-1'></div>" ).dialog( {
271279
modal: true
272280
} ),
@@ -281,25 +289,28 @@ asyncTest( "interaction between overlay and other dialogs", function() {
281289

282290
// Wait for the modal to init
283291
setTimeout( function() {
284-
second.testWidget( "open" );
285292

286-
// Simulate user tabbing from address bar to an element outside the dialog
293+
second.
294+
testWidget
295+
( "open" );
296+
297+
// Simulate user tabbing from address bar to an element outside the dialog
287298
$( "#favorite-animal" ).trigger( "focus" );
288299
setTimeout( function() {
289-
equal( document.activeElement, secondInput[ 0 ] );
300+
assert.equal( document.activeElement, secondInput[ 0 ] );
290301

291302
// Last active dialog must receive focus
292303
firstInput.trigger( "focus" );
293304
$( "#favorite-animal" ).trigger( "focus" );
294305
setTimeout( function() {
295-
equal( document.activeElement, firstInput[ 0 ] );
306+
assert.equal( document.activeElement, firstInput[ 0 ] );
296307

297308
// Cleanup
298309
first.remove();
299310
second.remove();
300311
delete $.ui.testWidget;
301312
delete $.fn.testWidget;
302-
start();
313+
ready();
303314
} );
304315
} );
305316
} );

tests/unit/dialog/deprecated.js

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,13 @@
11
define( [
2+
"qunit",
23
"jquery",
34
"ui/widgets/dialog"
4-
], function( $ ) {
5+
], function( QUnit, $ ) {
56

6-
module( "dialog (deprecated): options" );
7+
QUnit.module( "dialog (deprecated): options" );
78

8-
test( "dialogClass", function( assert ) {
9-
expect( 5 );
9+
QUnit.test( "dialogClass", function( assert ) {
10+
assert.expect( 5 );
1011

1112
var element = $( "<div>" ).dialog(),
1213
widget = element.dialog( "widget" );

0 commit comments

Comments
 (0)