| <html> |
| <import src="../resources/chai.sky" /> |
| <import src="../resources/mocha.sky" /> |
| <div id="range"></div> |
| <script> |
| describe('MutationObservers', function() { |
| it('should handle shadow dom', function() { |
| function mutate(element) { |
| element.setAttribute('data-foo', 'bar'); |
| element.insertBefore(document.createTextNode('hello'), element.firstChild); |
| element.firstChild.textContent = 'goodbye'; |
| element.removeChild(element.firstChild); |
| } |
| |
| var range = document.getElementById('range'); |
| var shadowRoot = range.ensureShadowRoot(); |
| shadowRoot.appendChild(document.createElement('div')); |
| var observer = new MutationObserver(function() { }); |
| |
| observer.observe(shadowRoot.firstChild, {attributes: true, childList: true, characterData: true, subtree: true}); |
| mutate(shadowRoot.firstChild); |
| |
| var mutations = observer.takeRecords(); |
| // Mutations in shadow DOM should have been observed: |
| assert.equal(mutations.length, 4); |
| assert.equal(mutations[0].type, "attributes"); |
| assert.equal(mutations[1].type, "childList"); |
| assert.equal(mutations[2].type, "characterData"); |
| assert.equal(mutations[3].type, "childList"); |
| observer.disconnect(); |
| |
| mutations = observer.takeRecords(); |
| observer.observe(document, {attributes: true, childList: true, characterData: true, subtree: true}); |
| mutate(shadowRoot.firstChild); |
| // Observing from outside shadow DOM should not see mutations in the shadow: |
| assert.equal(mutations.length, 0); |
| }); |
| }); |
| </script> |
| </html> |
