A11y: Fix Accessibility bugs flagged by MS (SEV1 and SEV2)

[yaelleC]

Dashboards

Beta Give feedback

1. [Keyboard Navigation - Home] 255951: The setting and delete button are not accessible via keyboard under the "Interpolation Mode" pane. #66244
   MAS area/dashboard team/grafana-dashboards type/accessibility +4
   
2. ID 256773: [Programmatic Access - Simon - Feature Showcase>Edit]: Incorrect aria-label is defined for "Change Visualization and Close options pane" buttons under 'Edit panel' screen. #66209
   MAS area/frontend area/panel/edit internal type/accessibility +5
3. ID 256762: [Programmatic Access - Simon - Settings>Row options]: Labels are not associated with 'Multiple Y axes edit field and Choose combo edit' in 'Row options' pop up. #66208
   MAS area/dashboard/rows area/frontend internal team/grafana-dashboards type/accessibility wcag/3.3.2 wcag/4.1.2 +8
   
4. [Keyboard Navigation - Home]: Keyboard focus gets lost after closing the "add panel" dialog on the home page. #66242
   MAS area/dashboard type/accessibility wcag/2.4.7 +4
5. [Keyboard Navigation - Soft Min Max]: 'Soft Min Max' button does not receive keyboard focus making it inaccessible by keyboard. #66246
   MAS area/dashboard type/accessibility wcag/2.1.1 +4
6. [Keyboard Navigation - Pane]: "Focus does not move to Feature Showcases" dropdown present under 'Grafana Play Home' making it keyboard inaccessible. #66250
   MAS area/dashboard type/accessibility type/duplicate wcag/2.4.3 +5
7. [Keyboard Navigation - Panels]: Panel menu is not accessible when navigating between panels via keyboard #66256
   MAS area/dashboard type/accessibility wcag/2.1.1 +4
   
8. [Visual Requirements - Change Visualization->Library Panels]: Luminosity ratio is less than 4.5:1 for “Data source: Elasticsearch” link present under 'Library panel’ blade. #66309
   MAS area/frontend/library-panels type/accessibility wcag/1.4.3 +4
9. [Visual Requirements - Change Visualization->Library Panels]: Luminosity ratio is less than 3:1 for “Delete” button present under 'Library panel’ blade. #66310
   MAS area/frontend/library-panels type/accessibility wcag/1.4.11 +4
10. ID 257492: [Programmatic Access - Simon - Variables>New]: Visual label and aria label is not same for 'Update' button under "Variables>Edit" screen. #66334
    MAS area/frontend internal type/accessibility wcag/2.5.3 +5
    
11. ID 258568: [Programmatic Access - Simon - Table]: Aria attributes are not defined for 'Table’ button under 'Edit Panel' screen. #66335
    MAS area/frontend area/panel/edit hacktoberfest internal prio/planned team/grafana-dashboards type/accessibility wcag/4.1.2 +9
    
12. ID 258792: [Programmatic Access -Simon – Value Mapping]: Two <H1> are defined on "Time series graphs /Edit Panel". #66336
    MAS area/dashboard area/frontend internal type/accessibility wcag/1.3.1 +6
    
13. ID 258958: [Programmatic Access - Simon - Override]: Label "Standard options >Color scheme" is not associated with "Classic palette" combo box. #66337
    MAS area/frontend area/panel/edit internal type/accessibility wcag/4.1.2 +6
    
14. ID 259408: [Programmatic Access - Simon - Edit Panel]: Aria label is not defined for "X" button present for remove color scheme under 'Overrides' radio button section. #66339
    MAS area/dashboard area/frontend area/panel/edit internal type/accessibility wcag/4.1.2 +7
    
15. ID 261728: [Programmatic Access - Simon - Annotations]: Aria label is not defined for the checkboxes present in the "Annotations" page. #66352
    MAS area/dashboard area/frontend internal type/accessibility +5
16. ID 257224: [Supporting the platform -Simon – Edit Panel]: Contents present in “Repeat options” under "Grafana Play Home/Edit panel" blade are getting truncated after resizing the page to 200% Zoom. #66364
    MAS area/dashboard area/frontend area/panel/edit internal prio/planned team/grafana-dashboards type/accessibility wcag/1.4.10 +9
    
17. ID 257467: [Supporting Platform - Simon - Annotations>Edit]: Horizontal scroll bar appears on the 'Annotations>Edit' screen after setting the pixels at 320*256 view port. #66487
    MAS area/dashboard area/frontend team/grafana-dashboards type/accessibility +5
    
18. ID 258554: [Supporting the platform - Simon - Link>New Link]: Horizontal scroll bar is appearing on the screen after setting the view port at 320*256. #66489
    MAS area/dashboard area/frontend hacktoberfest prio/future team/grafana-dashboards type/accessibility +7
19. ID 258562: [Supporting the platform - Simon - Save]: Control present under 'Save dashboard' blade is getting truncated after setting the view port at 320*256. #66490
    MAS area/dashboard area/frontend prio/planned team/grafana-dashboards type/accessibility wcag/1.4.10 +7
    
20. ID 258954: [Screen reader -Simon – Value Mapping]: Heading hierarchy is not defined sequentially in the "Time series graphs / Edit Panel" Screen. #66554
    MAS area/panel/edit hacktoberfest prio/future team/grafana-dashboards type/accessibility wcag/1.3.1 +7
    
21. [Supporting the platform - Edit Panel]: Controls present under "Time series graph/Edit panel" blade are not visible after setting the view port at 320*256. #66582
    MAS area/panel/edit prio/future team/grafana-dashboards type/accessibility wcag/1.4.10 +6
22. [Supporting the platform - Edit Panel]: Controls present under "Time series graph/Edit panel" blade are partially visible after resizing the page to 200%. #66583
    MAS area/panel/edit prio/future team/grafana-dashboards type/accessibility wcag/1.4.10 +6
23. [Visual Requirements - Graph>simple graph]: Shades of color under 'Color dialog' are not visible in high contrast mode. #66311
    MAS area/panel/edit team/grafana-dashboards type/accessibility +4
    
24. [Visual Requirements - Link]: Selected/Unselected state of ‘Lock time range and Shorten URL’ toggle buttons are not visible in high contrast mode. #66308
    MAS saga design system type/accessibility +3
    
25. [Keyboard Navigation - Thresholds]: “Delete” Buttons are not accessible through Keyboard under “Thresholds “section. #66254
    MAS area/panel/edit hacktoberfest prio/future team/grafana-dashboards type/accessibility wcag/2.1.1 +7
26. ID 261815: [Programmatic Access - Simon - Search dashboards]: Alternate text or role="presentation" is not defined for the images present in the "Search dashboards" page. #66356
    MAS area/dashboard area/frontend internal prio/future team/grafana-dashboards type/accessibility wcag/1.1.1 +8
27. ID 258694: [Supporting the platform -Simon – Value Mapping]: “Set Color” Dialog is truncated when the page is set to viewport 320*256 Under "Value mapping" blade. #66495
    MAS area/frontend hacktoberfest prio/future team/grafana-dashboards type/accessibility wcag/1.4.10 +7
28. [Keyboard Navigation - Home]: The keyboard focus order is incorrect on the home page. #66243
    MAS area/navigation prio/future team/grafana-dashboards type/accessibility wcag/2.4.3 +6
29. [Keyboard Navigation - Server Requests>Inspect]: Controls present in "Object" section under "Query" tab are not keyboard accessible. #66257
    MAS area/grafana/ui hacktoberfest prio/future team/grafana-dashboards type/accessibility wcag/2.1.1 +7

Grafana Frontend Platform

Beta Give feedback

1. A11y(Nav) 251858: When navigating with the keyboard there is no way to skip the nav straight to the content #60816
   MAS area/navigation help wanted type/accessibility +4
2. ID 256053: [Programmatic Access - Simon - Delete]: Visual label and aria label is not same for 'Yes' button under "delete' pop up. #66046
   MAS area/frontend internal type/accessibility +4
   
3. A11y: [DateTimePicker] 256193 At small, short browser sizes, Time Selection items are obscured #64476
   MAS area/dashboard/timerange type/accessibility +3
   
4. A11y: [Modal] Improve a11y #67302
   2 of 5
   area/frontend type/accessibility type/epic +3
