]> source.dussan.org Git - jquery-ui.git/commitdiff
tests dialog - added some tests and placeholders
authorRichard Worth <rdworth@gmail.com>
Sat, 21 Jun 2008 13:54:41 +0000 (13:54 +0000)
committerRichard Worth <rdworth@gmail.com>
Sat, 21 Jun 2008 13:54:41 +0000 (13:54 +0000)
tests/dialog.js
tests/draggable.js

index 7520fe8b712e51feb61a100add0a118288e51c10..7cd6921a8ed1dbebeda54e2b9e7c62368aacac22 100644 (file)
@@ -6,6 +6,26 @@
 // Dialog Test Helper Functions\r
 //\r
 \r
+var defaults = {\r
+       autoOpen: true,\r
+       buttons: {},\r
+       disabled: false,\r
+       dialogClass: null,\r
+       draggable: true,\r
+       height: 200,\r
+       maxHeight: null,\r
+       maxWidth: null,\r
+       minHeight: 100,\r
+       minWidth: 150,\r
+       modal: false,\r
+       overlay: {},\r
+       position: 'center',\r
+       resizable: true,\r
+       stack: true,\r
+       title: null,\r
+       width: 300\r
+};\r
+\r
 var el,\r
        offsetBefore, offsetAfter,\r
        heightBefore, heightAfter,\r
