| 1 | <html> |
| 2 | <head> |
| 3 | <script type="text/javascript" src="../MochiKit/MockDOM.js"></script> |
| 4 | <script type="text/javascript" src="../MochiKit/Base.js"></script> |
| 5 | <script type="text/javascript" src="../MochiKit/Iter.js"></script> |
| 6 | <script type="text/javascript" src="../MochiKit/DOM.js"></script> |
| 7 | <script type="text/javascript" src="../MochiKit/Style.js"></script> |
| 8 | <script type="text/javascript" src="SimpleTest/SimpleTest.js"></script> |
| 9 | <link rel="stylesheet" type="text/css" href="SimpleTest/test.css"> |
| 10 | </head> |
| 11 | <body> |
| 12 | |
| 13 | <div style="display: none;"> |
| 14 | <form id="form_test"> |
| 15 | <select name="select"> |
| 16 | <option value="foo" selected="selected">foo</option> |
| 17 | <option value="bar">bar</option> |
| 18 | <option value="baz">baz</option> |
| 19 | </select> |
| 20 | <select name="selmultiple" multiple="multiple"> |
| 21 | <option value="bar" selected="selected">bar</option> |
| 22 | <option value="baz" selected="selected">baz</option> |
| 23 | <option value="foo">foo</option> |
| 24 | </select> |
| 25 | <input type="hidden" name="hidden" value="test" /> |
| 26 | <input type="radio" name="radio_off" value="1" /> |
| 27 | <input type="radio" name="radio_off" value="2" /> |
| 28 | <input type="radio" name="radio_off" value="3" /> |
| 29 | <input type="radio" name="radio_on" value="1" /> |
| 30 | <input type="radio" name="radio_on" value="2" checked="checked" /> |
| 31 | <input type="radio" name="radio_on" value="3" /> |
| 32 | </form> |
| 33 | <form id="form_test2"> |
| 34 | <select name="selempty"> |
| 35 | <option value="" selected="selected">foo</option> |
| 36 | </select> |
| 37 | <select name="selempty2"> |
| 38 | <option selected="selected">foo</option> |
| 39 | </select> |
| 40 | </form> |
| 41 | <div id="parentTwo" class="two"> |
| 42 | <div id="parentOne" class="one"> |
| 43 | <div id="parentZero" class="zero"> |
| 44 | <span id="child">child</span> |
| 45 | </div> |
| 46 | </div> |
| 47 | </div> |
| 48 | </div> |
| 49 | |
| 50 | <pre id="test"> |
| 51 | <script type="text/javascript"> |
| 52 | try { |
| 53 | |
| 54 | lst = []; |
| 55 | o = {"blah": function () { lst.push("original"); }}; |
| 56 | addToCallStack(o, "blah", function () { lst.push("new"); }, true); |
| 57 | addToCallStack(o, "blah", function () { lst.push("stuff"); }, true); |
| 58 | is( typeof(o.blah), 'function', 'addToCallStack has a function' ); |
| 59 | is( o.blah.callStack.length, 3, 'callStack length 3' ); |
| 60 | o.blah(); |
| 61 | is( lst.join(" "), "original new stuff", "callStack in correct order" ); |
| 62 | is( o.blah, null, "set to null" ); |
| 63 | lst = []; |
| 64 | o = {"blah": function () { lst.push("original"); }}; |
| 65 | addToCallStack(o, "blah", |
| 66 | function () { lst.push("new"); return false;}, false); |
| 67 | addToCallStack(o, "blah", function () { lst.push("stuff"); }, false); |
| 68 | o.blah(); |
| 69 | is( lst.join(" "), "original new", "callStack in correct order (abort)" ); |
| 70 | o.blah(); |
| 71 | is( lst.join(" "), "original new original new", "callStack in correct order (again)" ); |
| 72 | |
| 73 | |
| 74 | is( escapeHTML("<>\"&bar"), "<>"&bar", "escapeHTML" ); // for emacs highlighting: " |
| 75 | |
| 76 | var isDOM = function (value, expected, message) { |
| 77 | is( escapeHTML(toHTML(value)), escapeHTML(expected), message ); |
| 78 | }; |
| 79 | |
| 80 | var d = document.createElement('span'); |
| 81 | updateNodeAttributes(d, {"foo": "bar", "baz": "wibble"}); |
| 82 | isDOM( d, '<span baz="wibble" foo="bar"/>', "updateNodeAttributes" ); |
| 83 | |
| 84 | var d = document.createElement('span'); |
| 85 | appendChildNodes(d, 'word up', [document.createElement('span')]); |
| 86 | isDOM( d, '<span>word up<span/></span>', 'appendChildNodes' ); |
| 87 | |
| 88 | replaceChildNodes(d, 'Think Different'); |
| 89 | isDOM( d, '<span>Think Different</span>', 'replaceChildNodes' ); |
| 90 | |
| 91 | |
| 92 | insertSiblingNodesBefore(d.childNodes[0], 'word up', document.createElement('span')); |
| 93 | isDOM( d, '<span>word up<span/>Think Different</span>', 'insertSiblingNodesBefore' ); |
| 94 | |
| 95 | insertSiblingNodesAfter(d.childNodes[0], 'purple monkey', document.createElement('span')); |
| 96 | isDOM( d, '<span>word uppurple monkey<span/><span/>Think Different</span>', 'insertSiblingNodesAfter' ); |
| 97 | |
| 98 | d = createDOM("span"); |
| 99 | isDOM( d, "<span/>", "createDOM empty" ); |
| 100 | |
| 101 | |
| 102 | d = createDOM("span", {"foo": "bar", "baz": "wibble"}); |
| 103 | isDOM( d, '<span baz="wibble" foo="bar"/>', "createDOM attributes" ); |
| 104 | |
| 105 | d = createDOM("span", {"foo": "bar", "baz": "wibble", "spam": "egg"}, "one", "two", "three"); |
| 106 | is( getNodeAttribute(d, 'foo'), "bar", "createDOM attribute" ); |
| 107 | is( getNodeAttribute(d, 'baz'), "wibble", "createDOM attribute" ); |
| 108 | removeNodeAttribute(d, "spam"); |
| 109 | is( scrapeText(d), "onetwothree", "createDOM contents" ); |
| 110 | |
| 111 | isDOM( d, '<span baz="wibble" foo="bar">onetwothree</span>', "createDOM contents" ); |
| 112 | |
| 113 | d = createDOM("span", null, function (f) { |
| 114 | return this.nodeName.toLowerCase() + "hi" + f.nodeName.toLowerCase();}); |
| 115 | isDOM( d, '<span>spanhispan</span>', 'createDOM function call' ); |
| 116 | |
| 117 | d = createDOM("span", null, {msg: "hi", dom: function (f) { |
| 118 | return f.nodeName.toLowerCase() + this.msg; }}); |
| 119 | isDOM( d, '<span>spanhi</span>', 'createDOM this.dom() call' ); |
| 120 | |
| 121 | d = createDOM("span", null, {msg: "hi", __dom__: function (f) { |
| 122 | return f.nodeName.toLowerCase() + this.msg; }}); |
| 123 | isDOM( d, '<span>spanhi</span>', 'createDOM this.__dom__() call' ); |
| 124 | |
| 125 | d = createDOM("span", null, range(4)); |
| 126 | isDOM( d, '<span>0123</span>', 'createDOM iterable' ); |
| 127 | |
| 128 | |
| 129 | var d = {"taco": "pork"}; |
| 130 | registerDOMConverter("taco", |
| 131 | function (o) { return !isUndefinedOrNull(o.taco); }, |
| 132 | function (o) { return "Goddamn, I like " + o.taco + " tacos"; } |
| 133 | ); |
| 134 | d = createDOM("span", null, d); |
| 135 | // not yet public API |
| 136 | domConverters.unregister("taco"); |
| 137 | |
| 138 | isDOM( d, "<span>Goddamn, I like pork tacos</span>", "createDOM with custom converter" ); |
| 139 | |
| 140 | is( |
| 141 | escapeHTML(toHTML(SPAN(null))), |
| 142 | escapeHTML(toHTML(createDOM("span", null))), |
| 143 | "createDOMFunc vs createDOM" |
| 144 | ); |
| 145 | |
| 146 | is( scrapeText(d), "Goddamn, I like pork tacos", "scrape OK" ); |
| 147 | is( scrapeText(d, true).join(""), "Goddamn, I like pork tacos", "scrape Array OK" ); |
| 148 | |
| 149 | var st = DIV(null, STRONG(null, "d"), "oor ", STRONG(null, "f", SPAN(null, "r"), "a"), "me"); |
| 150 | is( scrapeText(st), "door frame", "scrape in-order" ); |
| 151 | |
| 152 | |
| 153 | ok( !isUndefinedOrNull(getElement("test")), "getElement might work" ); |
| 154 | ok( !isUndefinedOrNull($("test")), "$alias$$ CASH MONEY alias might work" ); |
| 155 | |
| 156 | d = createDOM("span", null, "one", "two"); |
| 157 | swapDOM(d.childNodes[0], document.createTextNode("uno")); |
| 158 | isDOM( d, "<span>unotwo</span>", "swapDOM" ); |
| 159 | |
| 160 | is( scrapeText(d, true).join(" "), "uno two", "multi-node scrapeText" ); |
| 161 | /* |
| 162 | |
| 163 | TODO: |
| 164 | addLoadEvent (async test?) |
| 165 | |
| 166 | */ |
| 167 | |
| 168 | d = createDOM("span", {"class": "foo"}); |
| 169 | setElementClass(d, "bar baz"); |
| 170 | ok( d.className == "bar baz", "setElementClass"); |
| 171 | toggleElementClass("bar", d); |
| 172 | ok( d.className == "baz", "toggleElementClass: " + d.className); |
| 173 | toggleElementClass("bar", d); |
| 174 | ok( hasElementClass(d, "baz", "bar"), |
| 175 | "toggleElementClass 2: " + d.className); |
| 176 | addElementClass(d, "bar"); |
| 177 | ok( hasElementClass(d, "baz", "bar"), |
| 178 | "toggleElementClass 3: " + d.className); |
| 179 | ok( addElementClass(d, "blah"), "addElementClass return"); |
| 180 | ok( hasElementClass(d, "baz", "bar", "blah"), "addElementClass action"); |
| 181 | ok( !hasElementClass(d, "not"), "hasElementClass single"); |
| 182 | ok( !hasElementClass(d, "baz", "not"), "hasElementClass multiple"); |
| 183 | ok( removeElementClass(d, "blah"), "removeElementClass" ); |
| 184 | ok( !removeElementClass(d, "blah"), "removeElementClass again" ); |
| 185 | ok( !hasElementClass(d, "blah"), "removeElementClass again (hasElement)" ); |
| 186 | removeElementClass(d, "baz"); |
| 187 | ok( !swapElementClass(d, "blah", "baz"), "false swapElementClass" ); |
| 188 | ok( !hasElementClass(d, "baz"), "false swapElementClass from" ); |
| 189 | ok( !hasElementClass(d, "blah"), "false swapElementClass to" ); |
| 190 | addElementClass(d, "blah"); |
| 191 | ok( swapElementClass(d, "blah", "baz"), "swapElementClass" ); |
| 192 | ok( hasElementClass(d, "baz"), "swapElementClass has toClass" ); |
| 193 | ok( !hasElementClass(d, "blah"), "swapElementClass !has fromClass" ); |
| 194 | ok( !swapElementClass(d, "blah", "baz"), "swapElementClass twice" ); |
| 195 | ok( hasElementClass(d, "baz"), "swapElementClass has toClass" ); |
| 196 | ok( !hasElementClass(d, "blah"), "swapElementClass !has fromClass" ); |
| 197 | |
| 198 | TABLE; |
| 199 | TBODY; |
| 200 | TR; |
| 201 | var t = TABLE(null, |
| 202 | TBODY({"class": "foo bar", "id":"tbody0"}, |
| 203 | TR({"class": "foo", "id":"tr0"}), |
| 204 | TR({"class": "bar", "id":"tr1"}) |
| 205 | ) |
| 206 | ); |
| 207 | |
| 208 | var matchElements = getElementsByTagAndClassName; |
| 209 | is( |
| 210 | map(itemgetter("id"), matchElements(null, "foo", t)).join(" "), |
| 211 | "tbody0 tr0", |
| 212 | "getElementsByTagAndClassName found all tags with foo class" |
| 213 | ); |
| 214 | is( |
| 215 | map(itemgetter("id"), matchElements("tr", "foo", t)).join(" "), |
| 216 | "tr0", |
| 217 | "getElementsByTagAndClassName found all tr tags with foo class" |
| 218 | ); |
| 219 | is( |
| 220 | map(itemgetter("id"), matchElements("tr", null, t)).join(" "), |
| 221 | "tr0 tr1", |
| 222 | "getElementsByTagAndClassName found all tr tags" |
| 223 | ); |
| 224 | |
| 225 | var oldDoc = document; |
| 226 | var doc = MochiKit.MockDOM.createDocument(); |
| 227 | is( currentDocument(), document, "currentDocument() correct" ); |
| 228 | withDocument(doc, function () { |
| 229 | ok( document != doc, "global doc unchanged" ); |
| 230 | is( currentDocument(), doc, "currentDocument() correct" ); |
| 231 | var h1 = H1(); |
| 232 | var span = SPAN(null, "foo", h1); |
| 233 | appendChildNodes(currentDocument().body, span); |
| 234 | }); |
| 235 | is( document, oldDoc, "doc restored" ); |
| 236 | is( doc.childNodes.length, 1, "doc has one child" ); |
| 237 | is( doc.body.childNodes.length, 1, "body has one child" ); |
| 238 | var sp = doc.body.childNodes[0]; |
| 239 | is( sp.nodeName, "SPAN", "only child is SPAN" ); |
| 240 | is( sp.childNodes.length, 2, "SPAN has two childNodes" ); |
| 241 | is( sp.childNodes[0].nodeValue, "foo", "first node is text" ); |
| 242 | is( sp.childNodes[1].nodeName, "H1", "second child is H1" ); |
| 243 | |
| 244 | is( currentDocument(), document, "currentDocument() correct" ); |
| 245 | try { |
| 246 | withDocument(doc, function () { |
| 247 | ok( document != doc, "global doc unchanged" ); |
| 248 | is( currentDocument(), doc, "currentDocument() correct" ); |
| 249 | throw new Error("foo"); |
| 250 | }); |
| 251 | ok( false, "didn't throw" ); |
| 252 | } catch (e) { |
| 253 | ok( true, "threw" ); |
| 254 | } |
| 255 | |
| 256 | var mockWindow = {"foo": "bar"}; |
| 257 | is (currentWindow(), window, "currentWindow ok"); |
| 258 | withWindow(mockWindow, function () { |
| 259 | is(currentWindow(), mockWindow, "withWindow ok"); |
| 260 | }); |
| 261 | is (currentWindow(), window, "currentWindow ok"); |
| 262 | |
| 263 | doc = MochiKit.MockDOM.createDocument(); |
| 264 | var frm; |
| 265 | withDocument(doc, function () { |
| 266 | frm = FORM({name: "ignore"}, |
| 267 | INPUT({name:"foo", value:"bar"}), |
| 268 | INPUT({name:"foo", value:"bar"}), |
| 269 | INPUT({name:"baz", value:"bar"}) |
| 270 | ); |
| 271 | }); |
| 272 | var kv = formContents(frm); |
| 273 | is( kv[0].join(","), "foo,foo,baz", "mock formContents names" ); |
| 274 | is( kv[1].join(","), "bar,bar,bar", "mock formContents values" ); |
| 275 | is( queryString(frm), "foo=bar&foo=bar&baz=bar", "mock queryString hook" ); |
| 276 | |
| 277 | var kv = formContents("form_test"); |
| 278 | is( kv[0].join(","), "select,selmultiple,selmultiple,hidden,radio_on", "formContents names" ); |
| 279 | is( kv[1].join(","), "foo,bar,baz,test,2", "formContents values" ); |
| 280 | is( queryString("form_test"), "select=foo&selmultiple=bar&selmultiple=baz&hidden=test&radio_on=2", "queryString hook" ); |
| 281 | kv = formContents("form_test2"); |
| 282 | is( kv[0].join(","), "selempty,selempty2", "formContents names empty option values" ); |
| 283 | is( kv[1].join(","), ",foo", "formContents empty option values" ); |
| 284 | is( queryString("form_test2"), "selempty=&selempty2=foo", "queryString empty option values" ); |
| 285 | |
| 286 | var d = DIV(null, SPAN(), " \n\t", SPAN(), "foo", SPAN(), " "); |
| 287 | is( d.childNodes.length, 6, "removeEmptyNodes test conditions correct" ); |
| 288 | removeEmptyTextNodes(d); |
| 289 | is( d.childNodes.length, 4, "removeEmptyNodes" ); |
| 290 | |
| 291 | is( getFirstParentByTagAndClassName('child', 'div', 'two'), getElement("parentTwo"), "getFirstParentByTagAndClassName found parent" ); |
| 292 | is( getFirstParentByTagAndClassName('child', 'div'), getElement("parentZero"), "getFirstParentByTagAndClassName found parent (any class)" ); |
| 293 | is( getFirstParentByTagAndClassName('child', '*', 'two'), getElement("parentTwo"), "getFirstParentByTagAndClassName found parent (any tag)" ); |
| 294 | |
| 295 | ok( true, "test suite finished!"); |
| 296 | |
| 297 | |
| 298 | } catch (err) { |
| 299 | |
| 300 | var s = "test suite failure!\n"; |
| 301 | var o = {}; |
| 302 | var k = null; |
| 303 | for (k in err) { |
| 304 | // ensure unique keys?! |
| 305 | if (!o[k]) { |
| 306 | s += k + ": " + err[k] + "\n"; |
| 307 | o[k] = err[k]; |
| 308 | } |
| 309 | } |
| 310 | ok ( false, s ); |
| 311 | |
| 312 | } |
| 313 | </script> |
| 314 | </pre> |
| 315 | </body> |
| 316 | </html> |