elastic / elastic/eui

[Strict Mode] EuiMutationObserver doesn't work

Open
#8,788 3 comments 0 reactions 0 assignees View on GitHub
help wanted
Dominant language
TypeScript
Stars
6.4k
Forks
911
Avg merge
2d 11h
Merged PRs (30d)
65

Description

**Describe the bug**

When Strict Mode is enabled, `EuiMutationObserver` doesn't work. Mutations are not being registered.

[Docs page](https://eui.elastic.co/docs/utilities/mutation-observer/)

| Strict Mode | No Strict Mode |
| ------------ | --------------- |
| ![Image](https://github.com/user-attachments/assets/d7eaa48d-35d7-4eea-9394-e51246dfab44) | ![Image](https://github.com/user-attachments/assets/24375244-94ed-4f73-9339-cc28c0d89d74) |

**Impact and severity**

It impacts all end-users of our consumers. **Severe**.

There is **no known workaround**.

[[Search](https://github.com/search?q=repo%3Aelastic%2Feui+%3CEuiMutationObserver&type=code)] `EuiMutationObserver` is used internally in:
- `EuiDataGrid` ([Kibana](https://github.com/search?q=repo%3Aelastic%2Fkibana+%3CEuiDataGrid&type=code), 71)
- `EuiPopover` ([Kibana](https://github.com/search?q=repo%3Aelastic%2Fkibana+%3CEuiPopover&type=code), 512)

[[Search](https://github.com/search?q=repo%3Aelastic%2Fkibana+%3CEuiMutationObserver&type=code)] `EuiMutationObserver` is used 2 times in Kibana

**Environment and versions**

- EUI version: ~
- React version: React 18 (Strict Mode)
- Kibana version (if applicable): ~
- Browser: ~
- Operating System: ~

**Minimum reproducible sandbox**

[Codesandbox](https://codesandbox.io/p/sandbox/frosty-brook-wc5dw6)

**To Reproduce**

1. Enable Strict Mode.
2. Render `EuiMutationObserver`.
3. Notice that the changes observed are not actually registered and output.

**Expected behavior**

`EuiMutationObserver` works correctly and changes are registered and output correctly.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.