Carbon: Code snippet screen reader issues in JAWS 2020

[dakahn]

@dakahn
AVT 3 issues found with macOS Mojave, Chrome and VoiceOver.
For the inline code snippet VO does not:

• [x] announce what the button is for. VO should announce that it is a "copy" button.
• [x] announce that the text is a code snippet.
• [x] announce "copied" after the button is pressed the first time. (note: copied is announced after the button is pressed twice).

For the single and multi-line code snippet VO:

• [x] Incorrectly announces that the code snippet is an editable text field.
• [ ] Does not announce "copied" after the button is pressed the first time. (note: copied is announced after the button is pressed twice).

_Originally posted by @snidersd in https://github.com/IBM/carbon-components/issues/1531#issuecomment-458255961_

[dakahn]

Open PR in vanilla repo here

[dakahn]

New testing -- new issues. Reopening @sniders

[dakahn]

Addressed inline issues with #2165

Multi-line code snippet issues forthcoming yall 🤠

[stale[bot]]

We've marked this issue as stale because there hasn't been any activity for a couple of weeks. If there's no further activity on this issue in the next three days then we'll close it. Thanks for your contributions.

[dakahn]

not stale ⚡️

[stale[bot]]

We've marked this issue as stale because there hasn't been any activity for a couple of weeks. If there's no further activity on this issue in the next three days then we'll close it. You can keep the conversation going with just a short comment. Thanks for your contributions.

[snidersd]

Retested and this issue is still present in Vanilla and React.

[snidersd]

@dakahn Retested and found that a recent update to CodeSnippet has a new issue. The "Copied" message is now "Feedback Enabled" with a thumbs-up which is out of context with the action.
Note: Expected all copy buttons to have the same behavior. CopyButton has the correct messages, but still has the issue of not announcing "Copied".

[dakahn]

@snidersd Getting back to this work next week. I'll sort out the regression.

[joshblack]

@dakahn for the role="textbox", what would the resolution be? Seems like it came because someone thought it was needed because we treat the region as focusable with tabindex="0" and an aria-label, would it make sense to call it role="region"?

[snidersd]

@dakahn @joshblack Just noticed that the CopyButton Component is also affected by this issue. "copied" is not announced after the button is pressed.

[dakahn]

Testing this link in Windows 10 with JAWS 2020. The CodeSnippet's copied announcement is not read via screen reader. Though it is no longer read as an editable text field. But the instructions to "press space to select" are read twice instead. @snidersd can you confirm this behavior?

[snidersd]

@dakahn I tested with Windows 10, JAWS and Firefox:
Tab to code snippet, JAWS announces, "Main region, container label, edit."
Tab to button, JAWS announces, "Copyable code snippet button."
Press Enter or Space, JAWS announces, "Copied to clipboard."

When I test with Windows 10, JAWS and Chrome I get a different result.
Everything is similiar to Firefox except clicking Enter or Space on the copy button, JAWS announces, "Copied to clipboard" twice and then "Copyable code snippet" twice.

[dakahn]

Hmm -- okay. The double announcements are annoying, but if it's reading copied state that's good

[asudoh]

@dakahn Given it's reading the copied state, do you still want to keep this issue open? Or should we track the "double reading" thing as a separate issue?

[dakahn]

yeah let's do that @asudoh