![(please configure the [header_logo] section in trac.ini)](/chrome/site/your_project_logo.png){kind=logo}
Opened 6 weeks ago
Last modified 4 days ago
#65419 accepted defect (bug)
In the Add Themes and Plugins page, active tabs are not visible in Windows High Contrast Mode
| Reported by: | wildworks | Owned by: | joedolson |
|---|---|---|---|
| Priority: | normal | Milestone: | 7.1 |
| Component: | General | Version: | |
| Severity: | normal | Keywords: | has-patch needs-testing |
| Cc: | Focuses: | accessibility |
Description
In the Add Themes and Plugins page, active tabs are indicated by a colored bottom border. On the other hand, inactive tabs have a white-colored bottom border. When Windows High Contrast Mode is enabled, the border color of the active tab does not render, making it difficult for users to identify which tab is currently selected.
Attachments (3)
Change History (14)
This ticket was mentioned in PR #12107 on WordPress/wordpress-develop by @nimeshatxecurify.
6 weeks ago
#1
- Keywords has-patch added
This ensures that the current filter link is visually distinguishable when a high-contrast theme is enabled by using the Highlight system color for the bottom border.
Trac ticket: https://core.trac.wordpress.org/ticket/65419
## Use of AI Tools
N / A
#2
@
6 weeks ago
Before the patch, the active tab indicator (colored bottom border) was not visible in High Contrast Mode, making it impossible to distinguish the active tab from inactive ones.
After applying the patch, the active tab is clearly visible and distinguishable from inactive tabs in High Contrast Mode.
Refer Below Images :
Before Patch :
https://postimg.cc/cgK5PkKg
After Patch :
https://postimg.cc/tYGmm59y
#3
@
6 weeks ago
Thanks for working on this.
After applying the patch, the active tab is clearly visible and distinguishable from inactive tabs in High Contrast Mode.
In Windows High Contrast Mode, a border is visually rendered even when transparent is specified for the border color. While PR 12107 does indeed differentiate border colors between active and inactive tabs, Windows High Contrast Mode is fundamentally used by users with low vision, color vision deficiencies, or light sensitivity to improve readability by increasing the contrast between text and background. Users relying on Windows High Contrast Mode may not necessarily be able to distinguish between active and inactive border colors. Therefore, I believe borders should not be rendered at all for inactive tabs.
This ticket was mentioned in Slack in #core by abdullahramzan. View the logs.
6 weeks ago
This ticket was mentioned in Slack in #accessibility by joedolson. View the logs.
5 weeks ago
#8
@
4 weeks ago
Tested the patch on a local WordPress installation.
Before applying the patch, the active tab indicator was difficult to identify when Windows High Contrast Mode was enabled because the bottom border was not visible.
After applying the patch, the active tab is clearly distinguishable in Windows High Contrast Mode, making it easier for users to identify the currently selected tab.
I did not observe any visual regressions in normal display mode.
Patch tested successfully. ✅
#9
@
4 weeks ago
- Keywords needs-testing removed
Test Report
Patch tested: https://github.com/WordPress/wordpress-develop/pull/12107
Environment
- WordPress: 7.1-alpha-62161-src
- Subdirectory: No
- PHP: 8.3.31
- Server: nginx/1.31.1
- Database: mysqli (Server: 8.4.9 / Client: mysqlnd 8.3.31)
- Browser: Chrome 149.0.0.0
- OS: Windows 10/11
- Theme: Twenty Twenty-Five 1.5
- MU Plugins: None activated
- Plugins:
- Test Reports 1.3.0
Steps taken
- Turn on Windows high contrast mode.
- Head to Add Theme & Add Plugin page and check if inactive tabs are indicated by a colored bottom border before and after the patch.
- ✅ Patch is solving the problem
Expected result
- Inactive tabs don't have a bottom border now. Users using Windows High Contrast can differentiate the state of the tabs.
Additional Notes
In Windows High Contrast Mode, a border is visually rendered even when transparent is specified for the border color. While PR 12107 does indeed differentiate border colors between active and inactive tabs, Windows High Contrast Mode is fundamentally used by users with low vision, color vision deficiencies, or light sensitivity to improve readability by increasing the contrast between text and background. Users relying on Windows High Contrast Mode may not necessarily be able to distinguish between active and inactive border colors. Therefore, I believe borders should not be rendered at all for inactive tabs.
- With the current update of
border-bottom-color: Canvas;, it fixes the issue mentioned above.
Screenshots/Screencast with results
- Updating ticket keywords by removing
needs-testingunless further testing is required.
| Before | After |
|---|---|
| Add Plugin Page | |
 | 
|
| Add Theme Page | |
 | 
|
#10
@
4 weeks ago
I tested PR 12107 locally.
Environment:
- WordPress: trunk with PR 12107 applied
- OS: Windows 11
- Browsers tested:
- Chrome 149
- Edge 149
- Firefox 151
- Display mode: Windows High Contrast / forced-colors mode
- Pages tested: Add Plugins and Add Themes
Results:
- Confirmed the active tab is visually distinguishable in forced-colors mode.
- Confirmed inactive tabs no longer show the misleading bottom border.
- Confirmed the Add Plugins and Add Themes tab states remain understandable in normal display mode.
- Checked the browser console while testing and did not observe related errors.
- I did not observe visual regressions in the tested environment.
This looks good in my testing.
The difference between default mode and Windows High Contrast mode on the Add Themes and Add Plugins pages