microbit-foundation / python-editor-v3

Micro:bit Educational Foundation Python Editor V3
https://python.microbit.org
MIT License
57 stars 36 forks source link

Issues accessing intellisense / argument completion with screen reader #980

Open kmcnaught opened 2 years ago

kmcnaught commented 2 years ago

While writing code, there are two tooltips - intellisense and argument completion. The latter can be triggered automatically or manually, depending on settings.

I'm looking at the accessibility of these tooltips with a screenreader, there are 5 different types of content to discuss - see screenshots below. A - intellisense autocomplete. This plays nicely with NVDA, reading the list of suggestions if you pause typing. B - intellisense docs. I have not managed to get this read out by NVDA C - intellisense links. I have not managed to select these with NVDA D - argument completion docs. I have not managed to get this read out by NVDA E - argument completion links. I have not managed to select these with NVDA

Are there any shortcuts I am missing, or navigation strategies?

Are any/all of these intended to be screen reader accessible, or is the information available elsewhere? (in which case it would be good to have a deliberate decision and this be documented)

screenshot of intellisense tooltip screenshot of argument completion tooltip
microbit-matt-hillsdon commented 2 years ago

The information is a subset of the information exposed via the API tab. However, accessing it in a contextual way is very useful.

I think we'd welcome suggestions.

Some of these behaviours are from CodeMirror 6 with various degrees of customisation.

It might be interesting to review Visual Studio Code's approach.

microbit-robert commented 2 years ago

My understanding from looking at VSCode (which could be wrong), is that the text in the right hand box is placed in a div outside of the visible area which is read out by the screen reader.

Despite there being a close button and link in the right hand box, I can't find a shortcut to access this area using the keyboard only.

image