diff --git a/CHANGELOG.md b/CHANGELOG.md index 7059e2351c4..28587fd46ef 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,8 @@ ## [`master`](https://github.com/elastic/eui/tree/master) -No public interface changes since `13.1.0`. +**Bug fixes** + +- Fixed `EuiMutationObserver` errors in IE11 by conditionally setting the `attributes` observer option according to the new spec ([#2180](https://github.com/elastic/eui/pull/2180)) ## [`13.1.0`](https://github.com/elastic/eui/tree/v13.1.0) diff --git a/src/components/observer/mutation_observer/mutation_observer.ts b/src/components/observer/mutation_observer/mutation_observer.ts index 9d64c5f0609..0430fa68fbd 100644 --- a/src/components/observer/mutation_observer/mutation_observer.ts +++ b/src/components/observer/mutation_observer/mutation_observer.ts @@ -12,7 +12,22 @@ export class EuiMutationObserver extends EuiObserver { name = 'EuiMutationObserver'; beginObserve = () => { + // IE11 and the MutationObserver polyfill used in Kibana (for Jest) implement + // an older spec in which specifying `attributeOldValue` or `attributeFilter` + // without specifying `attributes` results in a `SyntaxError`. + // The following logic patches the newer spec in which `attributes: true` can be + // implied when appropriate (`attributeOldValue` or `attributeFilter` is specified). + const observerOptions: MutationObserverInit = { + ...this.props.observerOptions, + }; + const needsAttributes = + observerOptions.hasOwnProperty('attributeOldValue') || + observerOptions.hasOwnProperty('attributeFilter'); + if (needsAttributes && !observerOptions.hasOwnProperty('attributes')) { + observerOptions.attributes = true; + } + this.observer = new MutationObserver(this.props.onMutation); - this.observer.observe(this.childNode!, this.props.observerOptions); + this.observer.observe(this.childNode!, observerOptions); }; }