1 |
/* |
2 |
* dialog_events.js |
3 |
*/ |
4 |
(function($) { |
5 |
|
6 |
module("dialog: events"); |
7 |
|
8 |
test("open", function() { |
9 |
expect(13); |
10 |
|
11 |
var element = $("<div></div>"); |
12 |
element.dialog({ |
13 |
open: function(ev, ui) { |
14 |
ok(element.data("ui-dialog")._isOpen, "interal _isOpen flag is set"); |
15 |
ok(true, "autoOpen: true fires open callback"); |
16 |
equal(this, element[0], "context of callback"); |
17 |
equal(ev.type, "dialogopen", "event type in callback"); |
18 |
deepEqual(ui, {}, "ui hash in callback"); |
19 |
} |
20 |
}); |
21 |
element.remove(); |
22 |
|
23 |
element = $("<div></div>"); |
24 |
element.dialog({ |
25 |
autoOpen: false, |
26 |
open: function(ev, ui) { |
27 |
ok(true, ".dialog('open') fires open callback"); |
28 |
equal(this, element[0], "context of callback"); |
29 |
equal(ev.type, "dialogopen", "event type in callback"); |
30 |
deepEqual(ui, {}, "ui hash in callback"); |
31 |
} |
32 |
}).bind("dialogopen", function(ev, ui) { |
33 |
ok(element.data("ui-dialog")._isOpen, "interal _isOpen flag is set"); |
34 |
ok(true, "dialog('open') fires open event"); |
35 |
equal(this, element[0], "context of event"); |
36 |
deepEqual(ui, {}, "ui hash in event"); |
37 |
}); |
38 |
element.dialog("open"); |
39 |
element.remove(); |
40 |
}); |
41 |
|
42 |
|
43 |
test( "focus", function() { |
44 |
expect( 5 ); |
45 |
var element, other; |
46 |
element = $("#dialog1").dialog({ |
47 |
autoOpen: false |
48 |
}); |
49 |
other = $("#dialog2").dialog({ |
50 |
autoOpen: false |
51 |
}); |
52 |
|
53 |
element.one( "dialogopen", function() { |
54 |
ok( true, "open, just once" ); |
55 |
}); |
56 |
element.one( "dialogfocus", function() { |
57 |
ok( true, "focus on open" ); |
58 |
}); |
59 |
other.dialog( "open" ); |
60 |
|
61 |
element.one( "dialogfocus", function() { |
62 |
ok( true, "when opening and already open and wasn't on top" ); |
63 |
}); |
64 |
other.dialog( "open" ); |
65 |
element.dialog( "open" ); |
66 |
|
67 |
element.one( "dialogfocus", function() { |
68 |
ok( true, "when calling moveToTop and wasn't on top" ); |
69 |
}); |
70 |
other.dialog( "moveToTop" ); |
71 |
element.dialog( "moveToTop" ); |
72 |
|
73 |
element.bind( "dialogfocus", function() { |
74 |
ok( true, "when mousedown anywhere on the dialog and it wasn't on top" ); |
75 |
}); |
76 |
other.dialog( "moveToTop" ); |
77 |
element.trigger( "mousedown" ); |
78 |
|
79 |
// triggers just once when already on top |
80 |
element.dialog( "open" ); |
81 |
element.dialog( "moveToTop" ); |
82 |
element.trigger( "mousedown" ); |
83 |
|
84 |
element.add( other ).remove(); |
85 |
}); |
86 |
|
87 |
test("dragStart", function() { |
88 |
expect(9); |
89 |
|
90 |
var handle, |
91 |
element = $("<div></div>").dialog({ |
92 |
dragStart: function(ev, ui) { |
93 |
ok(true, "dragging fires dragStart callback"); |
94 |
equal(this, element[0], "context of callback"); |
95 |
equal(ev.type, "dialogdragstart", "event type in callback"); |
96 |
ok(ui.position !== undefined, "ui.position in callback"); |
97 |
ok(ui.offset !== undefined, "ui.offset in callback"); |
98 |
} |
99 |
}).bind("dialogdragstart", function(ev, ui) { |
100 |
ok(true, "dragging fires dialogdragstart event"); |
101 |
equal(this, element[0], "context of event"); |
102 |
ok(ui.position !== undefined, "ui.position in callback"); |
103 |
ok(ui.offset !== undefined, "ui.offset in callback"); |
104 |
}); |
105 |
|
106 |
handle = $(".ui-dialog-titlebar", element.dialog("widget")); |
107 |
TestHelpers.dialog.drag(element, handle, 50, 50); |
108 |
element.remove(); |
109 |
}); |
110 |
|
111 |
test("drag", function() { |
112 |
expect(9); |
113 |
var handle, |
114 |
hasDragged = false, |
115 |
element = $("<div></div>").dialog({ |
116 |
drag: function(ev, ui) { |
117 |
if (!hasDragged) { |
118 |
ok(true, "dragging fires drag callback"); |
119 |
equal(this, element[0], "context of callback"); |
120 |
equal(ev.type, "dialogdrag", "event type in callback"); |
121 |
ok(ui.position !== undefined, "ui.position in callback"); |
122 |
ok(ui.offset !== undefined, "ui.offset in callback"); |
123 |
|
124 |
hasDragged = true; |
125 |
} |
126 |
} |
127 |
}).one("dialogdrag", function(ev, ui) { |
128 |
ok(true, "dragging fires dialogdrag event"); |
129 |
equal(this, element[0], "context of event"); |
130 |
ok(ui.position !== undefined, "ui.position in callback"); |
131 |
ok(ui.offset !== undefined, "ui.offset in callback"); |
132 |
}); |
133 |
|
134 |
handle = $(".ui-dialog-titlebar", element.dialog("widget")); |
135 |
TestHelpers.dialog.drag(element, handle, 50, 50); |
136 |
element.remove(); |
137 |
}); |
138 |
|
139 |
test("dragStop", function() { |
140 |
expect(9); |
141 |
|
142 |
var handle, |
143 |
element = $("<div></div>").dialog({ |
144 |
dragStop: function(ev, ui) { |
145 |
ok(true, "dragging fires dragStop callback"); |
146 |
equal(this, element[0], "context of callback"); |
147 |
equal(ev.type, "dialogdragstop", "event type in callback"); |
148 |
ok(ui.position !== undefined, "ui.position in callback"); |
149 |
ok(ui.offset !== undefined, "ui.offset in callback"); |
150 |
} |
151 |
}).bind("dialogdragstop", function(ev, ui) { |
152 |
ok(true, "dragging fires dialogdragstop event"); |
153 |
equal(this, element[0], "context of event"); |
154 |
ok(ui.position !== undefined, "ui.position in callback"); |
155 |
ok(ui.offset !== undefined, "ui.offset in callback"); |
156 |
}); |
157 |
|
158 |
handle = $(".ui-dialog-titlebar", element.dialog("widget")); |
159 |
TestHelpers.dialog.drag(element, handle, 50, 50); |
160 |
element.remove(); |
161 |
}); |
162 |
|
163 |
test("resizeStart", function() { |
164 |
expect(13); |
165 |
|
166 |
var handle, |
167 |
element = $("<div></div>").dialog({ |
168 |
resizeStart: function(ev, ui) { |
169 |
ok(true, "resizing fires resizeStart callback"); |
170 |
equal(this, element[0], "context of callback"); |
171 |
equal(ev.type, "dialogresizestart", "event type in callback"); |
172 |
ok(ui.originalPosition !== undefined, "ui.originalPosition in callback"); |
173 |
ok(ui.originalSize !== undefined, "ui.originalSize in callback"); |
174 |
ok(ui.position !== undefined, "ui.position in callback"); |
175 |
ok(ui.size !== undefined, "ui.size in callback"); |
176 |
} |
177 |
}).bind("dialogresizestart", function(ev, ui) { |
178 |
ok(true, "resizing fires dialogresizestart event"); |
179 |
equal(this, element[0], "context of event"); |
180 |
ok(ui.originalPosition !== undefined, "ui.originalPosition in callback"); |
181 |
ok(ui.originalSize !== undefined, "ui.originalSize in callback"); |
182 |
ok(ui.position !== undefined, "ui.position in callback"); |
183 |
ok(ui.size !== undefined, "ui.size in callback"); |
184 |
}); |
185 |
|
186 |
handle = $(".ui-resizable-se", element.dialog("widget")); |
187 |
TestHelpers.dialog.drag(element, handle, 50, 50); |
188 |
element.remove(); |
189 |
}); |
190 |
|
191 |
test("resize", function() { |
192 |
expect(13); |
193 |
var handle, |
194 |
hasResized = false, |
195 |
element = $("<div></div>").dialog({ |
196 |
resize: function(ev, ui) { |
197 |
if (!hasResized) { |
198 |
ok(true, "resizing fires resize callback"); |
199 |
equal(this, element[0], "context of callback"); |
200 |
equal(ev.type, "dialogresize", "event type in callback"); |
201 |
ok(ui.originalPosition !== undefined, "ui.originalPosition in callback"); |
202 |
ok(ui.originalSize !== undefined, "ui.originalSize in callback"); |
203 |
ok(ui.position !== undefined, "ui.position in callback"); |
204 |
ok(ui.size !== undefined, "ui.size in callback"); |
205 |
|
206 |
hasResized = true; |
207 |
} |
208 |
} |
209 |
}).one("dialogresize", function(ev, ui) { |
210 |
ok(true, "resizing fires dialogresize event"); |
211 |
equal(this, element[0], "context of event"); |
212 |
ok(ui.originalPosition !== undefined, "ui.originalPosition in callback"); |
213 |
ok(ui.originalSize !== undefined, "ui.originalSize in callback"); |
214 |
ok(ui.position !== undefined, "ui.position in callback"); |
215 |
ok(ui.size !== undefined, "ui.size in callback"); |
216 |
}); |
217 |
|
218 |
handle = $(".ui-resizable-se", element.dialog("widget")); |
219 |
TestHelpers.dialog.drag(element, handle, 50, 50); |
220 |
element.remove(); |
221 |
}); |
222 |
|
223 |
test("resizeStop", function() { |
224 |
expect(13); |
225 |
|
226 |
var handle, |
227 |
element = $("<div></div>").dialog({ |
228 |
resizeStop: function(ev, ui) { |
229 |
ok(true, "resizing fires resizeStop callback"); |
230 |
equal(this, element[0], "context of callback"); |
231 |
equal(ev.type, "dialogresizestop", "event type in callback"); |
232 |
ok(ui.originalPosition !== undefined, "ui.originalPosition in callback"); |
233 |
ok(ui.originalSize !== undefined, "ui.originalSize in callback"); |
234 |
ok(ui.position !== undefined, "ui.position in callback"); |
235 |
ok(ui.size !== undefined, "ui.size in callback"); |
236 |
} |
237 |
}).bind("dialogresizestop", function(ev, ui) { |
238 |
ok(true, "resizing fires dialogresizestop event"); |
239 |
equal(this, element[0], "context of event"); |
240 |
ok(ui.originalPosition !== undefined, "ui.originalPosition in callback"); |
241 |
ok(ui.originalSize !== undefined, "ui.originalSize in callback"); |
242 |
ok(ui.position !== undefined, "ui.position in callback"); |
243 |
ok(ui.size !== undefined, "ui.size in callback"); |
244 |
}); |
245 |
|
246 |
handle = $(".ui-resizable-se", element.dialog("widget")); |
247 |
TestHelpers.dialog.drag(element, handle, 50, 50); |
248 |
element.remove(); |
249 |
}); |
250 |
|
251 |
asyncTest("close", function() { |
252 |
expect(14); |
253 |
|
254 |
var element = $("<div></div>").dialog({ |
255 |
close: function(ev, ui) { |
256 |
ok(true, ".dialog('close') fires close callback"); |
257 |
equal(this, element[0], "context of callback"); |
258 |
equal(ev.type, "dialogclose", "event type in callback"); |
259 |
deepEqual(ui, {}, "ui hash in callback"); |
260 |
} |
261 |
}).bind("dialogclose", function(ev, ui) { |
262 |
ok(true, ".dialog('close') fires dialogclose event"); |
263 |
equal(this, element[0], "context of event"); |
264 |
deepEqual(ui, {}, "ui hash in event"); |
265 |
}); |
266 |
element.dialog("close"); |
267 |
element.remove(); |
268 |
|
269 |
// Close event with an effect |
270 |
element = $("<div></div>").dialog({ |
271 |
hide: 10, |
272 |
close: function(ev, ui) { |
273 |
ok(true, ".dialog('close') fires close callback"); |
274 |
equal(this, element[0], "context of callback"); |
275 |
equal(ev.type, "dialogclose", "event type in callback"); |
276 |
deepEqual(ui, {}, "ui hash in callback"); |
277 |
start(); |
278 |
} |
279 |
}).bind("dialogclose", function(ev, ui) { |
280 |
ok(true, ".dialog('close') fires dialogclose event"); |
281 |
equal(this, element[0], "context of event"); |
282 |
deepEqual(ui, {}, "ui hash in event"); |
283 |
}); |
284 |
element.dialog("close"); |
285 |
}); |
286 |
|
287 |
test("beforeClose", function() { |
288 |
expect(14); |
289 |
|
290 |
var element = $("<div></div>").dialog({ |
291 |
beforeClose: function(ev, ui) { |
292 |
ok(true, ".dialog('close') fires beforeClose callback"); |
293 |
equal(this, element[0], "context of callback"); |
294 |
equal(ev.type, "dialogbeforeclose", "event type in callback"); |
295 |
deepEqual(ui, {}, "ui hash in callback"); |
296 |
return false; |
297 |
} |
298 |
}); |
299 |
|
300 |
element.dialog("close"); |
301 |
ok( element.dialog("widget").is(":visible"), "beforeClose callback should prevent dialog from closing"); |
302 |
element.remove(); |
303 |
|
304 |
element = $("<div></div>").dialog(); |
305 |
element.dialog("option", "beforeClose", function(ev, ui) { |
306 |
ok(true, ".dialog('close') fires beforeClose callback"); |
307 |
equal(this, element[0], "context of callback"); |
308 |
equal(ev.type, "dialogbeforeclose", "event type in callback"); |
309 |
deepEqual(ui, {}, "ui hash in callback"); |
310 |
return false; |
311 |
}); |
312 |
element.dialog("close"); |
313 |
|
314 |
ok( element.dialog("widget").is(":visible"), "beforeClose callback should prevent dialog from closing"); |
315 |
element.remove(); |
316 |
|
317 |
element = $("<div></div>").dialog().bind("dialogbeforeclose", function(ev, ui) { |
318 |
ok(true, ".dialog('close') triggers dialogbeforeclose event"); |
319 |
equal(this, element[0], "context of event"); |
320 |
deepEqual(ui, {}, "ui hash in event"); |
321 |
return false; |
322 |
}); |
323 |
element.dialog("close"); |
324 |
ok( element.dialog("widget").is(":visible"), "dialogbeforeclose event should prevent dialog from closing"); |
325 |
element.remove(); |
326 |
}); |
327 |
|
328 |
// #8789 and #8838 |
329 |
asyncTest("ensure dialog's container doesn't scroll on resize and focus", function() { |
330 |
expect(2); |
331 |
|
332 |
var element = $("#dialog1").dialog(), |
333 |
initialScroll = $(window).scrollTop(); |
334 |
element.dialog("option", "height", 600); |
335 |
equal($(window).scrollTop(), initialScroll, "scroll hasn't moved after height change"); |
336 |
setTimeout( function(){ |
337 |
$(".ui-dialog-titlebar-close").simulate("mousedown"); |
338 |
equal($(window).scrollTop(), initialScroll, "scroll hasn't moved after focus moved to dialog"); |
339 |
element.dialog("destroy"); |
340 |
start(); |
341 |
}, 500); |
342 |
}); |
343 |
|
344 |
test("#5184: isOpen in dialogclose event is true", function() { |
345 |
expect( 3 ); |
346 |
|
347 |
var element = $( "<div></div>" ).dialog({ |
348 |
close: function() { |
349 |
ok( !element.dialog("isOpen"), "dialog is not open during close" ); |
350 |
} |
351 |
}); |
352 |
ok( element.dialog("isOpen"), "dialog is open after init" ); |
353 |
element.dialog( "close" ); |
354 |
ok( !element.dialog("isOpen"), "dialog is not open after close" ); |
355 |
element.remove(); |
356 |
}); |
357 |
|
358 |
test("ensure dialog keeps focus when clicking modal overlay", function() { |
359 |
expect( 2 ); |
360 |
|
361 |
var element = $( "<div></div>" ).dialog({ |
362 |
modal: true |
363 |
}); |
364 |
ok( $(":focus").closest(".ui-dialog").length, "focus is in dialog" ); |
365 |
$(".ui-widget-overlay").simulate("mousedown"); |
366 |
ok( $(":focus").closest(".ui-dialog").length, "focus is still in dialog" ); |
367 |
element.remove(); |
368 |
}); |
369 |
|
370 |
})(jQuery); |