webcomponents / webcomponents/polyfills
[ShadyDOM] Mutation Observer callback is not called for shadow hosts
- Dominant language
- HTML
- Stars
- 1.2k
- Forks
- 168
- PR merge metrics
- No merged PRs in 30d
Description
### Description
Mutation Observer callback is not called when elements are added or removed from shadow host.
```html
shadowHost.attachShadow({mode:'open'}).innerHTML = `<div><slot></slot></div>`;
var hostObserverCalled = false;
(new MutationObserver((mutationsList)=>{
console.info('mutated');
hostObserverCalled = true;
})).observe(shadowHost, { childList: true });
shadowHost.appendChild(document.createElement('div'));
setTimeout(()=>{
console.assert(hostObserverCalled, 'Shadow hot\s mutation observer callback should be eventually called.');
}, 500);
```
#### Live Demo
https://glitch.com/edit/#!/mutationobserver-on-shadowhost?path=index.html:15:41
#### Steps to Reproduce
1. Attach shadow root to an element.
2. Attach mutation observer `{childList: true}` and observe the element.
3. Create `div`.
4. Append `div` to the element or remove existing element.
#### Expected Results
Mutation observer callback should get called
#### Actual Results
The callback is not called
### Browsers Affected
- [ ] Chrome
- [x] Firefox
- [x] Edge
- [?] Safari 9
- [?] Safari 8
- [x] IE 11
### Versions
- webcomponents: v2.0.2
Contributor guide
Assessment
This issue has not been assessed yet.