accessibility-insights-web
accessibility-insights-web copied to clipboard
microsoft
Left nav lacks clear tab or focus indicators with Windows HC modes
Describe the bug
If you enable a Windows HC mode, the left nav pane loses both the hover indicator and the current selection indicators
To Reproduce Steps to reproduce the behavior:
- Start an assessment on a page (I used )
- Hover over the assessment steps in the nav pane -- there's no strong visual feedback (except the tooltip if you pause long enough)
- Select an item in the list--there should be a clear indicator that it's selected, but the only indication seems to be a bolding of text (which is much harder to discern than the non-HC version)
- See error
Alternatively, run FastPass--all 3 steps in the nav bar look more or less the same
CodePen repro example
Expected behavior
There should be clearly visible counterparts of the selection in HC modes
Screenshots
In these screenshots, the mouse hover is on "3 Focus", and the selection is on "3.1 Visible Focus". The only The Black-based HC themes show a "thumb"
| HC Mode | Screenshot |
|---|---|
| None |  |
| HC 1 |  |
| HC 2 |  |
| HC Black |  |
| HC White |  |
Context (please complete the following information)
- OS Name & Version: Windows 10 21H1
- AI-Web Version & Environment: 2.26.0 Production
- Browser Version: Chrome Version 90.0.4430.212 (Official Build) (64-bit)
- Target Page: https://www.washington.edu/accesscomputing/AU/before.html
Are you willing to submit a PR?
Did you search for similar existing issues?
Additional context
This issue has been marked as ready for team triage; we will triage it in our weekly review and update the issue. Thank you for contributing to Accessibility Insights!
This issue requires additional investigation by the Accessibility Insights team. When the issue is ready to be triaged again, we will update the issue with the investigation result and add "status: ready for triage". Thank you for contributing to Accessibility Insights!
@jlperkins could you please help us verify if this issue still repos after the Fluent update?
With the latest changes in main, and the new HC modes in Windows 11, this issue still repros. Note that I am unable to check on Windows 10 HC modes since I have already upgraded. For the Windows 11 modes, as seen in the images below, the assessment step gets a small colored bar to the side and text is bolded; but there is no strong indication that you have selected that test or are on that step of the assessment. This is different than in regular mode, where the entire nav item is highlighted a different color.
[Theme 1, Aquatic]
[Theme 2, Desert]
[Theme 3, Dusk]
[Theme 4, Night Sky]
@nang4ally Please review below screenshots if they are the desired outcomes for this bug or any changes required in this.
In these screenshots, the mouse hover is on "3 Focus", and the selection is on "3.1 Visible Focus"
[Theme 1 Aquatic]
[Theme 2 Desert]
[Theme 3 Dusk]
[Theme 4 Night Sky]
@peterdur FYI