@@ -29,6 +49,9 @@ var drag = function(handle, dx, dy) {
        offsetBefore = d.offset();\r
        heightBefore = d.height();\r
        widthBefore = d.width();\r
+       //this mouseover is to work around a limitation in resizable\r
+       //TODO: fix resizable so handle doesn't require mouseover in order to be used\r
+       $(handle, d).simulate("mouseover");\r
        $(handle, d).simulate("drag", {\r
                dx: dx || 0,\r
                dy: dy || 0\r
@@ -39,10 +62,10 @@ var drag = function(handle, dx, dy) {
        widthAfter = d.width();\r
 }\r
 \r
-var moved = function (dx, dy, msg) {\r
+var moved = function(dx, dy, msg) {\r
        msg = msg ? msg + "." : "";\r
        var actual = { left: offsetAfter.left, top: offsetAfter.top };\r
-       var expected = { left: offsetBefore.left + dx, top: offsetAfter.top };\r
+       var expected = { left: offsetBefore.left + dx, top: offsetBefore.top + dy };\r
        compare2(actual, expected, 'dragged[' + dragged.dx + ', ' + dragged.dy + '] ' + msg);\r
 }\r
 \r
@@ -58,6 +81,25 @@ function shouldnotmove(why) {
        moved(0, 0, why);\r
 }\r
 \r
+var resized = function(dw, dh, msg) {\r
+       msg = msg ? msg + "." : "";\r
+       var actual = { width: widthAfter, height: heightAfter };\r
+       var expected = { width: widthBefore + dw, height: heightBefore + dh };\r
+       compare2(actual, expected, 'resized[' + dragged.dx + ', ' + dragged.dy + '] ' + msg);\r
+}\r
+\r
+function shouldresize(why) {\r
+       var handle = $(".ui-resizable-se", dlg());\r
+       drag(handle, 50, 50);\r
+       resized(50, 50, why);\r
+}\r
+\r
+function shouldnotresize(why) {\r
+       var handle = $(".ui-resizable-se", dlg());\r
+       drag(handle, 50, 50);\r
+       resized(0, 0, why);\r
+}\r
+\r
 var border = function(el, side) { return parseInt(el.css('border-' + side + '-width')); }\r
 \r
 var margin = function(el, side) { return parseInt(el.css('margin-' + side)); }\r
@@ -74,18 +116,18 @@ test("init", function() {
        $([]).dialog().remove();\r
        ok(true, '.dialog() called on empty collection');\r
 \r
-       $("<div/>").dialog().remove();\r
+       $('<div/>').dialog().remove();\r
        ok(true, '.dialog() called on disconnected DOMElement');\r
 \r
-       $("<div/>").dialog().dialog("foo").remove();\r
+       $('<div/>').dialog().dialog("foo").remove();\r
        ok(true, 'arbitrary method called after init');\r
 \r
-       el = $("<div/>").dialog()\r
+       el = $('<div/>').dialog()\r
        var foo = el.data("foo.dialog");\r
        el.remove();\r
        ok(true, 'arbitrary option getter after init');\r
 \r
-       $("<div/>").dialog().data("foo.dialog", "bar").remove();\r
+       $('<div/>').dialog().data("foo.dialog", "bar").remove();\r
        ok(true, 'arbitrary option setter after init');\r
 });\r
 \r
@@ -98,18 +140,18 @@ test("destroy", function() {
        $([]).dialog().dialog("destroy").remove();\r
        ok(true, '.dialog("destroy") called on empty collection');\r
 \r
-       $("<div/>").dialog().dialog("destroy").remove();\r
+       $('<div/>').dialog().dialog("destroy").remove();\r
        ok(true, '.dialog("destroy") called on disconnected DOMElement');\r
 \r
-       $("<div/>").dialog().dialog("destroy").dialog("foo").remove();\r
+       $('<div/>').dialog().dialog("destroy").dialog("foo").remove();\r
        ok(true, 'arbitrary method called after destroy');\r
 \r
-       el = $("<div/>").dialog();\r
+       el = $('<div/>').dialog();\r
        var foo = el.dialog("destroy").data("foo.dialog");\r
        el.remove();\r
        ok(true, 'arbitrary option getter after destroy');\r
 \r
-       $("<div/>").dialog().dialog("destroy").data("foo.dialog", "bar").remove();\r
+       $('<div/>').dialog().dialog("destroy").data("foo.dialog", "bar").remove();\r
        ok(true, 'arbitrary option setter after destroy');\r
 });\r
 \r
@@ -137,24 +179,6 @@ test("element types", function() {
 \r
 test("defaults", function() {\r
        el = $('<div/>').dialog();\r
-       var defaults = {\r
-               autoOpen: true,\r
-               buttons: {},\r
-               disabled: false,\r
-               draggable: true,\r
-               height: 200,\r
-               maxHeight: null,\r
-               maxWidth: null,\r
-               minHeight: 100,\r
-               minWidth: 150,\r
-               modal: false,\r
-               overlay: {},\r
-               position: 'center',\r
-               resizable: true,\r
-               stack: true,\r
-               title: null,\r
-               width: 300\r
-       };\r
        $.each(defaults, function(key, val) {\r
                var actual = el.data(key + ".dialog"), expected = val,\r
                        method = (expected && expected.constructor == Object) ?\r
@@ -168,18 +192,16 @@ module("dialog: Options");
 \r
 test("autoOpen", function() {\r
        expect(2);\r
-\r
-       el = $("<div/>").dialog({ autoOpen: false });\r
-       isNotOpen('.dialog({ autoOpen: false })');\r
+       el = $('<div/>').dialog({ autoOpen: false });\r
+               isNotOpen('.dialog({ autoOpen: false })');\r
        el.remove();\r
-\r
-       el = $("<div/>").dialog({ autoOpen: true });\r
-       isOpen('.dialog({ autoOpen: true })');\r
+       el = $('<div/>').dialog({ autoOpen: true });\r
+               isOpen('.dialog({ autoOpen: true })');\r
        el.remove();\r
 });\r
 \r
 test("buttons", function() {\r
-       expect(10);\r
+       expect(14);\r
        var buttons = {\r
                "Ok": function(ev, ui) {\r
                        ok(true, "button click fires callback");\r
@@ -192,7 +214,7 @@ test("buttons", function() {
                        equals(ev.target, btn[1], "event target");\r
                }\r
        }\r
-       el = $("<div/>").dialog({ buttons: buttons });\r
+       el = $('<div/>').dialog({ buttons: buttons });\r
        var btn = $("button", dlg());\r
        equals(btn.length, 2, "number of buttons");\r
        var i = 0;\r
@@ -202,68 +224,153 @@ test("buttons", function() {
        });\r
        equals(btn.parent().attr('className'), 'ui-dialog-buttonpane', "buttons in container");\r
        btn.trigger("click");\r
+\r
+       var newButtons = {\r
+               "Close": function() {}\r
+       }\r
+\r
+       equals(el.data("buttons.dialog"), buttons, '.data("buttons.dialog") getter');\r
+       el.data("buttons.dialog", newButtons);\r
+       equals(el.data("buttons.dialog"), newButtons, '.data("buttons.dialog", ...) setter');\r
+\r
+       btn = $("button", dlg());\r
+       equals(btn.length, 1, "number of buttons after setter");\r
+       var i = 0;\r
+       $.each(newButtons, function(key, val) {\r
+               equals(btn.eq(i).text(), key, "text of button " + (i+1));\r
+               i += 1;\r
+       });\r
+\r
+       el.remove();\r
+});\r
+\r
+test("dialogClass", function() {\r
+       expect(4);\r
+       el = $('<div/>').dialog();\r
+               equals(dlg().is(".foo"), false, 'dialogClass not specified. foo class added');\r
+       el.remove();\r
+       el = $('<div/>').dialog({ dialogClass: "foo" });\r
+               equals(dlg().is(".foo"), true, 'dialogClass in init. foo class added');\r
+       el.remove();\r
+       el = $('<div/>').dialog({ dialogClass: "foo bar" });\r
+               equals(dlg().is(".foo"), true, 'dialogClass in init, two classes. foo class added');\r
+               equals(dlg().is(".bar"), true, 'dialogClass in init, two classes. bar class added');\r
        el.remove();\r
 });\r
 \r
 test("draggable", function() {\r
-       el = $("<div/>").dialog({ draggable: false });\r
-       shouldnotmove();\r
+       expect(2);\r
+       el = $('<div/>').dialog({ draggable: false });\r
+               shouldnotmove();\r
        el.remove();\r
-       el = $("<div/>").dialog({ draggable: true });\r
-       shouldmove();\r
+       el = $('<div/>').dialog({ draggable: true });\r
+               shouldmove();\r
        el.remove();\r
 });\r
 \r
 test("height", function() {\r
-       el = $("<div/>").dialog();\r
-       equals(dlg().height(), 200, "default height");\r
+       expect(2);\r
+       el = $('<div/>').dialog();\r
+               equals(dlg().height(), defaults.height, "default height");\r
        el.remove();\r
-       el = $("<div/>").dialog({ height: 437 });\r
-       equals(dlg().height(), 437, "default height");\r
+       el = $('<div/>').dialog({ height: 437 });\r
+               equals(dlg().height(), 437, "explicit height");\r
        el.remove();\r
 });\r
 \r
 test("maxHeight", function() {\r
-       el = $("<div/>").dialog({ maxHeight: 400 });\r
-       drag('.ui-resizable-s', 1000, 1000);\r
-       equals(heightAfter, 400, "maxHeight");\r
+       expect(2);\r
+       el = $('<div/>').dialog({ maxHeight: 400 });\r
+               drag('.ui-resizable-s', 1000, 1000);\r
+               equals(heightAfter, 400, "maxHeight");\r
        el.remove();\r
-       el = $("<div/>").dialog({ maxHeight: 400 });\r
-       drag('.ui-resizable-n', -1000, -1000);\r
-       equals(heightAfter, 400, "maxHeight");\r
+       el = $('<div/>').dialog({ maxHeight: 400 });\r
+               drag('.ui-resizable-n', -1000, -1000);\r
+               equals(heightAfter, 400, "maxHeight");\r
        el.remove();\r
 });\r
 \r
 test("maxWidth", function() {\r
-       el = $("<div/>").dialog({ maxWidth: 400 });\r
-       drag('.ui-resizable-e', 1000, 1000);\r
-       equals(widthAfter, 400, "maxWidth");\r
+       expect(2);\r
+       el = $('<div/>').dialog({ maxWidth: 400 });\r
+               drag('.ui-resizable-e', 1000, 1000);\r
+               equals(widthAfter, 400, "maxWidth");\r
        el.remove();\r
-       el = $("<div/>").dialog({ maxWidth: 400 });\r
-       drag('.ui-resizable-w', -1000, -1000);\r
-       equals(widthAfter, 400, "maxWidth");\r
+       el = $('<div/>').dialog({ maxWidth: 400 });\r
+               drag('.ui-resizable-w', -1000, -1000);\r
+               equals(widthAfter, 400, "maxWidth");\r
        el.remove();\r
 });\r
 \r
 test("minHeight", function() {\r
-       el = $("<div/>").dialog({ minHeight: 10 });\r
-       drag('.ui-resizable-s', -1000, -1000);\r
-       equals(heightAfter, 10, "minHeight");\r
+       expect(2);\r
+       el = $('<div/>').dialog({ minHeight: 10 });\r
+               drag('.ui-resizable-s', -1000, -1000);\r
+               equals(heightAfter, 10, "minHeight");\r
        el.remove();\r
-       el = $("<div/>").dialog({ minHeight: 10 });\r
-       drag('.ui-resizable-n', 1000, 1000);\r
-       equals(heightAfter, 10, "minHeight");\r
+       el = $('<div/>').dialog({ minHeight: 10 });\r
+               drag('.ui-resizable-n', 1000, 1000);\r
+               equals(heightAfter, 10, "minHeight");\r
        el.remove();\r
 });\r
 \r
 test("minWidth", function() {\r
-       el = $("<div/>").dialog({ minWidth: 10 });\r
-       drag('.ui-resizable-e', -1000, -1000);\r
-       equals(widthAfter, 10, "minWidth");\r
+       expect(2);\r
+       el = $('<div/>').dialog({ minWidth: 10 });\r
+               drag('.ui-resizable-e', -1000, -1000);\r
+               equals(widthAfter, 10, "minWidth");\r
+       el.remove();\r
+       el = $('<div/>').dialog({ minWidth: 10 });\r
+               drag('.ui-resizable-w', 1000, 1000);\r
+               equals(widthAfter, 10, "minWidth");\r
+       el.remove();\r
+});\r
+\r
+test("modal", function() {\r
+       ok(false, "missing test");\r
+});\r
+\r
+test("overlay", function() {\r
+       ok(false, "missing test");\r
+});\r
+\r
+test("position", function() {\r
+       ok(false, "missing test");\r
+});\r
+\r
+test("resizable", function() {\r
+       expect(2);\r
+       el = $('<div/>').dialog();\r
+               shouldresize("[default]");\r
+       el.remove();\r
+       el = $('<div/>').dialog({ resizable: false });\r
+               shouldnotresize("disabled in init options");\r
+       el.remove();\r
+       \r
+});\r
+\r
+test("stack", function() {\r
+       ok(false, "missing test");\r
+});\r
+\r
+test("title", function() {\r
+       expect(4);\r
+       function titleText() {\r
+               return dlg().find(".ui-dialog-title").text();\r
+       }\r
+       el = $('<div/>').dialog(); equals(titleText(), "", "[default]"); el.remove();\r
+       el = $('<div title="foo"/>').dialog(); equals(titleText(), "foo", "title in element attribute"); el.remove();\r
+       el = $('<div/>').dialog({ title: 'foo' }); equals(titleText(), "foo", "title in init options"); el.remove();\r
+       el = $('<div title="foo"/>').dialog({ title: 'bar' }); equals(titleText(), "bar", "title in init options should override title in element attribute"); el.remove();\r
+});\r
+\r
+test("width", function() {\r
+       expect(2);\r
+       el = $('<div/>').dialog();\r
+               equals(dlg().width(), defaults.width, "default width");\r
        el.remove();\r
-       el = $("<div/>").dialog({ minWidth: 10 });\r
-       drag('.ui-resizable-w', 1000, 1000);\r
-       equals(widthAfter, 10, "minWidth");\r
+       el = $('<div/>').dialog({width: 437 });\r
+               equals(dlg().width(), 437, "explicit width");\r
        el.remove();\r
 });\r
 \r
@@ -297,7 +404,7 @@ test("open", function() {
 \r
 test("close", function() {\r
        expect(2);\r
-       el = $("<div/>").dialog({\r
+       el = $('<div/>').dialog({\r
                close: function(ev, ui) {\r
                        ok(true, '.dialog("close") fires close callback');\r
                        equals(this, el[0], "context of callback");\r
index 064ec074cc8dd76d9ce1d52541b8a316646d9c7c..fe22cdcfbc31bf286506ebb6ca6bbbcc3cbf8e56 100644 (file)
@@ -21,7 +21,7 @@ var drag = function(handle, dx, dy) {
 var moved = function (dx, dy, msg) {
        msg = msg ? msg + "." : "";
        var actual = { left: offsetAfter.left, top: offsetAfter.top };
-       var expected = { left: offsetBefore.left + dx, top: offsetAfter.top };
+       var expected = { left: offsetBefore.left + dx, top: offsetBefore.top + dy };
        compare2(actual, expected, 'dragged[' + dragged.dx + ', ' + dragged.dy + '] ' + msg);
 }