OLD | NEW |
1 <html> | 1 <html> |
2 <import src="../resources/chai.sky" /> | 2 <import src="../resources/chai.sky" /> |
3 <import src="../resources/mocha.sky" /> | 3 <import src="../resources/mocha.sky" /> |
4 <div id="range"></div> | 4 <div id="range"></div> |
5 <script> | 5 <script> |
6 describe('MutationObservers', function() { | 6 describe('MutationObservers', function() { |
7 it('should handle shadow dom', function() { | 7 it('should handle shadow dom', function() { |
8 function mutate(element) { | 8 function mutate(element) { |
9 element.setAttribute('data-foo', 'bar'); | 9 element.setAttribute('data-foo', 'bar'); |
10 element.insertBefore(document.createTextNode('hello'), element.firstChild)
; | 10 element.insertBefore(document.createTextNode('hello'), element.firstChild)
; |
11 element.firstChild.textContent = 'goodbye'; | 11 element.firstChild.textContent = 'goodbye'; |
12 element.removeChild(element.firstChild); | 12 element.removeChild(element.firstChild); |
13 } | 13 } |
14 | 14 |
15 var range = document.getElementById('range'); | 15 var range = document.getElementById('range'); |
16 var shadowRoot = range.createShadowRoot(); | 16 var shadowRoot = range.ensureShadowRoot(); |
17 shadowRoot.appendChild(document.createElement('div')); | 17 shadowRoot.appendChild(document.createElement('div')); |
18 var observer = new MutationObserver(function() { }); | 18 var observer = new MutationObserver(function() { }); |
19 | 19 |
20 observer.observe(shadowRoot.firstChild, {attributes: true, childList: true,
characterData: true, subtree: true}); | 20 observer.observe(shadowRoot.firstChild, {attributes: true, childList: true,
characterData: true, subtree: true}); |
21 mutate(shadowRoot.firstChild); | 21 mutate(shadowRoot.firstChild); |
22 | 22 |
23 var mutations = observer.takeRecords(); | 23 var mutations = observer.takeRecords(); |
24 // Mutations in shadow DOM should have been observed: | 24 // Mutations in shadow DOM should have been observed: |
25 assert.equal(mutations.length, 4); | 25 assert.equal(mutations.length, 4); |
26 assert.equal(mutations[0].type, "attributes"); | 26 assert.equal(mutations[0].type, "attributes"); |
27 assert.equal(mutations[1].type, "childList"); | 27 assert.equal(mutations[1].type, "childList"); |
28 assert.equal(mutations[2].type, "characterData"); | 28 assert.equal(mutations[2].type, "characterData"); |
29 assert.equal(mutations[3].type, "childList"); | 29 assert.equal(mutations[3].type, "childList"); |
30 observer.disconnect(); | 30 observer.disconnect(); |
31 | 31 |
32 mutations = observer.takeRecords(); | 32 mutations = observer.takeRecords(); |
33 observer.observe(document, {attributes: true, childList: true, characterData
: true, subtree: true}); | 33 observer.observe(document, {attributes: true, childList: true, characterData
: true, subtree: true}); |
34 mutate(shadowRoot.firstChild); | 34 mutate(shadowRoot.firstChild); |
35 // Observing from outside shadow DOM should not see mutations in the shadow: | 35 // Observing from outside shadow DOM should not see mutations in the shadow: |
36 assert.equal(mutations.length, 0); | 36 assert.equal(mutations.length, 0); |
37 }); | 37 }); |
38 }); | 38 }); |
39 </script> | 39 </script> |
40 </html> | 40 </html> |
OLD | NEW |