adobe / adobe/spectrum-web-components

[Bug]: fickle navigation with large submenus

Open
#5,904 1 comment 0 reactions 1 assignee Claimed by @blunteshwar View on GitHub
bug Component:Menu SEV 2 Status:WIP
Dominant language
TypeScript
Stars
1.5k
Forks
262
Avg merge
3d 10h
Merged PRs (30d)
68

Description

### Code of conduct

- [x] I agree to follow this project's code of conduct.

### Impacted component(s)

sp-menu, sp-menu-item

### Library version

@spectrum-web-components/1.7.0

### Expected behavior

_No response_

### Actual behavior

When working with large submenus, users have to perfectly mouse laterally on x-axis to the submenu and then they can mouse over the submenu items on the y-axis.

Users cannot go directly from the submenu trigger to the first submenu menu item (like along the hypotenuse of a triangle).

Here are two different options in solving this problem w/ sub-menus:

1. Introduce a delay (better)
2. Use triangulation (best)

https://bjk5.com/post/44698559168/breaking-down-amazons-mega-dropdown

### Screenshots

_No response_

### What browsers are you seeing the problem in?

_No response_

### How can we reproduce this issue?

1. Go to '...'
2. Click on '....'
3. Scroll to '....'
4. Check console
5. See error

### Sample code or abstract reproduction which illustrates the problem

_No response_

### Severity

None

### Logs taken while reproducing problem

_No response_

### Would you like to track this issue in Jira?

- [ ] Yes, please tell me the ticket number!

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.