LayoutTests/fast/dom/script-tests/dataset.js

   1 description("This tests element.dataset.");
   2
   3 function testGet(attr, expected)
   4 {
   5     var d = document.createElement("div");
   6     d.setAttribute(attr, "value");
   7     return d.dataset[expected] == "value";
   8 }
   9
  10 shouldBeTrue("testGet('data-foo', 'foo')");
  11 shouldBeTrue("testGet('data-foo-bar', 'fooBar')");
  12 shouldBeTrue("testGet('data--', '-')");
  13 shouldBeTrue("testGet('data--foo', 'Foo')");
  14 shouldBeTrue("testGet('data---foo', '-Foo')");
  15 shouldBeTrue("testGet('data---foo--bar', '-Foo-Bar')");
  16 shouldBeTrue("testGet('data---foo---bar', '-Foo--Bar')");
  17 shouldBeTrue("testGet('data-foo-', 'foo-')");
  18 shouldBeTrue("testGet('data-foo--', 'foo--')");
  19 shouldBeTrue("testGet('data-Foo', 'foo')"); // HTML lowercases all attributes.
  20 shouldBeTrue("testGet('data-', '')");
  21 shouldBeTrue("testGet('data-\xE0', '\xE0')");
  22 shouldBeUndefined("document.body.dataset.nonExisting");
  23 debug("");
  24
  25 function matchesNothingInDataset(attr)
  26 {
  27     var d = document.createElement("div");
  28     d.setAttribute(attr, "value");
  29
  30     var count = 0;
  31     for (var item in d.dataset)
  32         count++;
  33     return count == 0;
  34 }
  35
  36 shouldBeTrue("matchesNothingInDataset('dataFoo')");
  37 debug("");
  38
  39 function testSet(prop, expected)
  40 {
  41     var d = document.createElement("div");
  42     d.dataset[prop] = "value";
  43     return d.getAttribute(expected) == "value";
  44 }
  45
  46 shouldBeTrue("testSet('foo', 'data-foo')");
  47 shouldBeTrue("testSet('fooBar', 'data-foo-bar')");
  48 shouldBeTrue("testSet('-', 'data--')");
  49 shouldBeTrue("testSet('Foo', 'data--foo')");
  50 shouldBeTrue("testSet('-Foo', 'data---foo')");
  51 shouldBeTrue("testSet('', 'data-')");
  52 shouldBeTrue("testSet('\xE0', 'data-\xE0')");
  53 debug("");
  54
  55 shouldThrow("testSet('-foo', 'dummy')", "'Error: SYNTAX_ERR: DOM Exception 12'");
  56 shouldThrow("testSet('foo\x20', 'dummy')", "'Error: INVALID_CHARACTER_ERR: DOM Exception 5'");
  57 shouldThrow("testSet('foo\uF900', 'dummy')", "'Error: INVALID_CHARACTER_ERR: DOM Exception 5'");
  58 debug("");
  59
  60 function testDelete(attr, prop)
  61 {
  62     var d = document.createElement("div");
  63     d.setAttribute(attr, "value");
  64     delete d.dataset[prop];
  65     return d.getAttribute(attr) != "value";
  66 }
  67
  68 shouldBeTrue("testDelete('data-foo', 'foo')");
  69 shouldBeTrue("testDelete('data-foo-bar', 'fooBar')");
  70 shouldBeTrue("testDelete('data--', '-')");
  71 shouldBeTrue("testDelete('data--foo', 'Foo')");
  72 shouldBeTrue("testDelete('data---foo', '-Foo')");
  73 shouldBeTrue("testDelete('data-', '')");
  74 shouldBeTrue("testDelete('data-\xE0', '\xE0')");
  75 debug("");
  76
  77 shouldBeFalse("testDelete('dummy', '-foo')");
  78 debug("");
  79
  80 function testForIn(array)
  81 {
  82     var d = document.createElement("div");
  83     for (var i = 0; i < array.length; ++i) {
  84         d.setAttribute(array[i], "value");
  85     }
  86
  87     var count = 0;
  88     for (var item in d.dataset)
  89         count++;
  90
  91     return count;
  92 }
  93
  94 shouldBe("testForIn(['data-foo', 'data-bar', 'data-baz'])", "3");
  95 shouldBe("testForIn(['data-foo', 'data-bar', 'dataFoo'])", "2");
  96 shouldBe("testForIn(['data-foo', 'data-bar', 'style'])", "2");
  97 shouldBe("testForIn(['data-foo', 'data-bar', 'data-'])", "3");
  98
  99
 100 debug("");
 101 debug("Property override:");
 102 var div = document.createElement("div");
 103 // If the Object prorotype already has "foo", dataset doesn't create the
 104 // corresponding attribute for "foo".
 105 shouldBe("Object.prototype.foo = 'on Object'; div.dataset.foo", "'on Object'");
 106 shouldBe("div.dataset['foo'] = 'on dataset'; div.dataset.foo", "'on dataset'");
 107 shouldBeTrue("div.hasAttribute('data-foo')");
 108 shouldBe("div.setAttribute('data-foo', 'attr'); div.dataset.foo", "'attr'");
 109 debug("Update the JavaScript property:");
 110 shouldBe("div.dataset.foo = 'updated'; div.dataset.foo", "'updated'");
 111 shouldBe("div.getAttribute('data-foo')", "'updated'");
 112 // "Bar" can't be represented as a data- attribute.
 113 shouldBe("div.dataset.Bar = 'on dataset'; div.dataset.Bar", "'on dataset'");
 114 shouldBeFalse("div.hasAttribute('data-Bar')");
 115 debug("Make the JavaScript property empty:");
 116 shouldBe("div.dataset.foo = ''; div.dataset.foo", "''");
 117 shouldBe("div.getAttribute('data-foo')", "''");
 118 debug("Remove the attribute:");
 119 shouldBe("div.removeAttribute('data-foo'); div.dataset.foo", "'on Object'");
 120 debug("Remove the JavaScript property:");
 121 shouldBe("div.setAttribute('data-foo', 'attr'); delete div.dataset.foo; div.dataset.foo", "'on Object'");
 122 shouldBeFalse("div.hasAttribute('foo')");
 123 shouldBeUndefined("delete div.dataset.Bar; div.dataset.Bar");
 124
 125 debug("");