A11y Testing for vscodeedu.com - VS Code UI Toolkit doesn't adapt to Windows High Contrast themes

[IanMatthewHuff]

Context: Pasted below is a the contents of a linked bug from vscode for edu testing. We use vscode.dev + the vscode webview UI toolkit to provide our UI. In a recent accessibility pass we had a couple of bugs filed that I believe the UI toolkit would need to either resolve or make the choice to not resolve for now.

For this issue the overall Windows visual theme is changed to either high contrast aquatic or desert themes. In the browser window it's expected that the theming would now match this choice. Personally I think that the VS Code theme choices would cover this, but not sure if that meets overall A11y accessibility requirements.

Original bug: https://github.com/microsoft/vscode-edu-extension/issues/1078

Text of Original bug:

Describe the Bug

In High contrast (desert/aquatic) theme focus is not visible on the “checkbox” Note:

1. Similar issue is observed in Example True/False Question page scenarios also.
2. Similar issue is observed on "overview", "Objectives", "Prerequisites" tabitems.

Github Tags: #A11yMAS; #A11yTCS; #A11ySev2; #DesktopWeb; #Visual Studio Code For Education ; #GH-VisualStudioCodeforEducation-Web-Aug2023; #MAS4.3.1; #No Disruption of Accessibility Features; #High Contrast; ; #Get Healthy; #ChromiumEdge; #Win11;

Steps to Reproduce

1. Launch the application using URL: https://vscodeedu.com/.
2. "Visual Studio Code for Education" screen will get open.
3. TAB till "login" control and hit ENTER.
4. Courses tab will get open.
5. TAB till "My Courses" tab.
6. TAB till "Start" control and hit ENTER.
7. TAB till "Introduction to Python" control present in the left navigation and hit ENTER.
8. TAB till "Unit 1" control and hit ENTER.
9. TAB till "Start" control present in "Unit 1 - Getting Started" section and hit ENTER.
10. "Welcome" screen will appear.
11. TAB till "Next" control and hit ENTER until "Example: Multiple Choice Question" screen appears.
12. "Example: Multiple Choice Question" screen will appear.
13. Verify whether In High contrast (desert/aquatic) theme focus is visible on the “checkbox" or not.

Expected behavior

In High contrast (desert/aquatic) theme focus is should be visible on the “checkbox" and “radio buttons”.

Screenshots / Video