Skip to content

[SF][A11y][LineChart]: [Chart content is not fully accessible via keyboard] #7302

Open
@josepinesu

Description

@josepinesu

Describe the bug

  1. Focus currently moves simultaneously on both the entire chart and the first dot element within the chart.
  2. Focus is not moving to other sections of the chart, such as the legend and horizontal axis elements.
  3. Focus indicator on chart elements is not consistent with other elements on the page, the focus indicator on whole chart section is black.

Isolated Example

https://stackblitz.com/edit/github-g4gfbn9c-odvsrcww?file=src%2FApp.tsx

Reproduction steps

  1. open provided isolated example
  2. tab to the chart.

Expected Behaviour

  1. Ensure that the focus first moves to the chart section, with the screen reader announcing the relevant information. After that, pressing Tab should move the focus to the first dot element.
  2. Focus should move to other section of the chart, such as legend and horizontal axis elements.

Please refer to the following UI5 sample link for a chart where keyboard navigation functions as expected:
https://ui5.sap.com/#/entity/sap.viz.ui5.controls.VizFrame/sample/sap.viz.sample.Line

Screenshots or Videos

No response

UI5 Web Components for React Version

2.4.0

UI5 Web Components Version

2.4.0

Browser

Chrome

Operating System

No response

Additional Context

No response

Relevant log output

Organization

No response

Declaration

  • I’m not disclosing any internal or sensitive information.

Metadata

Metadata

Assignees

No one assigned

    Type

    Projects

    Status

    🆕 New

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions