EUI Popover Defaults and Debugging

Sometimes the most meaningful design-system work isn’t adding new components — it’s tightening the defaults everyone relies on.
This PR focused on cleaning up long-standing inconsistencies in EuiPopover and, in the process, revealed a hidden bug that had quietly lingered for years.

Challenge

EuiPopover underpins several interactive patterns across Kibana such as menus, tours, and actions. As we set out to modernize our UI, it was suggested - and quickly aligned - that we change the default styling to not show the small arrow along the edge of the panel.

As is often the case, nothing is so simple in a design system.

Idea

The changes seemd simple enough - disable the arrow, set a new anchor position, and tighten the offset. To achive this, I would open a PR, change the default for pre-existing props on EuiPopover, and be on my way.

Instead, a tricky bug surfaced that affected placement of the popover relative to its anchor. When no arrow was present, the calculations to determine if ample space was present - in the desired direction - were returning inaccurate ‘scores’. These scores are used to determine whether the desired direction of opening of popover had sufficient space.

AI Workflow

• ChatGPT helped audit the component API and summarize how EuiPopover props were used across the library.
• Cursor accelerated implementation — adjusting defaults, refactoring test cases, and suggesting fixes when type errors appeared.
• As I ran tests, several unrelated failures surfaced. Digging deeper, I realized I’d uncovered a bug in the score calculation that broke Popover positioning.
• I used Cursor and ChatGPT together to trace the bug — combining diff inspection, logging, and step-through debugging until the underlying issue was clear.
• After isolating the cause, I pushed an additional fix that resolved the hidden bug and cleaned up the related end-to-end tests.

Outcome

• Achieved desired default style and positioning
• Fixed a long-standing space calculation bug uncovered during test builds
• Fixed a second bug where existing logic would favor the first position with a perfect score, regardless of consumer preference
• Improved Cypress test configuration and reliability for future regressions
• Created a PR that will modernize popover styles across EUI-based products

The fix will be shipped quietly, but its effects are visible everywhere Popover appears.

Reflection

This one started as a “quick cleanup” but turned into a detective story.

Finding and fixing that hidden bug was a reminder that attention to defaults isn’t busywork — it’s craftsmanship.
AI tools sped up the tedious parts so I could focus on the reasoning and validation, making the system stronger for everyone downstream. In the end, with the help of tooling, I learned how the component worked and was more certain of the fix being proposed in my PR.