| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <title>Custom Elements: Create an element when definition is non-null and synchr
onous flag not set</title> | 2 <title>Custom Elements: Create an element when definition is non-null and synchr
onous flag not set</title> |
| 3 <script src="../../resources/testharness.js"></script> | 3 <script src="../../resources/testharness.js"></script> |
| 4 <script src="../../resources/testharnessreport.js"></script> | 4 <script src="../../resources/testharnessreport.js"></script> |
| 5 <script src="resources/custom-elements-helpers.js"></script> | 5 <script src="resources/custom-elements-helpers.js"></script> |
| 6 <body> | 6 <body> |
| 7 <script> | 7 <script> |
| 8 'use strict'; | 8 'use strict'; |
| 9 | 9 |
| 10 (() => { | 10 (() => { |
| (...skipping 48 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 59 | 59 |
| 60 test_with_window(w => { | 60 test_with_window(w => { |
| 61 let document = w.document; | 61 let document = w.document; |
| 62 let element = document.createElement('a-a'); | 62 let element = document.createElement('a-a'); |
| 63 element.setAttribute('x', '1'); | 63 element.setAttribute('x', '1'); |
| 64 element.setAttribute('y', '2'); | 64 element.setAttribute('y', '2'); |
| 65 element.setAttribute('z', '3'); | 65 element.setAttribute('z', '3'); |
| 66 document.body.appendChild(element); | 66 document.body.appendChild(element); |
| 67 let logs = define_logger(w, ['x', 'y']); | 67 let logs = define_logger(w, ['x', 'y']); |
| 68 assert_log_is_type(logs, 0, constructor, element); | 68 assert_log_is_type(logs, 0, constructor, element); |
| 69 assert_log_is_type(logs, 1, attributeChanged, element, ['x', null, '1', ''])
; | 69 assert_log_is_type(logs, 1, attributeChanged, element, ['x', null, '1', null
]); |
| 70 assert_log_is_type(logs, 2, attributeChanged, element, ['y', null, '2', ''])
; | 70 assert_log_is_type(logs, 2, attributeChanged, element, ['y', null, '2', null
]); |
| 71 assert_log_is_type(logs, 3, connected, element); | 71 assert_log_is_type(logs, 3, connected, element); |
| 72 assert_equals(logs.length, 4); | 72 assert_equals(logs.length, 4); |
| 73 }, 'upgrade should enqueue attributeChangedCallback and connectedCallback'); | 73 }, 'upgrade should enqueue attributeChangedCallback and connectedCallback'); |
| 74 | 74 |
| 75 test_with_window(w => { | 75 test_with_window(w => { |
| 76 let document = w.document; | 76 let document = w.document; |
| 77 let element = document.createElement('a-a'); | 77 let element = document.createElement('a-a'); |
| 78 element.setAttribute('x', '1'); | 78 element.setAttribute('x', '1'); |
| 79 document.body.appendChild(element); | 79 document.body.appendChild(element); |
| 80 let logs = define_logger(w, ['x', 'y']); | 80 let logs = define_logger(w, ['x', 'y']); |
| 81 | 81 |
| 82 logs.length = 0; | 82 logs.length = 0; |
| 83 element.setAttribute('z', '0'); | 83 element.setAttribute('z', '0'); |
| 84 element.setAttribute('y', '2'); | 84 element.setAttribute('y', '2'); |
| 85 element.setAttribute('x', '9'); | 85 element.setAttribute('x', '9'); |
| 86 assert_log_is_type(logs, 0, attributeChanged, element, ['y', null, '2', ''])
; | 86 assert_log_is_type(logs, 0, attributeChanged, element, ['y', null, '2', null
]); |
| 87 assert_log_is_type(logs, 1, attributeChanged, element, ['x', '1', '9', '']); | 87 assert_log_is_type(logs, 1, attributeChanged, element, ['x', '1', '9', null]
); |
| 88 assert_equals(logs.length, 2); | 88 assert_equals(logs.length, 2); |
| 89 }, 'setAttribute should enqueue attributeChangedCallback'); | 89 }, 'setAttribute should enqueue attributeChangedCallback'); |
| 90 | 90 |
| 91 test_with_window(w => { | 91 test_with_window(w => { |
| 92 let document = w.document; | 92 let document = w.document; |
| 93 let element = document.createElement('a-a'); | 93 let element = document.createElement('a-a'); |
| 94 document.body.appendChild(element); | 94 document.body.appendChild(element); |
| 95 let logs = define_logger(w, ['style']); | 95 let logs = define_logger(w, ['style']); |
| 96 | 96 |
| 97 logs.length = 0; | 97 logs.length = 0; |
| 98 element.style.color = 'red'; | 98 element.style.color = 'red'; |
| 99 assert_equals(logs.length, 1); | 99 assert_equals(logs.length, 1); |
| 100 assert_log_is_type(logs, 0, attributeChanged, element, ['style', null, 'colo
r: red;', '']); | 100 assert_log_is_type(logs, 0, attributeChanged, element, ['style', null, 'colo
r: red;', null]); |
| 101 | 101 |
| 102 element.style.color = 'green'; | 102 element.style.color = 'green'; |
| 103 assert_equals(logs.length, 2); | 103 assert_equals(logs.length, 2); |
| 104 assert_log_is_type(logs, 1, attributeChanged, element, ['style', 'color: red
;', 'color: green;', '']); | 104 assert_log_is_type(logs, 1, attributeChanged, element, ['style', 'color: red
;', 'color: green;', null]); |
| 105 | 105 |
| 106 element.style.color = ''; | 106 element.style.color = ''; |
| 107 assert_equals(logs.length, 3); | 107 assert_equals(logs.length, 3); |
| 108 assert_log_is_type(logs, 2, attributeChanged, element, ['style', 'color: gre
en;', null, '']); | 108 assert_log_is_type(logs, 2, attributeChanged, element, ['style', 'color: gre
en;', null, null]); |
| 109 }, 'style.color should enqueue attributeChangedCallback for style attribute'); | 109 }, 'style.color should enqueue attributeChangedCallback for style attribute'); |
| 110 | 110 |
| 111 test_with_window(w => { | 111 test_with_window(w => { |
| 112 let document = w.document; | 112 let document = w.document; |
| 113 let element = document.createElement('a-a'); | 113 let element = document.createElement('a-a'); |
| 114 document.body.appendChild(element); | 114 document.body.appendChild(element); |
| 115 let logs = define_logger(w, ['style']); | 115 let logs = define_logger(w, ['style']); |
| 116 | 116 |
| 117 logs.length = 0; | 117 logs.length = 0; |
| 118 element.style.cssText = 'color: red'; | 118 element.style.cssText = 'color: red'; |
| 119 assert_equals(logs.length, 1); | 119 assert_equals(logs.length, 1); |
| 120 assert_log_is_type(logs, 0, attributeChanged, element, ['style', null, 'colo
r: red;', '']); | 120 assert_log_is_type(logs, 0, attributeChanged, element, ['style', null, 'colo
r: red;', null]); |
| 121 }, 'style.cssText should enqueue attributeChangedCallback for style attribute'
); | 121 }, 'style.cssText should enqueue attributeChangedCallback for style attribute'
); |
| 122 | 122 |
| 123 test_with_window(w => { | 123 test_with_window(w => { |
| 124 let document = w.document; | 124 let document = w.document; |
| 125 let element = document.createElement('a-a'); | 125 let element = document.createElement('a-a'); |
| 126 document.body.appendChild(element); | 126 document.body.appendChild(element); |
| 127 let logs = define_logger(w, ['style']); | 127 let logs = define_logger(w, ['style']); |
| 128 | 128 |
| 129 logs.length = 0; | 129 logs.length = 0; |
| 130 element.style.setProperty('color', 'red'); | 130 element.style.setProperty('color', 'red'); |
| 131 assert_equals(logs.length, 1); | 131 assert_equals(logs.length, 1); |
| 132 assert_log_is_type(logs, 0, attributeChanged, element, ['style', null, 'colo
r: red;', '']); | 132 assert_log_is_type(logs, 0, attributeChanged, element, ['style', null, 'colo
r: red;', null]); |
| 133 | 133 |
| 134 element.style.removeProperty('color', 'red'); | 134 element.style.removeProperty('color', 'red'); |
| 135 assert_equals(logs.length, 2); | 135 assert_equals(logs.length, 2); |
| 136 assert_log_is_type(logs, 1, attributeChanged, element, ['style', 'color: red
;', null, '']); | 136 assert_log_is_type(logs, 1, attributeChanged, element, ['style', 'color: red
;', null, null]); |
| 137 }, 'style.setProperty/removeProperty should enqueue attributeChangedCallback f
or style attribute'); | 137 }, 'style.setProperty/removeProperty should enqueue attributeChangedCallback f
or style attribute'); |
| 138 | 138 |
| 139 test_with_window(w => { | 139 test_with_window(w => { |
| 140 let document = w.document; | 140 let document = w.document; |
| 141 let element = document.createElement('a-a'); | 141 let element = document.createElement('a-a'); |
| 142 document.body.appendChild(element); | 142 document.body.appendChild(element); |
| 143 let logs = define_logger(w, ['style']); | 143 let logs = define_logger(w, ['style']); |
| 144 | 144 |
| 145 logs.length = 0; | 145 logs.length = 0; |
| 146 element.style.cssFloat = 'left'; | 146 element.style.cssFloat = 'left'; |
| 147 assert_equals(logs.length, 1); | 147 assert_equals(logs.length, 1); |
| 148 assert_log_is_type(logs, 0, attributeChanged, element, ['style', null, 'floa
t: left;', '']); | 148 assert_log_is_type(logs, 0, attributeChanged, element, ['style', null, 'floa
t: left;', null]); |
| 149 }, 'style.cssFloat should enqueue attributeChangedCallback for style attribute
'); | 149 }, 'style.cssFloat should enqueue attributeChangedCallback for style attribute
'); |
| 150 | 150 |
| 151 test_with_window(w => { | 151 test_with_window(w => { |
| 152 let document = w.document; | 152 let document = w.document; |
| 153 let element = document.createElement('a-a'); | 153 let element = document.createElement('a-a'); |
| 154 document.body.appendChild(element); | 154 document.body.appendChild(element); |
| 155 let logs = define_logger(w, ['lang']); | 155 let logs = define_logger(w, ['lang']); |
| 156 | 156 |
| 157 logs.length = 0; | 157 logs.length = 0; |
| 158 element.lang = 'ja-jp'; | 158 element.lang = 'ja-jp'; |
| 159 assert_equals(logs.length, 1); | 159 assert_equals(logs.length, 1); |
| 160 assert_log_is_type(logs, 0, attributeChanged, element, ['lang', null, 'ja-jp
', '']); | 160 assert_log_is_type(logs, 0, attributeChanged, element, ['lang', null, 'ja-jp
', null]); |
| 161 }, 'lang property setter should enqueue attributeChangedCallback for lang attr
ibute'); | 161 }, 'lang property setter should enqueue attributeChangedCallback for lang attr
ibute'); |
| 162 | 162 |
| 163 test_with_window(w => { | 163 test_with_window(w => { |
| 164 let document = w.document; | 164 let document = w.document; |
| 165 let element = document.createElement('a-a'); | 165 let element = document.createElement('a-a'); |
| 166 element.setAttribute('x', '1'); | 166 element.setAttribute('x', '1'); |
| 167 document.body.appendChild(element); | 167 document.body.appendChild(element); |
| 168 let logs = define_logger(w, ['x']); | 168 let logs = define_logger(w, ['x']); |
| 169 | 169 |
| 170 logs.length = 0; | 170 logs.length = 0; |
| 171 element.removeAttribute('x'); | 171 element.removeAttribute('x'); |
| 172 assert_log_is_type(logs, 0, attributeChanged, element, ['x', '1', null, ''])
; | 172 assert_log_is_type(logs, 0, attributeChanged, element, ['x', '1', null, null
]); |
| 173 assert_equals(logs.length, 1); | 173 assert_equals(logs.length, 1); |
| 174 }, 'removeAttribute should enqueue attributeChangedCallback'); | 174 }, 'removeAttribute should enqueue attributeChangedCallback'); |
| 175 | 175 |
| 176 test_with_window(w => { | 176 test_with_window(w => { |
| 177 let document = w.document; | 177 let document = w.document; |
| 178 let element = document.createElement('a-a'); | 178 let element = document.createElement('a-a'); |
| 179 document.body.appendChild(element); | 179 document.body.appendChild(element); |
| 180 let logs = define_logger(w, ['x']); |
| 181 logs.length = 0; |
| 182 |
| 183 element.setAttributeNS('urn:foo', 'x', '1'); |
| 184 assert_log_is_type(logs, 0, attributeChanged, element, ['x', null, '1', 'urn
:foo']); |
| 185 assert_equals(logs.length, 1); |
| 186 |
| 187 element.removeAttributeNS('urn:foo', 'x'); |
| 188 assert_log_is_type(logs, 1, attributeChanged, element, ['x', '1', null, 'urn
:foo']); |
| 189 assert_equals(logs.length, 2); |
| 190 }, 'attributeChangedCallback should transmit namespaces'); |
| 191 |
| 192 test_with_window(w => { |
| 193 let document = w.document; |
| 194 let element = document.createElement('a-a'); |
| 195 document.body.appendChild(element); |
| 180 let logs = define_logger(w); | 196 let logs = define_logger(w); |
| 181 | 197 |
| 182 logs.length = 0; | 198 logs.length = 0; |
| 183 element.remove(); | 199 element.remove(); |
| 184 assert_log_is_type(logs, 0, disconnected, element); | 200 assert_log_is_type(logs, 0, disconnected, element); |
| 185 assert_equals(logs.length, 1); | 201 assert_equals(logs.length, 1); |
| 186 }, 'remove should enqueue disconnectedCallback'); | 202 }, 'remove should enqueue disconnectedCallback'); |
| 187 })(); | 203 })(); |
| 188 </script> | 204 </script> |
| 189 </body> | 205 </body> |
| OLD | NEW |