[charts-pro] Sampled band highlight falls back to single-band width for Date/object values by SamanPandey-in · Pull Request #23024 · mui/mui-x

SamanPandey-in · 2026-07-01T09:53:30Z

Summary

Follow-up to #22830 (data sampling for bar/line).

ChartsXAxisHighlight/ChartsYAxisHighlight widen the band highlight to span a whole sampled bucket by looking up the highlighted value's index with data.indexOf(value). indexOf uses reference equality, so for axes keyed by Date (or other objects) it returns -1 whenever value isn't the exact same instance as the matching entry in axis.data — which is generally the case for values derived from pointer/keyboard interaction. The lookup then silently fails and the highlight falls back to a single-band width instead of covering the merged bucket.

Fix

The highlight selectors already resolve a dataIndex (the exact index into axis.data) for pointer, keyboard, and controlled highlights. Both components now use that dataIndex directly instead of re-deriving it via indexOf.
Added a findDataIndex fallback (used only when dataIndex isn't available) that compares Date values by getTime() instead of by reference, falling back to plain indexOf for primitives/other objects.

Testing

Extended useChartCartesianAxis.axisHighlight.test.tsx (and/or added a new test) covering a Date-keyed band axis with bucketSize > 1, asserting the rendered highlight path spans the full bucket rather than a single band.
Manually verified against the LineSampling/BarSampling perf demos with a Date-keyed dataset, zoomed out so bucketing is active.

Closes the follow-up noted in #22830 re: axis-highlight widening for non-primitive band values.
Closes issue #22999

I have followed (at least) the PR section of the contributing guide.

code-infra-dashboard · 2026-07-01T09:58:24Z

Deploy preview

https://deploy-preview-23024--material-ui-x.netlify.app/

Bundle size

Bundle	Parsed size	Gzip size
@mui/x-data-grid	0B^(0.00%)	0B^(0.00%)
@mui/x-data-grid-pro	0B^(0.00%)	0B^(0.00%)
@mui/x-data-grid-premium	0B^(0.00%)	0B^(0.00%)
@mui/x-charts	🔺+130B^(+0.03%)	🔺+43B^(+0.04%)
@mui/x-charts-pro	🔺+130B^(+0.02%)	🔺+70B^(+0.04%)
@mui/x-charts-premium	🔺+130B^(+0.02%)	🔺+58B^(+0.03%)
@mui/x-date-pickers	0B^(0.00%)	0B^(0.00%)
@mui/x-date-pickers-pro	0B^(0.00%)	0B^(0.00%)
@mui/x-tree-view	0B^(0.00%)	0B^(0.00%)
@mui/x-tree-view-pro	0B^(0.00%)	0B^(0.00%)
@mui/x-scheduler	0B^(0.00%)	0B^(0.00%)
@mui/x-scheduler-premium	0B^(0.00%)	0B^(0.00%)
@mui/x-chat	0B^(0.00%)	0B^(0.00%)
@mui/x-license	0B^(0.00%)	0B^(0.00%)

Details of bundle changes

Performance

Total duration: 1,650.99 ms -62.46 ms^{(-3.6%, p=0.046)} | Renders: 63 ⁽⁺⁰⁾ | Paint: 2,259.06 ms -35.66 ms^(-1.6%)

Test	Duration	Renders
LineChart stacked area with multiple series	416.58 ms 🔺+69.24 ms^{(+19.9%, p<0.001)}	2 ⁽⁺⁰⁾
LineChart with date axis and big data amount	56.99 ms 🔺+16.00 ms^{(+39.0%, p=0.012)}	2 ⁽⁺⁰⁾
ScatterChartPremium with big data amount and zoomed in (webgl renderer)	22.88 ms 🔺+2.54 ms^{(+12.5%, p=0.025)}	5 ⁽⁺⁰⁾
PieChart with big data amount	10.69 ms 🔺+1.45 ms^{(+15.7%, p<0.001)}	2 ⁽⁺⁰⁾
FunnelChart with big data amount	6.29 ms 🔺+0.69 ms^{(+12.4%, p<0.001)}	2 ⁽⁺⁰⁾

…and 16 more (+5 within noise) — details

Metric alarms

Test	Metric	Change
LineChart stacked area with multiple series	bench:paint	🔺 +75.67 ms
LineChart with date axis and big data amount	bench:paint	🔺 +14.72 ms
ScatterChartPremium with big data amount and zoomed in (webgl renderer)	bench:paint	🔺 +3.32 ms
PieChart with big data amount	bench:paint	🔺 +2.20 ms
FunnelChart with big data amount	bench:paint	🔺 +1.02 ms

…and 2 more metric alarms — details

Check out the code infra dashboard for more information about this PR.

github-actions · 2026-07-03T12:06:18Z

This pull request has conflicts, please resolve those before we can evaluate the pull request.

SamanPandey-in · 2026-07-05T06:58:37Z

@zannager Please add label: type:bug

github-actions · 2026-07-07T08:13:33Z

This pull request has conflicts, please resolve those before we can evaluate the pull request.

alexfauquette

I think your fix got affected by the merge of #23052 Seems like some pats where similar (about the indexOf())

…ed axes

SamanPandey-in · 2026-07-07T19:35:17Z

I think your fix got affected by the merge of #23052 Seems like some pats where similar (about the indexOf())

Thanks for flagging that @alexfauquette! Rebased cleanly onto master, the fix now lives entirely in getSampledBandHighlight.ts where the fallback data.indexOf(value) was still present. Added a small findDataIndex helper that handles Date values by comparing getTime() instead of by reference. ChartsXAxisHighlight and ChartsYAxisHighlight are untouched from master. Single commit, no conflict markers.

alexfauquette · 2026-07-10T08:36:21Z

Thanks, can you add a regression test?

SamanPandey-in · 2026-07-10T09:32:47Z

Here's what changed based on @alexfauquette's suggestions:

findDataIndex inlined: no separate file anymore. It's a plain unexported function at the top of getSampledBandHighlight.ts, no JSDoc.
Regression test: getSampledBandHighlight.test.ts covers:
- Normal single-band (no sampling)
- Bucket widening (sampled, bucketSize > 1)
- Last bucket clamping (odd-length data)
- The actual regression: a Date-keyed axis where value is a different reference than the matching entry in data, with no pre-resolved dataIndex, forcing the findDataIndex fallback path

github-actions · 2026-07-22T16:36:34Z

This pull request has conflicts, please resolve those before we can evaluate the pull request.

JCQuintas · 2026-07-23T09:53:41Z

@copilot resolve the merge conflicts in this pull request

Master added getSampledBandHighlight.test.ts in mui#23052/mui#23190; keep that suite and re-add the Date-reference regression test on top of it.

SamanPandey-in requested review from JCQuintas and alexfauquette as code owners July 1, 2026 09:53

SamanPandey-in mentioned this pull request Jul 1, 2026

[charts-pro] Sampled band highlight falls back to single-band width for Date/object values #22999

Open

zannager added plan: Pro Impact at least one Pro user. scope: charts Changes related to the charts. labels Jul 1, 2026

github-actions Bot added the PR: out-of-date The pull request has merge conflicts and can't be merged. label Jul 3, 2026

github-actions Bot removed the PR: out-of-date The pull request has merge conflicts and can't be merged. label Jul 5, 2026

github-actions Bot added the PR: out-of-date The pull request has merge conflicts and can't be merged. label Jul 7, 2026

alexfauquette reviewed Jul 7, 2026

View reviewed changes

SamanPandey-in closed this Jul 7, 2026

SamanPandey-in reopened this Jul 7, 2026

SamanPandey-in marked this pull request as draft July 7, 2026 19:13

github-actions Bot removed the PR: out-of-date The pull request has merge conflicts and can't be merged. label Jul 7, 2026

SamanPandey-in closed this Jul 7, 2026

SamanPandey-in force-pushed the fix-date-highlight branch from 63e6cf7 to 7c73c4c Compare July 7, 2026 19:25

[charts][AxisHighlight] Fix band highlight width for Date-keyed sampl…

0a738b3

…ed axes

SamanPandey-in reopened this Jul 7, 2026

SamanPandey-in marked this pull request as ready for review July 7, 2026 19:33

alexfauquette reviewed Jul 10, 2026

View reviewed changes

Comment thread packages/x-charts/src/ChartsAxisHighlight/findDataIndex.ts Outdated

[charts][test] Add sampledBandHighlight test and inline findDataIndex

cd27b68

Merge branch 'master' into fix-date-highlight

44d067a

alexfauquette approved these changes Jul 10, 2026

View reviewed changes

alexfauquette added the type: bug It doesn't behave as expected. label Jul 10, 2026

fix-ts

627defb

github-actions Bot added the PR: out-of-date The pull request has merge conflicts and can't be merged. label Jul 22, 2026

JCQuintas added 2 commits July 23, 2026 12:01

Merge branch 'master' into fix-date-highlight

02e32df

Master added getSampledBandHighlight.test.ts in mui#23052/mui#23190; keep that suite and re-add the Date-reference regression test on top of it.

[charts] Restore last-bucket clamp test dropped in merge resolution

041d47c

github-actions Bot removed the PR: out-of-date The pull request has merge conflicts and can't be merged. label Jul 23, 2026

JCQuintas merged commit bf2425e into mui:master Jul 23, 2026
22 checks passed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Uh oh!

[charts-pro] Sampled band highlight falls back to single-band width for Date/object values#23024

[charts-pro] Sampled band highlight falls back to single-band width for Date/object values#23024
JCQuintas merged 6 commits into
mui:masterfrom
SamanPandey-in:fix-date-highlight

SamanPandey-in commented Jul 1, 2026

Uh oh!

code-infra-dashboard Bot commented Jul 1, 2026 •

edited

Loading

Uh oh!

github-actions Bot commented Jul 3, 2026

Uh oh!

SamanPandey-in commented Jul 5, 2026

Uh oh!

github-actions Bot commented Jul 7, 2026

Uh oh!

alexfauquette left a comment

Uh oh!

SamanPandey-in commented Jul 7, 2026

Uh oh!

alexfauquette commented Jul 10, 2026

Uh oh!

Uh oh!

SamanPandey-in commented Jul 10, 2026

Uh oh!

github-actions Bot commented Jul 22, 2026

Uh oh!

JCQuintas commented Jul 23, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

Uh oh!

Uh oh!

Conversation

SamanPandey-in commented Jul 1, 2026

Summary

Follow-up to #22830 (data sampling for bar/line).

Fix

Testing

Uh oh!

code-infra-dashboard Bot commented Jul 1, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Deploy preview

Bundle size

Performance

Uh oh!

github-actions Bot commented Jul 3, 2026

Uh oh!

SamanPandey-in commented Jul 5, 2026

Uh oh!

github-actions Bot commented Jul 7, 2026

Uh oh!

alexfauquette left a comment

Choose a reason for hiding this comment

Uh oh!

SamanPandey-in commented Jul 7, 2026

Uh oh!

alexfauquette commented Jul 10, 2026

Uh oh!

Uh oh!

SamanPandey-in commented Jul 10, 2026

Uh oh!

github-actions Bot commented Jul 22, 2026

Uh oh!

JCQuintas commented Jul 23, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

code-infra-dashboard Bot commented Jul 1, 2026 •

edited

Loading