colonymech / docs / www / colonyscout / internal / jeditable / tests / index.html @ f59acf11
History | View | Annotate | Download (7.21 KB)
| 1 |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
|---|---|
| 2 |
"http://www.w3.org/TR/html4/loose.dtd">
|
| 3 |
<html>
|
| 4 |
<head>
|
| 5 |
<title>Jeditable Unit Tests</title> |
| 6 |
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript" charset="utf-8"></script> |
| 7 |
<link rel="stylesheet" href="testsuite.css" type="text/css" media="screen" /> |
| 8 |
<script type="text/javascript" src="testrunner.js"></script> |
| 9 |
<script type="text/javascript" src="../jquery.jeditable.js"></script> |
| 10 |
<script>
|
| 11 |
$(document).ready(function() {
|
| 12 |
|
| 13 |
//window.loadFirebugConsole();
|
| 14 |
/* We need synchronous AJAX for testing. */
|
| 15 |
$.ajaxSetup({
|
| 16 |
async : false
|
| 17 |
});
|
| 18 |
$("#post").editable("method.php", {
|
| 19 |
loadurl : "load.php",
|
| 20 |
type : "textarea",
|
| 21 |
cols : 50,
|
| 22 |
rows : 5,
|
| 23 |
tooltip : "Tooltip",
|
| 24 |
submit : "OK",
|
| 25 |
cancel : "Cancel",
|
| 26 |
style : "inherit",
|
| 27 |
cssclass : "inherit",
|
| 28 |
event : "click",
|
| 29 |
onblur : "cancel"
|
| 30 |
});
|
| 31 |
$("#put").editable("method.php", {
|
| 32 |
method : "PUT",
|
| 33 |
data : "Parameter content",
|
| 34 |
tooltip : "Tooltip",
|
| 35 |
submit : "OK",
|
| 36 |
style : "margin-top: 27px",
|
| 37 |
cssclass : "bar",
|
| 38 |
event : "dblclick",
|
| 39 |
submit : "<i>Click to submit</i>",
|
| 40 |
onblur : "ignore"
|
| 41 |
});
|
| 42 |
$("#placeholder").editable("echo.php", {
|
| 43 |
placeholder : "PLACEHOLDER",
|
| 44 |
width : 200,
|
| 45 |
height : 20,
|
| 46 |
tooltip : "Tooltip",
|
| 47 |
submit : "OK",
|
| 48 |
event : "edit",
|
| 49 |
onblur : "submit"
|
| 50 |
});
|
| 51 |
$("#select").editable("echo.php", {
|
| 52 |
type : "select",
|
| 53 |
data : "{'a':'Select A', 'b':'Select B', 'c':'Select C'}",
|
| 54 |
tooltip : "Tooltip",
|
| 55 |
submit : "OK",
|
| 56 |
event : "click"
|
| 57 |
});
|
| 58 |
$("#callback").editable("echo.php", {
|
| 59 |
callback : function() {
|
| 60 |
$(this).html("Dragons begone.");
|
| 61 |
}
|
| 62 |
});
|
| 63 |
$("#function").editable(function(value, settings) {
|
| 64 |
return value;
|
| 65 |
}, {
|
| 66 |
submit : "OK"
|
| 67 |
});
|
| 68 |
|
| 69 |
module("CORE");
|
| 70 |
|
| 71 |
test("Event triggers", function() {
|
| 72 |
$("#post").trigger("click");
|
| 73 |
ok($("#post form").size() == 1, "Click event should trigger Jeditable.");
|
| 74 |
$("#post form").submit();
|
| 75 |
ok($("#post form").size() == 0, "After submit should go back to normal.");
|
| 76 |
|
| 77 |
$("#placeholder").trigger("edit");
|
| 78 |
ok($("#placeholder form").size() == 1, "Edit event should trigger Jeditable.");
|
| 79 |
$("#placeholder form").submit();
|
| 80 |
ok($("#placeholder form").size() == 0, "After submit should go back to normal.");
|
| 81 |
|
| 82 |
$("#put").trigger("dblclick");
|
| 83 |
ok($("#put form").size() == 1, "Dblclick event should trigger Jeditable.");
|
| 84 |
$("#put form").submit();
|
| 85 |
ok($("#put form").size() == 0, "After submit should go back to normal.");
|
| 86 |
});
|
| 87 |
|
| 88 |
test("Default input types", function() {
|
| 89 |
$("#post").trigger("click");
|
| 90 |
equals($("#post :input:first").attr("type"), "textarea", "Should be textarea");
|
| 91 |
equals($("#post :input:first").attr("cols"), 50, "Columns should be 50");
|
| 92 |
equals($("#post :input:first").attr("rows"), 5, "Rows should be 5");
|
| 93 |
|
| 94 |
$("#placeholder").trigger("edit");
|
| 95 |
equals($("#placeholder :input:first").attr("type"), "text", "Should be text");
|
| 96 |
equals($("#placeholder :input:first").width(), 200, "Width should be 200");
|
| 97 |
equals($("#placeholder :input:first").height(), 20, "Height should be 20");
|
| 98 |
$("#placeholder form").submit();
|
| 99 |
|
| 100 |
$("#select").trigger("click");
|
| 101 |
equals($("#select :input:first").attr("type"), "select-one", "Should be select-one");
|
| 102 |
equals($("#select :selected").html(), "Select B", "Should be Select B");
|
| 103 |
$("#select form").submit();
|
| 104 |
});
|
| 105 |
|
| 106 |
test("Target", function() {
|
| 107 |
$("#function").trigger("click");
|
| 108 |
$("#function :input:first").val("Pacman");
|
| 109 |
$("#function form").submit();
|
| 110 |
equals($("#function").html(), "Pacman", 'Target function returns Pacman');
|
| 111 |
});
|
| 112 |
|
| 113 |
test("Onblur events", function() {
|
| 114 |
/* How to work around timeout problem? */
|
| 115 |
});
|
| 116 |
|
| 117 |
test("Default content", function() {
|
| 118 |
$("#post").trigger("click");
|
| 119 |
equals($("#post :input:first").val(), "External content", "Should be external content");
|
| 120 |
$("#put").trigger("dblclick");
|
| 121 |
equals($("#put :input:first").val(), "Parameter content", "Should be parameter content");
|
| 122 |
});
|
| 123 |
|
| 124 |
test("Tooltip", function() {
|
| 125 |
equals($("#post").attr("title"), "Tooltip", "Should be tooltip.");
|
| 126 |
equals($("#put").attr("title"), "Tooltip", "Should be tooltip.");
|
| 127 |
equals($("#select").attr("title"), "Tooltip", "Should be tooltip.");
|
| 128 |
});
|
| 129 |
|
| 130 |
test("Select", function() {
|
| 131 |
/* How to access selection? */
|
| 132 |
});
|
| 133 |
|
| 134 |
test("Style", function() {
|
| 135 |
$("#post").trigger("click");
|
| 136 |
equals($("#post form").css("display"), "inline", "Should inherit inline");
|
| 137 |
$("#put").trigger("click");
|
| 138 |
equals($("#put form").css("margin-top"), "27px", "Should be 27px");
|
| 139 |
});
|
| 140 |
|
| 141 |
test("CSS class", function() {
|
| 142 |
$("#post").trigger("click");
|
| 143 |
ok($("#post form").hasClass("foo"), "Should inherit class foo.");
|
| 144 |
$("#put").trigger("click");
|
| 145 |
ok($("#put form").hasClass("bar"), "Should have class bar.");
|
| 146 |
});
|
| 147 |
|
| 148 |
test("Buttons", function() {
|
| 149 |
$("#post").trigger("click");
|
| 150 |
ok($("#post button[type=submit]").size() == 1, "Should have submit button.");
|
| 151 |
ok($("#post button").size() == 2, "Should have cancel button too.");
|
| 152 |
$("#put").trigger("click");
|
| 153 |
$("#put form i").html();
|
| 154 |
$("#put form i").trigger("click");
|
| 155 |
});
|
| 156 |
|
| 157 |
test("Placeholder", function() {
|
| 158 |
equals($("#placeholder").html(), "PLACEHOLDER", "Should be PLACEHOLDER");
|
| 159 |
$("#placeholder").trigger("edit");
|
| 160 |
equals($("#placeholder input").html(), "", "Should be empty");
|
| 161 |
$("#placeholder form").submit();
|
| 162 |
equals($("#placeholder").html(), "PLACEHOLDER", "Should be PLACEHOLDER");
|
| 163 |
|
| 164 |
$("#placeholder").trigger("edit");
|
| 165 |
$("#placeholder input").val("NEW VALUE");
|
| 166 |
$("#placeholder form").submit();
|
| 167 |
equals($("#placeholder").html(), "NEW VALUE", "Should be PLACEHOLDER");
|
| 168 |
});
|
| 169 |
|
| 170 |
test("Callback", function() {
|
| 171 |
$("#callback").trigger("click");
|
| 172 |
$("#callback form").trigger("submit");
|
| 173 |
equals($("#callback").html(), "Dragons begone.", "Dragons should be gone");
|
| 174 |
});
|
| 175 |
|
| 176 |
module("AJAH");
|
| 177 |
test("Submit methods", function() {
|
| 178 |
$("#post").click();
|
| 179 |
$("#post form").submit();
|
| 180 |
equals($("#post").html(), "POST", "Should be POST");
|
| 181 |
|
| 182 |
$("#put").dblclick();
|
| 183 |
$("#put form").submit();
|
| 184 |
equals($("#put").html(), "PUT", "Should be PUT");
|
| 185 |
});
|
| 186 |
|
| 187 |
});
|
| 188 |
|
| 189 |
</script>
|
| 190 |
|
| 191 |
</head>
|
| 192 |
<body>
|
| 193 |
|
| 194 |
<h1>Jeditable unit tests</h1> |
| 195 |
<h2 id="banner"></h2> |
| 196 |
<h2 id="userAgent"></h2> |
| 197 |
|
| 198 |
<ol id="tests"></ol> |
| 199 |
|
| 200 |
<div id="main"></div> |
| 201 |
<div id="post" style="display: inline;" class="foo">Here be dragons.</div> |
| 202 |
<div id="put">Here be dragons.</div> |
| 203 |
<div id="placeholder"></div> |
| 204 |
<div id="select">Select B</div> |
| 205 |
<div id="callback">Here be dragons.</div> |
| 206 |
<div id="function">Here be dragons.</div> |
| 207 |
</body>
|
| 208 |
</html>
|