[EuiBottomBar] Fixed position shouldn't mount into a portal by default
- Dominant language
- TypeScript
- Stars
- 6.4k
- Forks
- 911
- Avg merge
- 2d 11h
- Merged PRs (30d)
- 65
Description
## 📓 Summary
When using the `EuiBottomBar`component, when `position="sticky"`, the bottom bar is mounted as a normal React node, and it works correctly.
When `position` is not specified, the default value is `fixed`.
This would work perfectly fine if it were only applying changes to the CSS layout, as the fixed position doesn't affect the DOM node position.
However, there is an issue here. When `position="fixed"` (explicitly or by default) the `usePortal` property starts playing a role. As this is truthy by default, it implicitly applies the behaviour of creating the bar inside a portal, appending the new DOM node at the end of the body tag.
Sometimes, this results in the following error, which crashes the page with an unhandled error:
To prevent this behavior and purely rely on the CSS positioning, `usePortal` must be explicitly set to false. This guarantees the expected behaviour for the `EuiBottomBar` component on a fixed positioning.
This implicit behaviour seems dangerous and could lead to unexpected crashes. I wonder if the portal usage should be off by default and if we actually need it to even be there for some reason.
Contributor guide
Assessment
This issue has not been assessed yet.