mui / mui-x

MUI X: Build complex and data-rich applications using a growing list of advanced React components, like the Data Grid, Date and Time Pickers, Charts, and more!
https://mui.com/x/
4.56k stars 1.33k forks source link

[charts] Tooltip: 'TypeError: series is undefined' with updating series #15065

Open alexgavrushenko opened 1 month ago

alexgavrushenko commented 1 month ago

While updating series and changing tooltip state, may encounter a javascript error

TypeError: series is undefined

ChartsItemTooltipContent@webpack-internal:///../node_modules/@mui/x-charts/esm/ChartsTooltip/ChartsItemTooltipContent.js:34:7

May appear while

  1. Moving mouse fast enough
  2. Update series in background

Issue seems to appear because of accessing context by seriesId, that could be removed in the moment of tooltip rendering call Consider adding undefined check to props of a tooltip, implement a proper GC in SeriesContext or calculate tooltip series outside of its render

Search keywords:

alexfauquette commented 1 month ago

Effectively, that's not a use case we anticipated.

Here is a minimal reproduction from what I understood https://codesandbox.io/embed/8wcxsg?module=/src/Demo.tsx&fontsize=12

The root cause is that the tooltip content comes from the InteractionContext which stores an object identifying the current element you are interacting with (most of the time the seriesId and dataIndex)

This state is maintained up to date by entering/leaving pointer events. But because you remove the series, the state gets outdated.

Checking is the series still exist is a solution. But cleaning the internal state when a series gets removed could be more efficient. Still need to find where to place such logic

michelengelen commented 4 weeks ago

added this to the board to not lose track of it. 👍🏼

alexfauquette commented 3 weeks ago

We will try to solve this issue by checking when a component unmout, itremoves himseft from the interaction context, the same way it does when pointer-out is trigger