| OLD | NEW |
|---|
| 1 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> | 1 <!DOCTYPE html> |
| 2 <html> | 2 <script src="../../resources/testharness.js"></script> |
| 3 <head> | 3 <script src="../../resources/testharnessreport.js"></script> |
| 4 <script src="../../resources/js-test.js"></script> | |
| 5 </head> | |
| 6 <body> | 4 <body> |
| 7 <script src="script-tests/dataset.js"></script> | 5 <script> |
| 6 function testDataset(getTestElement) { |
| 7 » function testGet(attr, expected) |
| 8 » { |
| 9 » var e = getTestElement(); |
| 10 » e.setAttribute(attr, "value"); |
| 11 » return e.dataset[expected] == "value"; |
| 12 » } |
| 13 |
| 14 » test (function() { |
| 15 » » assert_true(testGet('data-foo', 'foo')); |
| 16 » » assert_true(testGet('data-foo-bar', 'fooBar')); |
| 17 » » assert_true(testGet('data--', '-')); |
| 18 » » assert_true(testGet('data--foo', 'Foo')); |
| 19 » » assert_true(testGet('data---foo', '-Foo')); |
| 20 » » assert_true(testGet('data---foo--bar', '-Foo-Bar')); |
| 21 » » assert_true(testGet('data---foo---bar', '-Foo--Bar')); |
| 22 » » assert_true(testGet('data-foo-', 'foo-')); |
| 23 » » assert_true(testGet('data-foo--', 'foo--')); |
| 24 » » assert_true(testGet('data-', '')); |
| 25 » » assert_true(testGet('data-\xE0', '\xE0')); |
| 26 » » assert_true(testGet('data-1', '1')); |
| 27 » » assert_true(testGet('data-01', '01')); |
| 28 » » assert_true(testGet('data-zx81', 'zx81')); |
| 29 » » assert_true(testGet('data-i4770k', 'i4770k')); |
| 30 » » assert_true(testGet('data-r-7', 'r-7')); |
| 31 » » assert_true(testGet('data-r-7-k', 'r-7K')); |
| 32 » » assert_equals(document.body.dataset.nonExisting, undefined); |
| 33 » },'This tests Get function'); |
| 34 |
| 35 » test (function() { |
| 36 » » var e = getTestElement(); |
| 37 » » e.setAttribute('data-Foo', 'value'); |
| 38 » » // HTML lowercases all attributes whereas SVG does not. |
| 39 » » if (e instanceof HTMLElement) |
| 40 » » » assert_true(e.dataset['foo'] == "value"); |
| 41 » » else |
| 42 » » » assert_true(e.dataset['Foo'] == "value"); |
| 43 » }, 'This tests case sensitive scenario'); |
| 44 |
| 45 |
| 46 » function testIsUndefined(attr, prop) |
| 47 » { |
| 48 » var e = getTestElement(); |
| 49 » e.setAttribute(attr, "value"); |
| 50 » return e.dataset[prop] === undefined; |
| 51 » } |
| 52 |
| 53 » test (function() { |
| 54 » » assert_true(testIsUndefined('data-022', '22')); |
| 55 » » assert_true(testIsUndefined('data-22', '022')); |
| 56 » },'Tests Undefined'); |
| 57 |
| 58 |
| 59 » function matchesNothingInDataset(attr) |
| 60 » { |
| 61 » var e = getTestElement(); |
| 62 » e.setAttribute(attr, "value"); |
| 63 |
| 64 » var count = 0; |
| 65 » for (var item in e.dataset) |
| 66 » count++; |
| 67 » return count == 0; |
| 68 » } |
| 69 |
| 70 » test (function() { |
| 71 » » assert_true(matchesNothingInDataset('dataFoo')); |
| 72 » },'Tests matchesNothingInDataset'); |
| 73 |
| 74 |
| 75 » function testSet(prop, expected) |
| 76 » { |
| 77 » var e = getTestElement(); |
| 78 » e.dataset[prop] = "value"; |
| 79 » return e.getAttribute(expected) == "value"; |
| 80 » } |
| 81 |
| 82 » test (function() { |
| 83 » » assert_true(testSet('foo', 'data-foo')); |
| 84 » » assert_true(testSet('fooBar', 'data-foo-bar')); |
| 85 » » assert_true(testSet('-', 'data--')); |
| 86 » » assert_true(testSet('Foo', 'data--foo')); |
| 87 » » assert_true(testSet('-Foo', 'data---foo')); |
| 88 » » assert_true(testSet('', 'data-')); |
| 89 » » assert_true(testSet('\xE0', 'data-\xE0')); |
| 90 » » assert_true(testSet('32', 'data-32')); |
| 91 » » assert_true(testSet('0032', 'data-0032')); |
| 92 » » assert_true(testSet('i18n', 'data-i18n')); |
| 93 » » assert_true(testSet('d2', 'data-d2')); |
| 94 » » assert_true(testSet('2d', 'data-2d')); |
| 95 » » assert_true(testSet('d-2', 'data-d-2')); |
| 96 » » assert_true(testSet('A--S', 'data--a---s')); |
| 97 » » assert_throws(null, function() { testSet('-foo', 'dummy'); }, '"
SyntaxError: Failed to set the \'-foo\' property on \'DOMStringMap\': \'-foo\' i
s not a valid property name."'); |
| 98 » » assert_throws(null, function() { testSet('foo\x20', 'dummy'); },
'"InvalidCharacterError: Failed to set the \'foo\x20\' property on \'DOMStringM
ap\': \'data-foo\x20\' is not a valid attribute name."'); |
| 99 » » assert_throws(null, function() { testSet('foo\uF900', 'dummy');
}, '"InvalidCharacterError: Failed to set the \'foo\uF900\' property on \'DOMStr
ingMap\': \'data-foo\uF900\' is not a valid attribute name."'); |
| 100 » },'Tests Set'); |
| 101 |
| 102 |
| 103 » function testIsNull(prop, attr) |
| 104 » { |
| 105 » var e = getTestElement(); |
| 106 » e.dataset[prop] = "value"; |
| 107 » return e.getAttribute(attr) === null; |
| 108 » } |
| 109 |
| 110 » test (function() { |
| 111 » » assert_true(testIsNull('0123', 'data-123')); |
| 112 » » assert_true(testIsNull('123', 'data-0123')); |
| 113 » },'Tests Is Null'); |
| 114 |
| 115 |
| 116 » function testDelete(attr, prop) |
| 117 » { |
| 118 » var e = getTestElement(); |
| 119 » e.setAttribute(attr, "value"); |
| 120 » delete e.dataset[prop]; |
| 121 » return e.getAttribute(attr) != "value"; |
| 122 » } |
| 123 |
| 124 » test (function() { |
| 125 » » assert_true(testDelete('data-foo', 'foo')); |
| 126 » » assert_true(testDelete('data-foo-bar', 'fooBar')); |
| 127 » » assert_true(testDelete('data--', '-')); |
| 128 » » assert_true(testDelete('data--foo', 'Foo')); |
| 129 » » assert_true(testDelete('data---foo', '-Foo')); |
| 130 » » assert_true(testDelete('data-', '')); |
| 131 » » assert_true(testDelete('data-\xE0', '\xE0')); |
| 132 » » assert_true(testDelete('data-33', '33')); |
| 133 » » assert_true(testDelete('data-00033', '00033')); |
| 134 » » assert_true(testDelete('data-r2', 'r2')); |
| 135 » » assert_true(testDelete('data-2r', '2r')); |
| 136 » » assert_true(testDelete('data-r-2', 'r-2')); |
| 137 » » assert_true(testDelete('data--r-2-', 'R-2-')); |
| 138 » » assert_true(testDelete('data--r-2r', 'R-2r')); |
| 139 » » assert_true(testDelete('data--r-2-----r', 'R-2----R')); |
| 140 » » assert_false(testDelete('dummy', '-foo')); |
| 141 » },'Tests Delete'); |
| 142 |
| 143 |
| 144 |
| 145 » // The (HTML/SVG)Element.dataset deleter is only applied to properties |
| 146 » // that are present; check that any underlying native property |
| 147 » // is deleted instead. |
| 148 » function testNativeDelete(prop, isConfigurable) |
| 149 » { |
| 150 » var e = getTestElement(); |
| 151 » Object.defineProperty(e.dataset, prop, {configurable: isConfigurable
, value: "native_value"}); |
| 152 » delete e.dataset[prop]; |
| 153 » return isConfigurable ? !(prop in e.dataset) : (e.dataset[prop] ===
"native_value"); |
| 154 » } |
| 155 |
| 156 » test (function() { |
| 157 » » // TODO(jochen): Reenable this once it behaves correctly |
| 158 » » //assert_true(testNativeDelete('-r-2-', false)); |
| 159 » » assert_true(testNativeDelete('foo', true)); |
| 160 » },'Tests Native Delete'); |
| 161 |
| 162 |
| 163 » function testForIn(array) |
| 164 » { |
| 165 » var e = getTestElement(); |
| 166 |
| 167 » for (var i = 0; i < array.length; ++i) { |
| 168 » e.setAttribute(array[i], "value"); |
| 169 » } |
| 170 |
| 171 » var count = 0; |
| 172 » for (var item in e.dataset) |
| 173 » count++; |
| 174 |
| 175 » return count; |
| 176 » } |
| 177 |
| 178 » test (function() { |
| 179 » » assert_equals(testForIn(['data-foo', 'data-bar', 'data-baz']), 3
); |
| 180 » » assert_equals(testForIn(['data-foo', 'data-bar', 'dataFoo']), 2)
; |
| 181 » » assert_equals(testForIn(['data-foo', 'data-bar', 'style']), 2); |
| 182 » » assert_equals(testForIn(['data-foo', 'data-bar', 'data-']), 3); |
| 183 » » assert_equals(testForIn(['data-foo', 'data-bar', 'data-43']), 3)
; |
| 184 » » assert_equals(testForIn(['data-foo', 'data-oric1', 'data-bar']),
3); |
| 185 » » assert_equals(testForIn(['data-foo', 'data-oric-1', 'data-bar'])
, 3); |
| 186 » » assert_equals(testForIn(['data-foo', 'data-oric-1x', 'data-bar']
), 3); |
| 187 » },'Tests For In'); |
| 188 |
| 189 » test (function() { |
| 190 » » var e = getTestElement(); |
| 191 » » e.dataset.foo = null; |
| 192 » » assert_equals(e.dataset.foo, 'null'); |
| 193 » },'Set null'); |
| 194 } |
| 195 |
| 196 function testDatasetPropertyOverride(getTestElement) { |
| 197 » var e = getTestElement(); |
| 198 |
| 199 » // If the Object prototype already has "foo", dataset doesnot create the
corresponding attribute for foo |
| 200 » Object.prototype.foo = 'on Object'; |
| 201 » assert_equals(e.dataset.foo, 'on Object'); |
| 202 » e.dataset['foo'] = 'on dataset'; |
| 203 » assert_equals(e.dataset.foo, 'on dataset'); |
| 204 » assert_true(e.hasAttribute('data-foo')); |
| 205 » e.setAttribute('data-foo', 'attr'); |
| 206 » assert_equals(e.dataset.foo, 'attr'); |
| 207 |
| 208 » // Update the JavaScript property |
| 209 » e.dataset.foo = 'updated'; |
| 210 » assert_equals(e.dataset.foo, 'updated'); |
| 211 » assert_equals(e.getAttribute('data-foo'), 'updated'); |
| 212 |
| 213 » // "Bar" can't be represented as a data- attribute. |
| 214 » e.dataset.Bar = 'on dataset'; |
| 215 » assert_equals(e.dataset.Bar, 'on dataset'); |
| 216 » assert_false(e.hasAttribute('data-Bar')); |
| 217 |
| 218 » // Make the JavaScript property empty |
| 219 » e.dataset.foo = ''; |
| 220 » assert_equals(e.dataset.foo, ''); |
| 221 » assert_equals(e.getAttribute('data-foo'), ''); |
| 222 |
| 223 » // Remove the attribute |
| 224 » e.removeAttribute('data-foo'); |
| 225 » assert_equals(e.dataset.foo, 'on Object'); |
| 226 |
| 227 » // Remove the JavaScript property |
| 228 » e.setAttribute('data-foo', 'attr'); |
| 229 » delete e.dataset.foo; |
| 230 » assert_equals(e.dataset.foo, 'on Object'); |
| 231 » assert_false(e.hasAttribute('foo')); |
| 232 » delete e.dataset.Bar; |
| 233 » assert_equals(e.dataset.Bar, undefined); |
| 234 » Object.prototype[11] = 'on Object'; |
| 235 » assert_equals(e.dataset[11], 'on Object'); |
| 236 » e.dataset['11'] = 'on dataset'; |
| 237 » assert_equals(e.dataset[11], 'on dataset'); |
| 238 » assert_true(e.hasAttribute('data-11')); |
| 239 » e.setAttribute('data-11', 'attr'); |
| 240 » assert_equals(e.dataset[11], 'attr'); |
| 241 |
| 242 » // Update the JavaScript property |
| 243 » e.dataset[11] = 'updated'; |
| 244 » assert_equals(e.dataset[11], 'updated'); |
| 245 » assert_equals(e.getAttribute('data-11'), 'updated'); |
| 246 |
| 247 » Object.prototype['a500'] = 'on Object'; |
| 248 » assert_equals(e.dataset['a500'], 'on Object'); |
| 249 » e.dataset['a500'] = 'on dataset'; |
| 250 » assert_equals(e.dataset['a500'], 'on dataset'); |
| 251 » assert_true(e.hasAttribute('data-a500')); |
| 252 » e.setAttribute('data-a500', 'attr'); |
| 253 » assert_equals(e.dataset['a500'], 'attr'); |
| 254 |
| 255 » // Update the JavaScript property |
| 256 » e.dataset['a500'] = 'updated'; |
| 257 » assert_equals(e.dataset['a500'], 'updated'); |
| 258 » assert_equals(e.getAttribute('data-a500'), 'updated'); |
| 259 » Object.prototype['a-500k'] = 'on Object'; |
| 260 » assert_equals(e.dataset['a-500k'], 'on Object'); |
| 261 » e.dataset['a-500k'] = 'on dataset'; |
| 262 » assert_equals(e.dataset['a-500k'], 'on dataset'); |
| 263 » assert_true(e.hasAttribute('data-a-500k')); |
| 264 » e.setAttribute('data-a-500k', 'attr'); |
| 265 » assert_equals(e.dataset['a-500k'], 'attr'); |
| 266 |
| 267 » // Update the JavaScript property |
| 268 » e.dataset['a-500k'] = 'updated'; |
| 269 » assert_equals(e.dataset['a-500k'], 'updated'); |
| 270 » assert_equals(e.getAttribute('data-a-500k'), 'updated'); |
| 271 } |
| 272 |
| 273 var svgNS = "http://www.w3.org/2000/svg"; |
| 274 testDataset(function() { return document.createElement("div"); }); |
| 275 testDataset(function() { return document.createElementNS(svgNS, "circle"); }); |
| 276 testDatasetPropertyOverride(function() { return document.createElement("div"); }
); |
| 277 testDatasetPropertyOverride(function() { return document.createElementNS(svgNS,
"circle"); }); |
| 278 </script> |
| 8 </body> | 279 </body> |
| 9 </html> | |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 2231053003:
Add dataset property to SVGElement interface. (Closed)
Base URL: https://chromium.googlesource.com/chromium/src.git@master