C2LC-514: Remove icon SVGs from the accessibility tree

Metadata

Source
C2LC-514
Type
Task
Priority
N/A
Status
Done
Resolution
N/A
Assignee
Daniel Cho
Reporter
Michelle D'Souza
Created
2021-10-13T16:16:10.347-0400
Updated
2024-04-22T15:37:26.338-0400
Versions
N/A
Fixed Versions
N/A
Component
  1. Coding Environment

Description

When an SVG is purely presentational, it should have role=presentation or aria-hidden=true applied. It seems that most/all of the icon SVGs are exposed to the accessibility tree. I’m not noticing any announcement of them in NVDA, but it’s probably more appropriate to remove them.

  • Display keyboard shortcuts menu button icon
  • Keyboard shortcuts dialog icon
  • Audio feedback switch icon - On state
  • Audio feedback switch icon - Off state
  • Pen down switch icon - On state
  • Pen down switch icon - Off state
  • Refresh button icon
  • World selector button icon
  • Configure available actions button icon
  • Forward 1 square button icon - Actions
  • Forward 1 square button icon - Program
  • Forward 2 square button icon - Actions
  • Forward 2 square button icon - Program
  • Forward 3 square button icon - Actions
  • Forward 3 square button icon - Program
  • Backward 1 square button icon - Actions
  • Backward 1 square button icon - Program
  • Backward 2 square button icon - Actions
  • Backward 2 square button icon - Program
  • Backward 3 square button icon - Actions
  • Backward 3 square button icon - Program
  • Turn left 45 degrees button icon - Actions
  • Turn left 45 degrees button icon - Program
  • Turn left 90 degrees button icon - Actions
  • Turn left 90 degrees button icon - Program
  • Turn left 180 degrees button icon - Actions
  • Turn left 180 degrees button icon - Program
  • Turn right 45 degrees button icon - Actions
  • Turn right 45 degrees button icon - Program
  • Turn right 90 degrees button icon - Actions
  • Turn right 90 degrees button icon - Program
  • Turn right 180 degrees button icon - Actions
  • Turn right 180 degrees button icon - Program
  • Add node expanded mode button icon
  • Clear and start new program button icon
  • Add node button icon - Program
  • Delete step button icon
  • Replace step button icon
  • Move step before button icon
  • Move step after button icon
  • Play button icon
  • Stop button icon
  • Slow play speed icon
  • Fast play speed icon

Comments

  • Michelle D'Souza commented 2021-10-21T16:51:30.460-0400

    We need to verify what the behaviour is for screen reader users to determine the priority of this issue.

  • Tony Atkins [RtF] commented 2021-11-01T11:16:49.619-0400

    I went through with VoiceOver, nothing appears to be announced for the icons that are reachable using tabs or VO+<arrow>.

  • Simon Bates commented 2024-04-22T15:37:10.645-0400

    Done: https://github.com/codelearncreate/c2lc-coding-environment/pull/447