Opened 4 weeks ago
Last modified 2 weeks ago
#65250 accepted defect (bug)
Mouse cursor interaction inconsistency for the first submenu item when “Collapse Menu” is enabled in the WP-Admin
| Reported by: |
|
Owned by: |
|
|---|---|---|---|
| Milestone: | 7.1 | Priority: | normal |
| Severity: | normal | Version: | 5.9 |
| Component: | Administration | Keywords: | has-patch |
| Focuses: | ui, accessibility, css, administration | Cc: |
Description
Summary:
When the “Collapse Menu” option is enabled in WP-Admin, the first submenu item under certain admin menu sections does not display a clickable cursor on hover, while the remaining submenu items behave correctly.
Description:
While testing the latest WordPress development version(7.0-RC4), I noticed an inconsistency in submenu hover interactions when the admin sidebar is collapsed using the “Collapse Menu” option.
After collapsing the admin menu:
Hover over a menu item that contains submenus (for example: Tools)
The submenu panel appears as expected
However, the first submenu item does not display the expected clickable pointer cursor behavior on hover
The remaining submenu items correctly show the interactive hover/click cursor
The submenu item itself still appears functional/clickable, but the cursor behavior creates a minor UI inconsistency and may affect perceived usability.
This issue appears to affect only the first submenu item in the expanded flyout menu.
Steps to Reproduce:
Install the latest WordPress development version (7.0-RC4)
Log in to WP-Admin
Enable “Collapse Menu” from the admin sidebar
Hover over a menu item with submenus (e.g. Tools)
Move the mouse over the first submenu item
Observe that the cursor does not behave consistently compared to the other submenu items
Video Demonstration: https://www.youtube.com/watch?v=eg2lBtBrKHg (YouTube Unlisted URL)
Expected Behavior:
All submenu items should display consistent hover and clickable cursor behavior.
Actual Behavior:
The first submenu item does not show the expected interactive cursor behavior, while the remaining submenu items behave correctly.
Environment:
WordPress Version: Latest development version: (7.0-RC4)
Browser: Chrome: Version 148.0.7778.168
Operating System: macOS: 15.7.3
Active Theme: Twenty Twenty-FiveVersion: 1.4
Active Plugins: N/A
Additional Notes:
The issue appears to be UI/UX related rather than functional
The submenu item remains clickable despite the cursor inconsistency
The behavior appears specifically when the admin sidebar is collapsed
Other submenu items in the same flyout menu appear unaffected
Suggested Improvement:
Review the hover/cursor interaction behavior for the first submenu item in collapsed admin sidebar flyout menus to ensure consistent UI feedback and interaction behavior across all submenu items.
Change History (7)
#4
@
4 weeks ago
- Component changed from General to Administration
- Version changed from trunk to 5.9
[51684] correctly removed the pointer cursor from any list item, but common.js makes the .wp-submenu-head item clickable.
This could add the cursor rule for the special case, only when JS is enabled:
.js #adminmenu .wp-submenu .wp-submenu-head {
cursor: pointer;
}
This ticket was mentioned in Slack in #accessibility by joedolson. View the logs.
2 weeks ago
#6
@
2 weeks ago
- Milestone changed from Awaiting Review to 7.1
- Owner set to joedolson
- Status changed from new to accepted
This ticket was mentioned in PR #11986 on WordPress/wordpress-develop by @swapnil1010.
2 weeks ago
#7
- Keywords has-patch added
Administration: Fix submenu cursor inconsistency in collapsed admin menu.
Props mazharulrobeen.
Fixes #65250.
## What?
Fixes inconsistent mouse cursor behavior for the first submenu item in collapsed WP-Admin sidebar menus.
## Problem
When the admin sidebar is collapsed, the first submenu item (.wp-submenu-head) does not display the expected pointer cursor on hover, while the remaining submenu items behave correctly.
The submenu item remains clickable, but the inconsistent cursor behavior creates a UI/UX inconsistency.
## Solution
Adds a pointer cursor rule for:
.js #adminmenu .wp-submenu .wp-submenu-head { cursor: pointer; }
This ensures consistent hover interaction behavior across all submenu items.
## Testing Instructions
- Open WP-Admin
- Collapse the admin sidebar using “Collapse Menu”
- Hover over a menu item with submenus (example: Tools)
- Hover over the first submenu item
- Verify the pointer cursor now appears correctly
## Before
https://github.com/user-attachments/assets/f9d2b669-354b-4f00-a366-b35d908c2dd1
## After
https://github.com/user-attachments/assets/1b235c2d-63e8-4f27-afc8-c6d1f734df21
Trac ticket: https://core.trac.wordpress.org/ticket/65250
## Use of AI Tools
AI assistance: No
---
This Pull Request is for code review only. Please keep all other discussion in the Trac ticket. Do not merge this Pull Request. See GitHub Pull Requests for Code Review in the Core Handbook for more details.
I have also noticed and issue detected for menu cursor issue. Also top sub menu in more space under bottom.