Screen reader/tabbing through chart menu

Issue report
1

Hi,

When listening to a screen reader (NVDA or JAWS) and tabbing to the Chart Menu (Options menu in our case), it is selecting the second option first, Save image (PNG) instead of selecting View full screen. If a non-sighted/low vision user wants to get to View full screen, they need to arrow back up to have it read out loud.

You can test with this chart if you need an example.

https://app.everviz.com/edit/472717?editor&panel=chart_customize

image

1 Like
2

The link you shared is the link to the editor, and it’s only accessible to your team. To make it easier for you to see the issue, I’ve provided the public link: everviz

It appears that the “View Full screen” option is missing from the options menu. Perhaps you intentionally removed it due to the encountered issue?

I’ve created a copy and re-added the fullscreen option. Here is the updated link: everviz. Could you please confirm if JAWS or NVDA reads this correctly?

Thank you!

3

Hi HĂ„vard,

My apologies, I sent you the wrong example. Either way, it still doesn’t work, for the one you fixed or for any other chart. It works when you tab through using only a keyboard, but doesn’t when using a screen reader.

Thank you!

4

Hi Kerry,

Can you provide the steps to reproduce this so we can test on our end?

Thanks,
Mark

5

Hi Mark,

I have recreated the steps in the video below. Unfortunately because I can only upload Gifs, you can’t hear the sound of the screen reader.

  1. Turn on NVDA screen reader
  2. Using the keyboard, tab to the “Options” button
  3. Press enter
  4. Hold “Alt” key and press “down arrow”
  5. You can see it skips “View full screen” and goes straight to “Save image (PNG)”
  6. You have to “Alt + arrow up” to get to “View full screen” or cycle through

2023-07-19_view-fullscreen

6

Hey Kerry,

Thanks for providing the steps.

So I have been testing this in both Chrome and Edge using this chart.
https://fonnnews.wpengine.com/2023/07/21/testing-the-nvda-screen-reader-with-an-everviz-chart/

I did witness the behaviour you describe in one instance. But subsequent attempts to view it were unsuccessful. Sometimes typing TAB to move though the chart elements works, other times not.

Also, in Chrome, I received a message ‘Chrome legacy window’ from NVDA, even after updating Chrome.

Very strange.

7

Hi Mark,

Thank you for testing this out.

The issue for us is that we can’t use the arrow keys without pressing “alt” because we are specifying a Keyboard Navigation order under Advanced > Accessibility > Keyboard Navigation (see screenshot below). When we don’t specify an order and use Everviz’s default it works without having to press “Alt”. Hence why the chart you created seems to work.

Here is a test chart based off yours which specifies a keyboard order.

image
image954×623 55.8 KB

8

Hey Kerry,

Thanks for the extra details. I will make sure a knowledge base article is created for working in Advanced > Accessibility > Keyboard Navigation

I have been testing the chart you shared in your last post in Chorme using NVDA.

I tab through all the items in the page until I get to the menu. When it is highlighted with a blue border I type ENTER.

blue border
blue border1683×1237 59.7 KB

I then type Alt + the arrow keys to navigate through the menu. And, on typing the first Alt and down arrow command, the first item to be read aloud - and the first item highlighted - is Print chart, skipping over View in full screen.

skip
skip1683×1237 84.4 KB

I now have the steps to reproduce and will create a ticket to get this fixed.

Internal ref. #1415

2 Likes