Description
Expected behaviour
In High contrast mode: It should be possible to un-select a line in a line chart by pressing space bar when the name is selected in the legend next to the chart.
Actual behaviour
The line is not hidden. Clicking on the label works.
Looking at the code: it seems the keydown event is register twice and leads to the line being hidden and immediately being shown again.
This happens in KeyboardNavigation.prototype.init = function (chart, components)
(accessibility.src.js).
Wher in Accessibility.prototype.init = function (chart) {
this.keyboardNavigation = new KeyboardNavigation(chart, this.components);
registers a key down event (number 1)- the next line is
this.update();
- which calls
setHighContrastTheme
- which triggers an update of the series
- which updates of the chart and
updateA11yEnabled
- which leads to the creation of a
new Accessibility(
- which leads to the creation of a new
KeyboardNavigation
- which registers a key down event (number 2)
- it will not register another one, as step 3)
setHighContrastTheme
is not called again, ashighContrastModeActive
is true at this point.
Live demo with steps to reproduce
https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/demo/line-basic
The issue is visible when I turn on the Windows high contrast mode and open the above jsfiddle in the browser
Steps:
- in high contrast mode
- navigate to "installation" in the legend on the right side of the graph
- press "space"
- "installation" line stays visible / is not deactivated
- click on the same label
- "installation" line disappears / is deactivated
Product version
v9.3.0 (2021-10-21)
Affected browser(s)
Edge Version 95.0.1020.30 (Official build) (64-bit)