5. ID 260316: [Programmatic Access - Simon - Value Mapping]: Aria-label is not defined for "Remove" button under "Value mapping" dialog. #66346
   MAS area/frontend internal type/accessibility wcag/4.1.2 +5
   

Alerting

Beta Give feedback

1. ID 260767: [Programmatic Access - Simon - Alert rule>Search by data source]: Visual label and aria label is not same for 'Search by data source' combo box under "Alerting" screen. #65845
   MAS area/alerting area/frontend internal type/accessibility wcag/2.5.3 +6
2. ID 260192: [Programmatic Access - Simon - Go to Dashboard]: Aria-label is not defined for 'Data source: AWS IoT Site Wise’ button under 'Alerting' screen. #66342
   MAS area/alerting area/frontend internal type/accessibility wcag/4.1.2 +6
3. ID 261625: [Programmatic Access - Simon - Edit Panel]: Aria label is not defined for "expand/collapse" button present for "Data source: AWS IoT Site wise". #66350
   MAS area/alerting area/frontend internal type/accessibility wcag/3.3.2 +6
4. [Keyboard Navigation - Alert rules] 261598: Info button (i) present for "Search" field is not keyboard accessible. #66467
   MAS area/alerting area/frontend type/accessibility wcag/2.1.1 +5
5. [Supporting the platform - Server request>Inspect]: Controls present in "Object" section under "Query" tab are not visible after resizing the page to 200%. #66584
   MAS area/frontend panel/inspect prio/future team/grafana-dashboards type/accessibility wcag/1.4.10 +7
6. [Supporting the platform - Server request>Inspect]: Controls present under "Query" tab are not visible after setting the view port at 320*256. #66585
   MAS area/frontend type/accessibility wcag/1.4.10 +4
7. ID 261597: [Screen reader - Simon – Alert rules]: Heading hierarchy is not sequential in "Alert rules" tab present under "Alerting" screen. #67040
   MAS area/alerting area/frontend type/accessibility wcag/1.3.1 +5
8. ID 257467: [Supporting Platform - Simon - Annotations>Edit]: Horizontal scroll bar appears on the 'Annotations>Edit' screen after setting the pixels at 320*256 view port. #66487
   MAS area/dashboard area/frontend team/grafana-dashboards type/accessibility +5
   

Grafana Explore

Beta Give feedback

1. ID 259534: [Screen reader - Simon - Enable/Disable Query]: Screen reader does not provide 'Enable/Disable' information on invoking 'Enable/Disable' button. #66564
   MAS area/query-editor help wanted type/accessibility +4
   
2. [Supporting the platform -Query Pattern]: 'Select a data source' Combo box disappears after resizing the page at 200%. #66580
   MAS area/explore needs more info type/accessibility +4

Other

Beta Give feedback

1. A11y: Fix elements not handling keyboard interactions #58924
   MAS help wanted type/accessibility type/epic +4
2. ID 258557: [Supporting the platform -Simon – Add to Dashboard]: "Cancel and Open in new tab" buttons under 'Add to Dashboard' blade are truncated after setting the viewport to 320*256. #66371
   MAS area/frontend internal type/accessibility wcag/1.4.10 +5
   
3. [Keyboard Navigation - Panel Query Editor]: Cannot access elements which are only visible on hover #69388
   MAS area/frontend area/panel/edit effort/small prio/medium type/accessibility wcag/2.1.1 +7
   
4. ID 260585: [Programmatic Access - Simon - Rate then Sum]: Label "Range" is not associated with its combo box. #66347
   MAS area/frontend effort/small good first issue internal prio/medium type/accessibility wcag/3.3.2 wcag/4.1.2 +9
5. ID 338310: [Screen Reader- Simon - Label]: Screen reader announces the incorrect information while navigating on for the "label" list box present under 'Explore' screen #67028
   MAS area/query-editor effort/small good first issue hacktoberfest prio/medium type/accessibility wcag/3.1.6 +8
6. ID 259326: [Screen reader -Simon - Rate then Sum]: Heading hierarchy is not defined sequentially in the "Explore" Screen. #66560
   MAS area/query-editor effort/small prio/medium type/accessibility wcag/1.3.1 +6