diff options
Diffstat (limited to 'tests/unit/dialog')
-rw-r--r-- | tests/unit/dialog/dialog.html | 1 | ||||
-rw-r--r-- | tests/unit/dialog/dialog_core.js | 91 | ||||
-rw-r--r-- | tests/unit/dialog/dialog_events.js | 238 | ||||
-rw-r--r-- | tests/unit/dialog/dialog_methods.js | 28 | ||||
-rw-r--r-- | tests/unit/dialog/dialog_options.js | 189 | ||||
-rw-r--r-- | tests/unit/dialog/dialog_test_helpers.js | 45 | ||||
-rw-r--r-- | tests/unit/dialog/dialog_tickets.js | 35 |
7 files changed, 310 insertions, 317 deletions
diff --git a/tests/unit/dialog/dialog.html b/tests/unit/dialog/dialog.html index 6722f1bb0..cb74bb654 100644 --- a/tests/unit/dialog/dialog.html +++ b/tests/unit/dialog/dialog.html @@ -29,6 +29,7 @@ <script src="dialog_events.js"></script> <script src="dialog_methods.js"></script> <script src="dialog_options.js"></script> + <script src="dialog_test_helpers.js"></script> <script src="dialog_tickets.js"></script> <script src="../swarminject.js"></script> diff --git a/tests/unit/dialog/dialog_core.js b/tests/unit/dialog/dialog_core.js index a9e5e9be2..b36f6204f 100644 --- a/tests/unit/dialog/dialog_core.js +++ b/tests/unit/dialog/dialog_core.js @@ -2,80 +2,6 @@ * dialog_core.js */ -var el, - offsetBefore, offsetAfter, - heightBefore, heightAfter, - widthBefore, widthAfter, - dragged; - -function dlg() { - return el.dialog('widget'); -} - -TestHelpers.isOpen = function(why) { - ok(dlg().is(":visible"), why); -}; - -TestHelpers.isNotOpen = function(why) { - ok(!dlg().is(":visible"), why); -}; - -function drag(handle, dx, dy) { - var d = dlg(); - offsetBefore = d.offset(); - heightBefore = d.height(); - widthBefore = d.width(); - //this mouseover is to work around a limitation in resizable - //TODO: fix resizable so handle doesn't require mouseover in order to be used - $(handle, d).simulate("mouseover"); - $(handle, d).simulate("drag", { - dx: dx || 0, - dy: dy || 0 - }); - dragged = { dx: dx, dy: dy }; - offsetAfter = d.offset(); - heightAfter = d.height(); - widthAfter = d.width(); -} - -TestHelpers.dialogMoved = function(dx, dy, msg) { - msg = msg ? msg + "." : ""; - var actual = { left: Math.round(offsetAfter.left), top: Math.round(offsetAfter.top) }, - expected = { left: Math.round(offsetBefore.left + dx), top: Math.round(offsetBefore.top + dy) }; - deepEqual(actual, expected, 'dragged[' + dragged.dx + ', ' + dragged.dy + '] ' + msg); -}; - -TestHelpers.shouldmove = function(why) { - var handle = $(".ui-dialog-titlebar", dlg()); - drag(handle, 50, -50); - TestHelpers.dialogMoved(50, -50, why); -}; - -TestHelpers.shouldnotmove = function(why) { - var handle = $(".ui-dialog-titlebar", dlg()); - drag(handle, 50, -50); - TestHelpers.dialogMoved(0, 0, why); -}; - -TestHelpers.resized = function(dw, dh, msg) { - msg = msg ? msg + "." : ""; - var actual = { width: widthAfter, height: heightAfter }, - expected = { width: widthBefore + dw, height: heightBefore + dh }; - deepEqual(actual, expected, 'resized[' + dragged.dx + ', ' + dragged.dy + '] ' + msg); -}; - -TestHelpers.shouldresize = function(why) { - var handle = $(".ui-resizable-se", dlg()); - drag(handle, 50, 50); - TestHelpers.resized(50, 50, why); -}; - -TestHelpers.shouldnotresize = function(why) { - var handle = $(".ui-resizable-se", dlg()); - drag(handle, 50, 50); - TestHelpers.resized(0, 0, why); -}; - (function($) { module("dialog: core"); @@ -83,8 +9,10 @@ module("dialog: core"); test("title id", function() { expect(1); - el = $('<div></div>').dialog(); - var titleId = dlg().find('.ui-dialog-title').attr('id'); + var titleId, + el = $('<div></div>').dialog(); + + titleId = el.dialog('widget').find('.ui-dialog-title').attr('id'); ok( /ui-id-\d+$/.test( titleId ), 'auto-numbered title id'); el.remove(); }); @@ -92,16 +20,17 @@ test("title id", function() { test("ARIA", function() { expect(4); - el = $('<div></div>').dialog(); + var labelledBy, + el = $('<div></div>').dialog(); - equal(dlg().attr('role'), 'dialog', 'dialog role'); + equal(el.dialog('widget').attr('role'), 'dialog', 'dialog role'); - var labelledBy = dlg().attr('aria-labelledby'); + labelledBy = el.dialog('widget').attr('aria-labelledby'); ok(labelledBy.length > 0, 'has aria-labelledby attribute'); - equal(dlg().find('.ui-dialog-title').attr('id'), labelledBy, + equal(el.dialog('widget').find('.ui-dialog-title').attr('id'), labelledBy, 'proper aria-labelledby attribute'); - equal(dlg().find('.ui-dialog-titlebar-close').attr('role'), 'button', + equal(el.dialog('widget').find('.ui-dialog-titlebar-close').attr('role'), 'button', 'close link role'); el.remove(); diff --git a/tests/unit/dialog/dialog_events.js b/tests/unit/dialog/dialog_events.js index 38b75a714..c5090d8f6 100644 --- a/tests/unit/dialog/dialog_events.js +++ b/tests/unit/dialog/dialog_events.js @@ -8,7 +8,7 @@ module("dialog: events"); test("open", function() { expect(13); - el = $("<div></div>"); + var el = $("<div></div>"); el.dialog({ open: function(ev, ui) { ok(el.data("dialog")._isOpen, "interal _isOpen flag is set"); @@ -42,163 +42,171 @@ test("open", function() { test("dragStart", function() { expect(9); - el = $('<div></div>').dialog({ - dragStart: function(ev, ui) { - ok(true, 'dragging fires dragStart callback'); - equal(this, el[0], "context of callback"); - equal(ev.type, 'dialogdragstart', 'event type in callback'); + var handle, + el = $('<div></div>').dialog({ + dragStart: function(ev, ui) { + ok(true, 'dragging fires dragStart callback'); + equal(this, el[0], "context of callback"); + equal(ev.type, 'dialogdragstart', 'event type in callback'); + ok(ui.position !== undefined, "ui.position in callback"); + ok(ui.offset !== undefined, "ui.offset in callback"); + } + }).bind('dialogdragstart', function(ev, ui) { + ok(true, 'dragging fires dialogdragstart event'); + equal(this, el[0], 'context of event'); ok(ui.position !== undefined, "ui.position in callback"); ok(ui.offset !== undefined, "ui.offset in callback"); - } - }).bind('dialogdragstart', function(ev, ui) { - ok(true, 'dragging fires dialogdragstart event'); - equal(this, el[0], 'context of event'); - ok(ui.position !== undefined, "ui.position in callback"); - ok(ui.offset !== undefined, "ui.offset in callback"); - }); - var handle = $(".ui-dialog-titlebar", dlg()); - drag(handle, 50, 50); + }); + + handle = $(".ui-dialog-titlebar", el.dialog('widget')); + TestHelpers.dialog.drag(el, handle, 50, 50); el.remove(); }); test("drag", function() { expect(9); var handle, - hasDragged = false; + hasDragged = false, + el = $('<div></div>').dialog({ + drag: function(ev, ui) { + if (!hasDragged) { + ok(true, 'dragging fires drag callback'); + equal(this, el[0], "context of callback"); + equal(ev.type, 'dialogdrag', 'event type in callback'); + ok(ui.position !== undefined, "ui.position in callback"); + ok(ui.offset !== undefined, "ui.offset in callback"); - el = $('<div></div>').dialog({ - drag: function(ev, ui) { - if (!hasDragged) { - ok(true, 'dragging fires drag callback'); - equal(this, el[0], "context of callback"); - equal(ev.type, 'dialogdrag', 'event type in callback'); - ok(ui.position !== undefined, "ui.position in callback"); - ok(ui.offset !== undefined, "ui.offset in callback"); - - hasDragged = true; + hasDragged = true; + } } - } - }).one('dialogdrag', function(ev, ui) { - ok(true, 'dragging fires dialogdrag event'); - equal(this, el[0], 'context of event'); - ok(ui.position !== undefined, "ui.position in callback"); - ok(ui.offset !== undefined, "ui.offset in callback"); - }); - handle = $(".ui-dialog-titlebar", dlg()); - drag(handle, 50, 50); + }).one('dialogdrag', function(ev, ui) { + ok(true, 'dragging fires dialogdrag event'); + equal(this, el[0], 'context of event'); + ok(ui.position !== undefined, "ui.position in callback"); + ok(ui.offset !== undefined, "ui.offset in callback"); + }); + + handle = $(".ui-dialog-titlebar", el.dialog('widget')); + TestHelpers.dialog.drag(el, handle, 50, 50); el.remove(); }); test("dragStop", function() { expect(9); - el = $('<div></div>').dialog({ - dragStop: function(ev, ui) { - ok(true, 'dragging fires dragStop callback'); - equal(this, el[0], "context of callback"); - equal(ev.type, 'dialogdragstop', 'event type in callback'); + var handle, + el = $('<div></div>').dialog({ + dragStop: function(ev, ui) { + ok(true, 'dragging fires dragStop callback'); + equal(this, el[0], "context of callback"); + equal(ev.type, 'dialogdragstop', 'event type in callback'); + ok(ui.position !== undefined, "ui.position in callback"); + ok(ui.offset !== undefined, "ui.offset in callback"); + } + }).bind('dialogdragstop', function(ev, ui) { + ok(true, 'dragging fires dialogdragstop event'); + equal(this, el[0], 'context of event'); ok(ui.position !== undefined, "ui.position in callback"); ok(ui.offset !== undefined, "ui.offset in callback"); - } - }).bind('dialogdragstop', function(ev, ui) { - ok(true, 'dragging fires dialogdragstop event'); - equal(this, el[0], 'context of event'); - ok(ui.position !== undefined, "ui.position in callback"); - ok(ui.offset !== undefined, "ui.offset in callback"); - }); - var handle = $(".ui-dialog-titlebar", dlg()); - drag(handle, 50, 50); + }); + + handle = $(".ui-dialog-titlebar", el.dialog('widget')); + TestHelpers.dialog.drag(el, handle, 50, 50); el.remove(); }); test("resizeStart", function() { expect(13); - el = $('<div></div>').dialog({ - resizeStart: function(ev, ui) { - ok(true, 'resizing fires resizeStart callback'); - equal(this, el[0], "context of callback"); - equal(ev.type, 'dialogresizestart', 'event type in callback'); + var handle, + el = $('<div></div>').dialog({ + resizeStart: function(ev, ui) { + ok(true, 'resizing fires resizeStart callback'); + equal(this, el[0], "context of callback"); + equal(ev.type, 'dialogresizestart', 'event type in callback'); + ok(ui.originalPosition !== undefined, "ui.originalPosition in callback"); + ok(ui.originalSize !== undefined, "ui.originalSize in callback"); + ok(ui.position !== undefined, "ui.position in callback"); + ok(ui.size !== undefined, "ui.size in callback"); + } + }).bind('dialogresizestart', function(ev, ui) { + ok(true, 'resizing fires dialogresizestart event'); + equal(this, el[0], 'context of event'); ok(ui.originalPosition !== undefined, "ui.originalPosition in callback"); ok(ui.originalSize !== undefined, "ui.originalSize in callback"); ok(ui.position !== undefined, "ui.position in callback"); ok(ui.size !== undefined, "ui.size in callback"); - } - }).bind('dialogresizestart', function(ev, ui) { - ok(true, 'resizing fires dialogresizestart event'); - equal(this, el[0], 'context of event'); - ok(ui.originalPosition !== undefined, "ui.originalPosition in callback"); - ok(ui.originalSize !== undefined, "ui.originalSize in callback"); - ok(ui.position !== undefined, "ui.position in callback"); - ok(ui.size !== undefined, "ui.size in callback"); - }); - var handle = $(".ui-resizable-se", dlg()); - drag(handle, 50, 50); + }); + + handle = $(".ui-resizable-se", el.dialog('widget')); + TestHelpers.dialog.drag(el, handle, 50, 50); el.remove(); }); test("resize", function() { expect(13); var handle, - hasResized = false; - - el = $('<div></div>').dialog({ - resize: function(ev, ui) { - if (!hasResized) { - ok(true, 'resizing fires resize callback'); - equal(this, el[0], "context of callback"); - equal(ev.type, 'dialogresize', 'event type in callback'); - ok(ui.originalPosition !== undefined, "ui.originalPosition in callback"); - ok(ui.originalSize !== undefined, "ui.originalSize in callback"); - ok(ui.position !== undefined, "ui.position in callback"); - ok(ui.size !== undefined, "ui.size in callback"); + hasResized = false, + el = $('<div></div>').dialog({ + resize: function(ev, ui) { + if (!hasResized) { + ok(true, 'resizing fires resize callback'); + equal(this, el[0], "context of callback"); + equal(ev.type, 'dialogresize', 'event type in callback'); + ok(ui.originalPosition !== undefined, "ui.originalPosition in callback"); + ok(ui.originalSize !== undefined, "ui.originalSize in callback"); + ok(ui.position !== undefined, "ui.position in callback"); + ok(ui.size !== undefined, "ui.size in callback"); - hasResized = true; + hasResized = true; + } } - } - }).one('dialogresize', function(ev, ui) { - ok(true, 'resizing fires dialogresize event'); - equal(this, el[0], 'context of event'); - ok(ui.originalPosition !== undefined, "ui.originalPosition in callback"); - ok(ui.originalSize !== undefined, "ui.originalSize in callback"); - ok(ui.position !== undefined, "ui.position in callback"); - ok(ui.size !== undefined, "ui.size in callback"); - }); - handle = $(".ui-resizable-se", dlg()); - drag(handle, 50, 50); + }).one('dialogresize', function(ev, ui) { + ok(true, 'resizing fires dialogresize event'); + equal(this, el[0], 'context of event'); + ok(ui.originalPosition !== undefined, "ui.originalPosition in callback"); + ok(ui.originalSize !== undefined, "ui.originalSize in callback"); + ok(ui.position !== undefined, "ui.position in callback"); + ok(ui.size !== undefined, "ui.size in callback"); + }); + + handle = $(".ui-resizable-se", el.dialog('widget')); + TestHelpers.dialog.drag(el, handle, 50, 50); el.remove(); }); test("resizeStop", function() { expect(13); - el = $('<div></div>').dialog({ - resizeStop: function(ev, ui) { - ok(true, 'resizing fires resizeStop callback'); - equal(this, el[0], "context of callback"); - equal(ev.type, 'dialogresizestop', 'event type in callback'); - ok(ui.originalPosition !== undefined, "ui.originalPosition in callback"); - ok(ui.originalSize !== undefined, "ui.originalSize in callback"); - ok(ui.position !== undefined, "ui.position in callback"); - ok(ui.size !== undefined, "ui.size in callback"); - } - }).bind('dialogresizestop', function(ev, ui) { - ok(true, 'resizing fires dialogresizestop event'); - equal(this, el[0], 'context of event'); - ok(ui.originalPosition !== undefined, "ui.originalPosition in callback"); - ok(ui.originalSize !== undefined, "ui.originalSize in callback"); - ok(ui.position !== undefined, "ui.position in callback"); - ok(ui.size !== undefined, "ui.size in callback"); - }); - var handle = $(".ui-resizable-se", dlg()); - drag(handle, 50, 50); + var handle, + el = $('<div></div>').dialog({ + resizeStop: function(ev, ui) { + ok(true, 'resizing fires resizeStop callback'); + equal(this, el[0], "context of callback"); + equal(ev.type, 'dialogresizestop', 'event type in callback'); + ok(ui.originalPosition !== undefined, "ui.originalPosition in callback"); + ok(ui.originalSize !== undefined, "ui.originalSize in callback"); + ok(ui.position !== undefined, "ui.position in callback"); + ok(ui.size !== undefined, "ui.size in callback"); + } + }).bind('dialogresizestop', function(ev, ui) { + ok(true, 'resizing fires dialogresizestop event'); + equal(this, el[0], 'context of event'); + ok(ui.originalPosition !== undefined, "ui.originalPosition in callback"); + ok(ui.originalSize !== undefined, "ui.originalSize in callback"); + ok(ui.position !== undefined, "ui.position in callback"); + ok(ui.size !== undefined, "ui.size in callback"); + }); + + handle = $(".ui-resizable-se", el.dialog('widget')); + TestHelpers.dialog.drag(el, handle, 50, 50); el.remove(); }); asyncTest("close", function() { expect(14); - el = $('<div></div>').dialog({ + var el = $('<div></div>').dialog({ close: function(ev, ui) { ok(true, '.dialog("close") fires close callback'); equal(this, el[0], "context of callback"); @@ -234,7 +242,7 @@ asyncTest("close", function() { test("beforeClose", function() { expect(14); - el = $('<div></div>').dialog({ + var el = $('<div></div>').dialog({ beforeClose: function(ev, ui) { ok(true, '.dialog("close") fires beforeClose callback'); equal(this, el[0], "context of callback"); @@ -243,8 +251,9 @@ test("beforeClose", function() { return false; } }); + el.dialog('close'); - TestHelpers.isOpen('beforeClose callback should prevent dialog from closing'); + ok( el.dialog("widget").is(":visible"), 'beforeClose callback should prevent dialog from closing'); el.remove(); el = $('<div></div>').dialog(); @@ -256,7 +265,8 @@ test("beforeClose", function() { return false; }); el.dialog('close'); - TestHelpers.isOpen('beforeClose callback should prevent dialog from closing'); + + ok( el.dialog("widget").is(":visible"), 'beforeClose callback should prevent dialog from closing'); el.remove(); el = $('<div></div>').dialog().bind('dialogbeforeclose', function(ev, ui) { @@ -266,7 +276,7 @@ test("beforeClose", function() { return false; }); el.dialog('close'); - TestHelpers.isOpen('dialogbeforeclose event should prevent dialog from closing'); + ok( el.dialog("widget").is(":visible"), 'dialogbeforeclose event should prevent dialog from closing'); el.remove(); }); diff --git a/tests/unit/dialog/dialog_methods.js b/tests/unit/dialog/dialog_methods.js index e7b2fc710..7048a76a9 100644 --- a/tests/unit/dialog/dialog_methods.js +++ b/tests/unit/dialog/dialog_methods.js @@ -24,7 +24,7 @@ test("init", function() { $('<div></div>').appendTo('body').remove().dialog().remove(); ok(true, '.dialog() called on disconnected DOMElement - removed'); - el = $('<div></div>').dialog(); + var el = $('<div></div>').dialog(); el.dialog("option", "foo"); el.remove(); ok(true, 'arbitrary option getter after init'); @@ -53,46 +53,49 @@ test("destroy", function() { test("enable", function() { expect( 3 ); - var expected = $('<div></div>').dialog(), + var el, + expected = $('<div></div>').dialog(), actual = expected.dialog('enable'); equal(actual, expected, 'enable is chainable'); el = $('<div></div>').dialog({ disabled: true }); el.dialog('enable'); equal(el.dialog('option', 'disabled'), false, 'enable method sets disabled option to false'); - ok(!dlg().hasClass('ui-dialog-disabled'), 'enable method removes ui-dialog-disabled class from ui-dialog element'); + ok(!el.dialog('widget').hasClass('ui-dialog-disabled'), 'enable method removes ui-dialog-disabled class from ui-dialog element'); }); test("disable", function() { expect( 3 ); - var expected = $('<div></div>').dialog(), + var el, + expected = $('<div></div>').dialog(), actual = expected.dialog('disable'); equal(actual, expected, 'disable is chainable'); el = $('<div></div>').dialog({ disabled: false }); el.dialog('disable'); equal(el.dialog('option', 'disabled'), true, 'disable method sets disabled option to true'); - ok(dlg().hasClass('ui-dialog-disabled'), 'disable method adds ui-dialog-disabled class to ui-dialog element'); + ok(el.dialog('widget').hasClass('ui-dialog-disabled'), 'disable method adds ui-dialog-disabled class to ui-dialog element'); }); test("close", function() { expect( 3 ); - var expected = $('<div></div>').dialog(), + var el, + expected = $('<div></div>').dialog(), actual = expected.dialog('close'); equal(actual, expected, 'close is chainable'); el = $('<div></div>').dialog(); - ok(dlg().is(':visible') && !dlg().is(':hidden'), 'dialog visible before close method called'); + ok(el.dialog('widget').is(':visible') && !el.dialog('widget').is(':hidden'), 'dialog visible before close method called'); el.dialog('close'); - ok(dlg().is(':hidden') && !dlg().is(':visible'), 'dialog hidden after close method called'); + ok(el.dialog('widget').is(':hidden') && !el.dialog('widget').is(':visible'), 'dialog hidden after close method called'); }); test("isOpen", function() { expect(4); - el = $('<div></div>').dialog(); + var el = $('<div></div>').dialog(); equal(el.dialog('isOpen'), true, "dialog is open after init"); el.dialog('close'); equal(el.dialog('isOpen'), false, "dialog is closed"); @@ -134,14 +137,15 @@ test("moveToTop", function() { test("open", function() { expect( 3 ); - var expected = $('<div></div>').dialog(), + var el, + expected = $('<div></div>').dialog(), actual = expected.dialog('open'); equal(actual, expected, 'open is chainable'); el = $('<div></div>').dialog({ autoOpen: false }); - ok(dlg().is(':hidden') && !dlg().is(':visible'), 'dialog hidden before open method called'); + ok(el.dialog('widget').is(':hidden') && !el.dialog('widget').is(':visible'), 'dialog hidden before open method called'); el.dialog('open'); - ok(dlg().is(':visible') && !dlg().is(':hidden'), 'dialog visible after open method called'); + ok(el.dialog('widget').is(':visible') && !el.dialog('widget').is(':hidden'), 'dialog visible after open method called'); }); })(jQuery); diff --git a/tests/unit/dialog/dialog_options.js b/tests/unit/dialog/dialog_options.js index 1c823868e..b6ff2dfc4 100644 --- a/tests/unit/dialog/dialog_options.js +++ b/tests/unit/dialog/dialog_options.js @@ -8,12 +8,12 @@ module("dialog: options"); test("autoOpen", function() { expect(2); - el = $('<div></div>').dialog({ autoOpen: false }); - TestHelpers.isNotOpen('.dialog({ autoOpen: false })'); + var el = $('<div></div>').dialog({ autoOpen: false }); + ok( !el.dialog("widget").is(":visible"), '.dialog({ autoOpen: false })'); el.remove(); el = $('<div></div>').dialog({ autoOpen: true }); - TestHelpers.isOpen('.dialog({ autoOpen: true })'); + ok( el.dialog("widget").is(":visible"), '.dialog({ autoOpen: true })'); el.remove(); }); @@ -22,20 +22,20 @@ test("buttons", function() { var btn, i, newButtons, buttons = { - "Ok": function( ev ) { - ok(true, "button click fires callback"); - equal(this, el[0], "context of callback"); - equal(ev.target, btn[0], "event target"); + "Ok": function( ev ) { + ok(true, "button click fires callback"); + equal(this, el[0], "context of callback"); + equal(ev.target, btn[0], "event target"); + }, + "Cancel": function( ev ) { + ok(true, "button click fires callback"); + equal(this, el[0], "context of callback"); + equal(ev.target, btn[1], "event target"); + } }, - "Cancel": function( ev ) { - ok(true, "button click fires callback"); - equal(this, el[0], "context of callback"); - equal(ev.target, btn[1], "event target"); - } - }; + el = $('<div></div>').dialog({ buttons: buttons }); - el = $('<div></div>').dialog({ buttons: buttons }); - btn = $("button", dlg()); + btn = $("button", el.dialog('widget')); equal(btn.length, 2, "number of buttons"); i = 0; @@ -61,7 +61,7 @@ test("buttons", function() { el.dialog("option", "buttons", newButtons); deepEqual(el.dialog("option", "buttons"), newButtons, '.dialog("option", "buttons", ...) setter'); - btn = $("button", dlg()); + btn = $("button", el.dialog('widget')); equal(btn.length, 1, "number of buttons after setter"); btn.trigger('click'); @@ -72,7 +72,7 @@ test("buttons", function() { }); el.dialog("option", "buttons", null); - btn = $("button", dlg()); + btn = $("button", el.dialog('widget')); equal(btn.length, 0, "all buttons have been removed"); equal(el.find(".ui-dialog-buttonset").length, 0, "buttonset has been removed"); equal(el.parent().hasClass('ui-dialog-buttons'), false, "dialog wrapper removes class about having buttons"); @@ -83,19 +83,21 @@ test("buttons", function() { test("buttons - advanced", function() { expect(5); - el = $("<div></div>").dialog({ - buttons: [ - { - text: "a button", - "class": "additional-class", - id: "my-button-id", - click: function() { - equal(this, el[0], "correct context"); + var buttons, + el = $("<div></div>").dialog({ + buttons: [ + { + text: "a button", + "class": "additional-class", + id: "my-button-id", + click: function() { + equal(this, el[0], "correct context"); + } } - } - ] - }); - var buttons = dlg().find("button"); + ] + }); + + buttons = el.dialog('widget').find("button"); equal(buttons.length, 1, "correct number of buttons"); equal(buttons.attr("id"), "my-button-id", "correct id"); equal(buttons.text(), "a button", "correct label"); @@ -107,40 +109,40 @@ test("buttons - advanced", function() { test("closeOnEscape", function() { expect( 6 ); - el = $('<div></div>').dialog({ closeOnEscape: false }); + var el = $('<div></div>').dialog({ closeOnEscape: false }); ok(true, 'closeOnEscape: false'); - ok(dlg().is(':visible') && !dlg().is(':hidden'), 'dialog is open before ESC'); + ok(el.dialog('widget').is(':visible') && !el.dialog('widget').is(':hidden'), 'dialog is open before ESC'); el.simulate('keydown', { keyCode: $.ui.keyCode.ESCAPE }) .simulate('keypress', { keyCode: $.ui.keyCode.ESCAPE }) .simulate('keyup', { keyCode: $.ui.keyCode.ESCAPE }); - ok(dlg().is(':visible') && !dlg().is(':hidden'), 'dialog is open after ESC'); + ok(el.dialog('widget').is(':visible') && !el.dialog('widget').is(':hidden'), 'dialog is open after ESC'); el.remove(); el = $('<div></div>').dialog({ closeOnEscape: true }); ok(true, 'closeOnEscape: true'); - ok(dlg().is(':visible') && !dlg().is(':hidden'), 'dialog is open before ESC'); + ok(el.dialog('widget').is(':visible') && !el.dialog('widget').is(':hidden'), 'dialog is open before ESC'); el.simulate('keydown', { keyCode: $.ui.keyCode.ESCAPE }) .simulate('keypress', { keyCode: $.ui.keyCode.ESCAPE }) .simulate('keyup', { keyCode: $.ui.keyCode.ESCAPE }); - ok(dlg().is(':hidden') && !dlg().is(':visible'), 'dialog is closed after ESC'); + ok(el.dialog('widget').is(':hidden') && !el.dialog('widget').is(':visible'), 'dialog is closed after ESC'); }); test("closeText", function() { expect(3); - el = $('<div></div>').dialog(); - equal(dlg().find('.ui-dialog-titlebar-close span').text(), 'close', + var el = $('<div></div>').dialog(); + equal(el.dialog('widget').find('.ui-dialog-titlebar-close span').text(), 'close', 'default close text'); el.remove(); el = $('<div></div>').dialog({ closeText: "foo" }); - equal(dlg().find('.ui-dialog-titlebar-close span').text(), 'foo', + equal(el.dialog('widget').find('.ui-dialog-titlebar-close span').text(), 'foo', 'closeText on init'); el.remove(); el = $('<div></div>').dialog().dialog('option', 'closeText', 'bar'); - equal(dlg().find('.ui-dialog-titlebar-close span').text(), 'bar', + equal(el.dialog('widget').find('.ui-dialog-titlebar-close span').text(), 'bar', 'closeText via option method'); el.remove(); }); @@ -148,131 +150,132 @@ test("closeText", function() { test("dialogClass", function() { expect(4); - el = $('<div></div>').dialog(); - equal(dlg().is(".foo"), false, 'dialogClass not specified. foo class added'); + var el = $('<div></div>').dialog(); + equal(el.dialog('widget').is(".foo"), false, 'dialogClass not specified. foo class added'); el.remove(); el = $('<div></div>').dialog({ dialogClass: "foo" }); - equal(dlg().is(".foo"), true, 'dialogClass in init. foo class added'); + equal(el.dialog('widget').is(".foo"), true, 'dialogClass in init. foo class added'); el.remove(); el = $('<div></div>').dialog({ dialogClass: "foo bar" }); - equal(dlg().is(".foo"), true, 'dialogClass in init, two classes. foo class added'); - equal(dlg().is(".bar"), true, 'dialogClass in init, two classes. bar class added'); + equal(el.dialog('widget').is(".foo"), true, 'dialogClass in init, two classes. foo class added'); + equal(el.dialog('widget').is(".bar"), true, 'dialogClass in init, two classes. bar class added'); el.remove(); }); test("draggable", function() { expect(4); - el = $('<div></div>').dialog({ draggable: false }); - TestHelpers.shouldnotmove(); + var el = $('<div></div>').dialog({ draggable: false }); + + TestHelpers.dialog.testDrag(el, 50, -50, 0, 0); el.dialog('option', 'draggable', true); - TestHelpers.shouldmove(); + TestHelpers.dialog.testDrag(el, 50, -50, 50, -50); el.remove(); el = $('<div></div>').dialog({ draggable: true }); - TestHelpers.shouldmove(); + TestHelpers.dialog.testDrag(el, 50, -50, 50, -50); el.dialog('option', 'draggable', false); - TestHelpers.shouldnotmove(); + TestHelpers.dialog.testDrag(el, 50, -50, 0, 0); el.remove(); }); test("height", function() { expect(4); - el = $('<div></div>').dialog(); - equal(dlg().outerHeight(), 150, "default height"); + var el = $('<div></div>').dialog(); + equal(el.dialog('widget').outerHeight(), 150, "default height"); el.remove(); el = $('<div></div>').dialog({ height: 237 }); - equal(dlg().outerHeight(), 237, "explicit height"); + equal(el.dialog('widget').outerHeight(), 237, "explicit height"); el.remove(); el = $('<div></div>').dialog(); el.dialog('option', 'height', 238); - equal(dlg().outerHeight(), 238, "explicit height set after init"); + equal(el.dialog('widget').outerHeight(), 238, "explicit height set after init"); el.remove(); el = $('<div></div>').css("padding", "20px") .dialog({ height: 240 }); - equal(dlg().outerHeight(), 240, "explicit height with padding"); + equal(el.dialog('widget').outerHeight(), 240, "explicit height with padding"); el.remove(); }); test("maxHeight", function() { expect(3); - el = $('<div></div>').dialog({ maxHeight: 200 }); - drag('.ui-resizable-s', 1000, 1000); - equal(heightAfter, 200, "maxHeight"); + var el = $('<div></div>').dialog({ maxHeight: 200 }); + TestHelpers.dialog.drag(el, '.ui-resizable-s', 1000, 1000); + equal(el.dialog('widget').height(), 200, "maxHeight"); el.remove(); el = $('<div></div>').dialog({ maxHeight: 200 }); - drag('.ui-resizable-n', -1000, -1000); - equal(heightAfter, 200, "maxHeight"); + TestHelpers.dialog.drag(el, '.ui-resizable-n', -1000, -1000); + equal(el.dialog('widget').height(), 200, "maxHeight"); el.remove(); el = $('<div></div>').dialog({ maxHeight: 200 }).dialog('option', 'maxHeight', 300); - drag('.ui-resizable-s', 1000, 1000); - equal(heightAfter, 300, "maxHeight"); + TestHelpers.dialog.drag(el, '.ui-resizable-s', 1000, 1000); + equal(el.dialog('widget').height(), 300, "maxHeight"); el.remove(); }); test("maxWidth", function() { expect(3); - el = $('<div></div>').dialog({ maxWidth: 200 }); - drag('.ui-resizable-e', 1000, 1000); - equal(widthAfter, 200, "maxWidth"); + var el = $('<div></div>').dialog({ maxWidth: 200 }); + TestHelpers.dialog.drag(el, '.ui-resizable-e', 1000, 1000); + equal(el.dialog('widget').width(), 200, "maxWidth"); el.remove(); el = $('<div></div>').dialog({ maxWidth: 200 }); - drag('.ui-resizable-w', -1000, -1000); - equal(widthAfter, 200, "maxWidth"); + TestHelpers.dialog.drag(el, '.ui-resizable-w', -1000, -1000); + equal(el.dialog('widget').width(), 200, "maxWidth"); el.remove(); el = $('<div></div>').dialog({ maxWidth: 200 }).dialog('option', 'maxWidth', 300); - drag('.ui-resizable-w', -1000, -1000); - equal(widthAfter, 300, "maxWidth"); + TestHelpers.dialog.drag(el, '.ui-resizable-w', -1000, -1000); + equal(el.dialog('widget').width(), 300, "maxWidth"); el.remove(); }); test("minHeight", function() { expect(3); - el = $('<div></div>').dialog({ minHeight: 10 }); - drag('.ui-resizable-s', -1000, -1000); - equal(heightAfter, 10, "minHeight"); + var el = $('<div></div>').dialog({ minHeight: 10 }); + TestHelpers.dialog.drag(el, '.ui-resizable-s', -1000, -1000); + equal(el.dialog('widget').height(), 10, "minHeight"); el.remove(); el = $('<div></div>').dialog({ minHeight: 10 }); - drag('.ui-resizable-n', 1000, 1000); - equal(heightAfter, 10, "minHeight"); + TestHelpers.dialog.drag(el, '.ui-resizable-n', 1000, 1000); + equal(el.dialog('widget').height(), 10, "minHeight"); el.remove(); el = $('<div></div>').dialog({ minHeight: 10 }).dialog('option', 'minHeight', 30); - drag('.ui-resizable-n', 1000, 1000); - equal(heightAfter, 30, "minHeight"); + TestHelpers.dialog.drag(el, '.ui-resizable-n', 1000, 1000); + equal(el.dialog('widget').height(), 30, "minHeight"); el.remove(); }); test("minWidth", function() { expect(3); - el = $('<div></div>').dialog({ minWidth: 10 }); - drag('.ui-resizable-e', -1000, -1000); - equal(widthAfter, 10, "minWidth"); + var el = $('<div></div>').dialog({ minWidth: 10 }); + TestHelpers.dialog.drag(el, '.ui-resizable-e', -1000, -1000); + equal(el.dialog('widget').width(), 10, "minWidth"); el.remove(); el = $('<div></div>').dialog({ minWidth: 10 }); - drag('.ui-resizable-w', 1000, 1000); - equal(widthAfter, 10, "minWidth"); + TestHelpers.dialog.drag(el, '.ui-resizable-w', 1000, 1000); + equal(el.dialog('widget').width(), 10, "minWidth"); el.remove(); el = $('<div></div>').dialog({ minWidth: 30 }).dialog('option', 'minWidth', 30); - drag('.ui-resizable-w', 1000, 1000); - equal(widthAfter, 30, "minWidth"); + TestHelpers.dialog.drag(el, '.ui-resizable-w', 1000, 1000); + equal(el.dialog('widget').width(), 30, "minWidth"); el.remove(); }); @@ -394,16 +397,16 @@ test("position, at another element", function() { test("resizable", function() { expect(4); - el = $('<div></div>').dialog(); - TestHelpers.shouldresize("[default]"); + var el = $('<div></div>').dialog(); + TestHelpers.dialog.shouldResize(el, 50, 50, "[default]"); el.dialog('option', 'resizable', false); - TestHelpers.shouldnotresize('disabled after init'); + TestHelpers.dialog.shouldResize(el, 0, 0, 'disabled after init'); el.remove(); el = $('<div></div>').dialog({ resizable: false }); - TestHelpers.shouldnotresize("disabled in init options"); + TestHelpers.dialog.shouldResize(el, 0, 0, "disabled in init options"); el.dialog('option', 'resizable', true); - TestHelpers.shouldresize('enabled after init'); + TestHelpers.dialog.shouldResize(el, 50, 50, 'enabled after init'); el.remove(); }); @@ -411,13 +414,13 @@ test("title", function() { expect(9); function titleText() { - return dlg().find(".ui-dialog-title").html(); + return el.dialog('widget').find(".ui-dialog-title").html(); } - el = $('<div></div>').dialog(); + var el = $('<div></div>').dialog(); // some browsers return a non-breaking space and some return " " // so we get the text to normalize to the actual non-breaking space - equal(dlg().find(".ui-dialog-title").text(), " ", "[default]"); + equal(el.dialog('widget').find(".ui-dialog-title").text(), " ", "[default]"); equal(el.dialog("option", "title"), "", "option not changed"); el.remove(); @@ -444,14 +447,14 @@ test("title", function() { test("width", function() { expect(3); - el = $('<div></div>').dialog(); - equal(dlg().width(), 300, "default width"); + var el = $('<div></div>').dialog(); + equal(el.dialog('widget').width(), 300, "default width"); el.remove(); el = $('<div></div>').dialog({width: 437 }); - equal(dlg().width(), 437, "explicit width"); + equal(el.dialog('widget').width(), 437, "explicit width"); el.dialog('option', 'width', 438); - equal(dlg().width(), 438, 'explicit width after init'); + equal(el.dialog('widget').width(), 438, 'explicit width after init'); el.remove(); }); diff --git a/tests/unit/dialog/dialog_test_helpers.js b/tests/unit/dialog/dialog_test_helpers.js new file mode 100644 index 000000000..bbf43f48f --- /dev/null +++ b/tests/unit/dialog/dialog_test_helpers.js @@ -0,0 +1,45 @@ +TestHelpers.dialog = { + drag: function(el, handle, dx, dy) { + var d = el.dialog('widget'); + //this mouseover is to work around a limitation in resizable + //TODO: fix resizable so handle doesn't require mouseover in order to be used + $(handle, d).simulate("mouseover"); + $(handle, d).simulate("drag", { + dx: dx || 0, + dy: dy || 0 + }); + }, + testDrag: function(el, dx, dy, expectedDX, expectedDY, msg) { + var actual, expected, offsetAfter, + d = el.dialog('widget'), + handle = $(".ui-dialog-titlebar", d), + offsetBefore = d.offset(); + + TestHelpers.dialog.drag(el, handle, dx, dy); + + offsetAfter = d.offset(); + + msg = msg ? msg + "." : ""; + + actual = { left: Math.round(offsetAfter.left), top: Math.round(offsetAfter.top) }, + expected = { left: Math.round(offsetBefore.left + expectedDX), top: Math.round(offsetBefore.top + expectedDY) }; + deepEqual(actual, expected, 'dragged[' + expectedDX + ', ' + expectedDY + '] ' + msg); + }, + shouldResize: function(el, dw, dh, msg) { + var heightAfter, widthAfter, actual, expected, + d = el.dialog('widget'), + handle = $(".ui-resizable-se", d), + heightBefore = d.height(), + widthBefore = d.width(); + + TestHelpers.dialog.drag(el, handle, 50, 50); + + heightAfter = d.height(); + widthAfter = d.width(); + + msg = msg ? msg + "." : ""; + actual = { width: widthAfter, height: heightAfter }, + expected = { width: widthBefore + dw, height: heightBefore + dh }; + deepEqual(actual, expected, 'resized[' + 50 + ', ' + 50 + '] ' + msg); + } +};
\ No newline at end of file diff --git a/tests/unit/dialog/dialog_tickets.js b/tests/unit/dialog/dialog_tickets.js index 2b0214718..3055c5fc1 100644 --- a/tests/unit/dialog/dialog_tickets.js +++ b/tests/unit/dialog/dialog_tickets.js @@ -36,21 +36,21 @@ asyncTest( "#3123: Prevent tabbing out of modal dialogs", function() { test("#4826: setting resizable false toggles resizable on dialog", function() { expect(6); - var i; + var i, + el = $('<div></div>').dialog({ resizable: false }); - el = $('<div></div>').dialog({ resizable: false }); - TestHelpers.shouldnotresize("[default]"); + TestHelpers.dialog.shouldResize(el, 0, 0, "[default]"); for (i=0; i<2; i++) { el.dialog('close').dialog('open'); - TestHelpers.shouldnotresize('initialized with resizable false toggle ('+ (i+1) +')'); + TestHelpers.dialog.shouldResize(el, 0, 0, 'initialized with resizable false toggle ('+ (i+1) +')'); } el.remove(); el = $('<div></div>').dialog({ resizable: true }); - TestHelpers.shouldresize("[default]"); + TestHelpers.dialog.shouldResize(el, 50, 50, "[default]"); for (i=0; i<2; i++) { el.dialog('close').dialog('option', 'resizable', false).dialog('open'); - TestHelpers.shouldnotresize('set option resizable false toggle ('+ (i+1) +')'); + TestHelpers.dialog.shouldResize(el, 0, 0, 'set option resizable false toggle ('+ (i+1) +')'); } el.remove(); @@ -59,11 +59,11 @@ test("#4826: setting resizable false toggles resizable on dialog", function() { test("#5184: isOpen in dialogclose event is true", function() { expect( 3 ); - el = $( "<div></div>" ).dialog({ - close: function() { - ok( !el.dialog("isOpen"), "dialog is not open during close" ); - } - }); + var el = $( "<div></div>" ).dialog({ + close: function() { + ok( !el.dialog("isOpen"), "dialog is not open during close" ); + } + }); ok( el.dialog("isOpen"), "dialog is open after init" ); el.dialog( "close" ); ok( !el.dialog("isOpen"), "dialog is not open after close" ); @@ -72,7 +72,7 @@ test("#5184: isOpen in dialogclose event is true", function() { test("#5531: dialog width should be at least minWidth on creation", function () { expect( 4 ); - el = $('<div></div>').dialog({ + var el = $('<div></div>').dialog({ width: 200, minWidth: 300 }); @@ -95,7 +95,7 @@ test("#5531: dialog width should be at least minWidth on creation", function () test("#6137: dialog('open') causes form elements to reset on IE7", function() { expect(2); - d1 = $('<form><input type="radio" name="radio" id="a" value="a" checked="checked"></input>' + + var d1 = $('<form><input type="radio" name="radio" id="a" value="a" checked="checked"></input>' + '<input type="radio" name="radio" id="b" value="b">b</input></form>').appendTo( "body" ).dialog({autoOpen: false}); d1.find('#b').prop( "checked", true ); @@ -109,8 +109,9 @@ test("#6137: dialog('open') causes form elements to reset on IE7", function() { test("#6645: Missing element not found check in overlay", function(){ expect(2); - d1 = $('<div title="dialog 1">Dialog 1</div>').dialog({modal: true}); - d2 = $('<div title="dialog 2">Dialog 2</div>').dialog({modal: true, close: function(){ d2.remove(); }}); + var d1 = $('<div title="dialog 1">Dialog 1</div>').dialog({modal: true}), + d2 = $('<div title="dialog 2">Dialog 2</div>').dialog({modal: true, close: function(){ d2.remove(); }}); + equal($.ui.dialog.overlay.instances.length, 2, 'two overlays created'); d2.dialog('close'); equal($.ui.dialog.overlay.instances.length, 1, 'one overlay remains after closing the 2nd overlay'); @@ -119,8 +120,8 @@ test("#6645: Missing element not found check in overlay", function(){ test("#4980: Destroy should place element back in original DOM position", function(){ expect( 2 ); - container = $('<div id="container"><div id="modal">Content</div></div>'); - modal = container.find('#modal'); + var container = $('<div id="container"><div id="modal">Content</div></div>'), + modal = container.find('#modal'); modal.dialog(); ok(!$.contains(container[0], modal[0]), 'dialog should move modal element to outside container element'); modal.dialog('destroy'); |