cauldron icon indicating copy to clipboard operation
cauldron copied to clipboard

Published 20 hours ago • verified publisher icon dequelabs

Bug: TopBar menu does not close upon clicking left nav links

Open shawnsharpDQ opened this issue 2 years ago • 1 comments

Steps to reproduce

  • Open the TopBar menu in Cauldron
  • Do not click any of the menu options
  • Click any of the navigation links in the left pane (e.g. Introduction > Component Guidelines)
  • TopBar menu is still open

Expected Behavior

TopBar menu should close upon clicking outside the menu

Actual Behavior

TopBar menu stays open upon clicking outside nav links

Version

5.9.1

What browsers are you experiencing the problem on?

Firefox, Chrome, Safari

Relevant log output

No response

Anything else we should know?

No response

shawnsharpDQ avatar Oct 20 '23 17:10 shawnsharpDQ

I dug into this. The underlying cause is that ClickOutsideListener checks for default prevented:

https://github.com/dequelabs/cauldron/blob/e93ae35e849e875a2d11efd0c05118cf8a9323a7/packages/react/src/components/ClickOutsideListener/index.tsx#L28-L30

In documentation, navigation links prevent default to prevent the link from performing a navigation. I'm not sure what solution we could apply here for that to not happen, but since this is specific to documentation this is a low priority.

scurker avatar Dec 13 '23 20:12 scurker