www.aleph1.co.uk Git - yaffs-website/blob - node_modules/min-document/test/test-dom-element.js

   1 var test = require("tape")
   2
   3 module.exports = testDomElement
   4
   5 function testDomElement(document) {
   6
   7     var cleanup = require('./cleanup')(document)
   8
   9     test("can getElementsByClassName", function(assert) {
  10         function append_div(classNames, parent) {
  11             var div = document.createElement("div")
  12             div.className = classNames
  13             parent.appendChild(div)
  14             return div
  15         }
  16
  17         function assertMatch(classNames, expectedElements, parent) {
  18             var parent = parent || document
  19             var result = parent.getElementsByClassName(classNames)
  20             assert.equal(result.length, expectedElements.length)
  21             for (var i = 0; i < expectedElements.length; i++) {
  22                 assert.notEqual(expectedElements.indexOf(result[i]), -1)
  23             }
  24         }
  25
  26         var divA   = append_div("A", document.body)
  27         var divB   = append_div("B", document.body)
  28         var divC   = append_div("C", document.body)
  29
  30         var divA1  = append_div("A1",  divA)
  31         var divA2  = append_div("A2",  divA)
  32         var divB1  = append_div("B1",  divB)
  33         var divB2  = append_div("B2",  divB)
  34         var divB2a = append_div("B2a", divB2)
  35         var divB2b = append_div("B2b", divB2)
  36
  37         assertMatch("A",    [divA])
  38         assertMatch("B",    [divB])
  39         assertMatch("C",    [divC])
  40         assertMatch("A1",   [divA1])
  41         assertMatch("A2",   [divA2])
  42         assertMatch("B1",   [divB1])
  43         assertMatch("B2",   [divB2])
  44         assertMatch("B2a",  [divB2a])
  45         assertMatch("B2b",  [divB2b])
  46
  47         assertMatch("A1",   [divA1], divA)
  48         assertMatch("A2",   [divA2], divA)
  49         assertMatch("A1",   [], divB)
  50         assertMatch("A2",   [], divC)
  51         assertMatch("B1",   [divB1], divB)
  52         assertMatch("B2",   [divB2], divB)
  53         assertMatch("B2a",  [divB2a], divB)
  54         assertMatch("B2a",  [divB2a], divB2)
  55         assertMatch("B2b",  [], divA)
  56
  57         cleanup()
  58         assert.end()
  59     })
  60
  61     test("does not serialize innerText as an attribute", function(assert) {
  62       var div = document.createElement("div")
  63       div.innerText = "Test <&>"
  64       assert.equal(div.toString(), "<div>Test &lt;&amp;&gt;</div>")
  65       cleanup()
  66       assert.end()
  67     })
  68
  69     test("does not serialize innerHTML as an attribute", function(assert) {
  70       var div = document.createElement("div")
  71       div.innerHTML = "Test <img />"
  72       assert.equal(div.toString(), "<div>Test <img /></div>")
  73       cleanup()
  74       assert.end()
  75     })
  76
  77     test("can getElementsByTagName", function(assert) {
  78         var parent = document.createElement("div")
  79         var child1 = document.createElement("span")
  80         var child2 = document.createElement("span")
  81
  82         child1.id = "foo"
  83         child2.id = "bar"
  84
  85         child1.appendChild(child2)
  86         parent.appendChild(child1)
  87
  88         var elems = parent.getElementsByTagName("SPAN")
  89
  90         assert.equal(elems.length, 2)
  91         assert.equal(elems[0].id, "foo")
  92         assert.equal(elems[1].id, "bar")
  93
  94         cleanup()
  95         assert.end()
  96     })
  97
  98     test("can getElementsByTagName with *", function(assert) {
  99         var e1 = document.createElement("div")
 100         var e2 = document.createElement("p")
 101         var e3 = document.createElement("span")
 102
 103         e1.appendChild(e2)
 104         e2.appendChild(e3)
 105         // non-elements should be ignored
 106         e3.appendChild(document.createTextNode('foo'))
 107         e3.appendChild(document.createComment('bar'))
 108
 109         var elems = e1.getElementsByTagName("*")
 110
 111         assert.equal(elems.length, 2)
 112         assert.equal(elems[0].tagName, "P")
 113         assert.equal(elems[1].tagName, "SPAN")
 114
 115         cleanup()
 116         assert.end()
 117     })
 118
 119     test("getElement* methods can be passed to map()", function(assert) {
 120         var container = document.createElement("div")
 121         var e1 = document.createElement("div")
 122         var e2 = document.createElement("span")
 123         container.appendChild(e1)
 124         container.appendChild(e2)
 125
 126         assert.deepEqual(
 127             ["div", "span"].map(container.getElementsByTagName.bind(container)),
 128             [[e1], [e2]]
 129         )
 130
 131         e1.className = "foo"
 132         e2.className = "bar"
 133
 134         assert.deepEqual(
 135             ["foo", "bar"].map(container.getElementsByClassName.bind(container)),
 136             [[e1], [e2]]
 137         )
 138
 139         cleanup()
 140         assert.end()
 141     })
 142
 143     test("can serialize comment nodes", function(assert) {
 144         var div = document.createElement("div")
 145         div.appendChild(document.createComment("test"))
 146         assert.equal(div.toString(), "<div><!--test--></div>")
 147         cleanup()
 148         assert.end()
 149     })
 150
 151     test("can serialize style property", function(assert) {
 152         var div = document.createElement("div")
 153         div.style.fontSize = "16px"
 154         assert.equal(div.toString(), "<div style=\"font-size:16px;\"></div>")
 155         cleanup();
 156         assert.end()
 157     })
 158
 159     test("can serialize style as a string", function(assert) {
 160       var div = document.createElement("div")
 161       div.setAttribute('style', 'display: none')
 162       assert.equal(div.toString(), "<div style=\"display: none\"></div>")
 163       cleanup()
 164       assert.end()
 165     })
 166
 167     test("can serialize text nodes", function(assert) {
 168         var div = document.createElement("div")
 169         div.appendChild(document.createTextNode('<test> "&'))
 170         assert.equal(div.toString(), '<div>&lt;test&gt; "&amp;</div>')
 171         cleanup()
 172         assert.end()
 173     })
 174
 175     test("escapes serialized attribute values", function(assert) {
 176         var div = document.createElement("div")
 177         div.setAttribute("data-foo", '<p>"&')
 178         assert.equal(div.toString(), '<div data-foo="&lt;p&gt;&quot;&amp;"></div>')
 179         cleanup()
 180         assert.end()
 181     })
 182
 183     test("can check if an element contains another", function(assert) {
 184         var parent = document.createElement("div")
 185         var sibling = document.createElement("div")
 186         var child1 = document.createElement("div")
 187         var child2 = document.createElement("div")
 188
 189         child1.appendChild(child2)
 190         parent.appendChild(child1)
 191
 192         assert.equal(parent.contains(parent), true)
 193         assert.equal(parent.contains(sibling), false)
 194         assert.equal(parent.contains(child1), true)
 195         assert.equal(parent.contains(child2), true)
 196
 197         cleanup()
 198         assert.end()
 199     })
 200
 201     test("can handle non string attribute values", function(assert) {
 202         var div = document.createElement("div")
 203         div.setAttribute("data-number", 100)
 204         div.setAttribute("data-boolean", true)
 205         div.setAttribute("data-null", null)
 206         assert.equal(div.toString(), '<div data-number="100" data-boolean="true" data-null=""></div>')
 207         cleanup()
 208         assert.end()
 209     })
 210
 211     test("can serialize textarea correctly", function(assert) {
 212         var input = document.createElement("textarea")
 213         input.setAttribute("name", "comment")
 214         input.innerHTML = "user input here"
 215         assert.equal(input.toString(), '<textarea name="comment">user input here</textarea>')
 216         cleanup()
 217         assert.end()
 218     })
 219 }