Fix wrong narration when legend selected #24903
Conversation
📊 Bundle size report🤖 This report was generated against a1c97799460396fc90984176eeb4eb65851062eb |
|
This pull request is automatically built and testable in CodeSandbox. To see build info of the built libraries, click here or the icon next to each commit SHA. Latest deployment of this branch, based on commit 0d31915:
|
Asset size changesSize Auditor did not detect a change in bundle size for any component! Baseline commit: a1c97799460396fc90984176eeb4eb65851062eb (build) |
|
|
||
| private _hoverOn(data: IChartDataPoint, mouseEvent: React.MouseEvent<SVGPathElement>): void { | ||
| mouseEvent.persist(); | ||
| if (this.props.activeArc === this.props.data!.data.legend || this.props.activeArc === '') { |
There was a problem hiding this comment.
Why did you remove these checks
There was a problem hiding this comment.
These checks were not completely removed but used in the setState function call to update the visibility of the callout
|
|
||
| private _onBarFocus(pointData: number, color: string, point: IChartDataPoint): void { | ||
| if ( | ||
| this.state.isLegendSelected === false || |
There was a problem hiding this comment.
Can you explain how setting the state everytime helps.
There was a problem hiding this comment.
Consider this case:
Before the change:
When the 3rd (highlighted) bar is focused, the above condition evaluates to true. The setState function is called and the callout becomes visible with details of the 3rd bar. Now when the 4th (unhighlighted) bar is focused, the condition evaluates to false. The setState function is not called and the callout stays visible with details of the previously focused 3rd bar. So the callout's outdated inner text is used for narration.
After the change:
The setState function is called every time a bar is focused. The callout becomes visible when a highlighted bar is focused and hides (but stays in the DOM) when an unhighlighted bar is focused. The callout is always updated with details of the focused bar, which results in correct narration.
* master: (106 commits) fix: PopoverTriggerChildProps should be exported (microsoft#25159) feat: replace ToolbarRadio implementation by usage of toggle button as Radio (microsoft#25343) docs: improve Toolbar docs examples (microsoft#25269) feat(tools): add unstable API setup updates (microsoft#25355) applying package updates Fix wrong narration when legend selected (microsoft#24903) applying package updates chore(react-persona): Update beachball settings and change file's type (microsoft#25363) chore: Refactor Field VR tests to have individual tests per component (microsoft#25263) chore(react-persona, react-components, vr-tests-v9): Reverting react-persona's version to beta (microsoft#25357) Publishing migration package (microsoft#25354) fix: Detailslist is still tabbable when isHeaderVisible=false (microsoft#25342) fix: list even/odd off-by-one issue (microsoft#25358) feat: add Dropdown a11y spec (microsoft#24917) spinbutton: update internal padding for small size (microsoft#25286) chore(global-context): migrate to new package structure (microsoft#25341) feat: Add validationState to Progress, to make the bar red or green (microsoft#25253) feat: Add accessibility scenarios for Fluent UI v9 components #3 (microsoft#23334) feat(Dropdown): Freeform search should be case insensitive (microsoft#24879) feat(what-input): Limit keyboard detection in inputs (microsoft#25087) ...
* fix wrong narration when legend selected * add change file * show/hide callout instead of mount/unmount * fill transparent inside focusRing * minor * add comments
5 participants
Current Behavior
Narrator announces highlighted chart element label for unhighlighted chart elements when there is a selected legend
New Behavior
Narrator announces correct label for focused chart element when there is a selected legend