microsoft / microsoft/fluentui

[Bug]: HorizontalBarChartWithAxis retains stale bars when the data set shrinks

Open
#36,442 0 comments 0 reactions 1 assignee View on GitHub

@AtishayMsft is already working on this.

Since Jul 24, 2026.

Package: charting Type: Bug :bug:
Dominant language
TypeScript
Stars
20.3k
Forks
2.9k
Avg merge
2d 9h
Merged PRs (30d)
46

Description

Charting Control

Other...

Package version

9.3.6

React version

18.3.1

Environment
System:
    OS: Linux 6.8 Debian GNU/Linux 13 (trixie) 13 (trixie)
    CPU: (32) x64 AMD EPYC 7763 64-Core Processor
    Memory: 115.44 GB / 125.79 GB
    Container: Yes
    Shell: 5.2.37 - /bin/bash
Current Behavior

We are seeing an issue with HorizontalBarChartWithAxis when the same mounted chart receives a smaller data set during pagination. When we move from a page with five y-axis categories to a page with two categories, the y-axis labels update, but bars from the previous page can remain visible and become misaligned with the new labels.

Sample: Stackblitz

Expected Behavior

Only bars represented by the latest data prop are rendered.

Reproduction

https://stackblitz.com/edit/vitejs-vite-pjeuzuqp?file=src%2Fmain.tsx,package.json,src%2FApp.tsx&terminal=dev

Steps to reproduce

Steps:

  1. Open the preview and confirm that the first page displays five owners.
  2. Click Next to switch to a page containing two owners.
  3. Observe that bars from the first page can remain after the y-axis updates.
Are you reporting an Accessibility issue?

None

Suggested severity

Urgent - No workaround and Products/sites are affected

Products/sites affected

No response

Are you willing to submit a PR to fix?

no

Validations
  • Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
  • The provided reproduction is a minimal reproducible example of the bug.

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.