A11y_.NETOnlineREPL_Output_AI4W : Elements that have scrollable content should be accessible by keyboard (.dotnet-online-output)

[pranshu512]

“Check out Accessibility Insights! - Identify accessibility bugs before check-in and make bug fixing faster and easier.”

GitHubTags: #A11yMAS;#A11yTCS;#A11ySev2;#BM_.NET Online REPL_Web_Feb2021;#.NET Online REPL;#Win10;#FTP;#DesktopWeb;#WCAG2.1.1;#Chrome;#Keyboard;#AI4W;#A11yAuto;

Environment Details:

Application Name: .NET Online REPL Operating System: Windows10 Browser Version : Google Chrome Version 87.0.4280.141 (Official Build) (64-bit)

Repro Steps:

1. Open .NET Editor coding screen .
2. Tab to .NET Editor section and enter code which gives large output after running code such that vertical scroll bar appear on output section.
3. Run AI4W fast pass.

Title: WCAG 2.1.1: Elements that have scrollable content should be accessible by keyboard (.dotnet-online-output)

Tags: Accessibility, WCAG 2.1.1, scrollable-region-focusable

Issue: Elements that have scrollable content should be accessible by keyboard (scrollable-region-focusable - https://accessibilityinsights.io/info-examples/web/scrollable-region-focusable)

Target application: Hello World - Introduction to C# interactive C# tutorial

Element path: .dotnet-online-output

Snippet:

Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill Bill 

How to fix: Fix any of the following: Element should have focusable content Element should be focusable

Environment: Chrome version 88.0.4324.150

====

This accessibility issue was found using Accessibility Insights for Web 2.23.0 (axe-core 4.1.1), a tool that helps find and fix accessibility issues. Get more information & download this tool at http://aka.ms/AccessibilityInsights.