Skip to content

Commit

Permalink
Fix tooltip rendering crash when activeItem is undefined (recharts#3982)
Browse files Browse the repository at this point in the history
<!--- Provide a general summary of your changes in the Title above -->

## Description

Sometimes, the tooltip rendering would crash when the window has been
resized

> TypeError: Cannot read properties of undefined (reading 'payload')


This is due to a mistake in `getItemByXY` in
`generateCategoricalChart.tsx`.

https://github.com/recharts/recharts/blob/0d5326a8cdcad34a3b9d7c0644abbb645ddffe87/src/chart/generateCategoricalChart.tsx#L2250-L2252


https://github.com/recharts/recharts/blob/7fb227dae542c3d3093506e6d80a2c2c366f9a26/src/util/ActiveShapeUtils.tsx#L142-L152

`isFunnel`, `isPie` and `isScatter` do not check if `activeItem` is
defined, so it might cast it as a defined
`FunnelItem`/`PieItem`/`ScatterItem` even if `activeItem` is undefined

<!--- Describe your changes in detail -->

I've added a nullcheck for activeItem

## Related Issue

recharts#3981

<!--- This project only accepts pull requests related to open issues -->
<!--- If suggesting a new feature or change, please discuss it in an
issue first -->
<!--- If fixing a bug, there should be an issue describing it with steps
to reproduce -->
<!--- Please link to the issue here: -->

## Motivation and Context

<!--- Why is this change required? What problem does it solve? -->

This fixes a crash

## How Has This Been Tested?

<!--- Please describe in detail how you tested your changes. -->
<!--- Include details of your testing environment, and the tests you ran
to -->
<!--- see how your change affects other areas of the code, etc. -->

I manually checked that the crash doesn't happen anymore

## Screenshots (if appropriate):

<img width="1040" alt="image"
src="https://github.com/recharts/recharts/assets/8755930/9c5eaf0d-0bf4-486d-94fb-ae77b0ba8878">


## Types of changes

<!--- What types of changes does your code introduce? Put an `x` in all
the boxes that apply: -->

- [x] Bug fix (non-breaking change which fixes an issue)
- [ ] New feature (non-breaking change which adds functionality)
- [ ] Breaking change (fix or feature that would cause existing
functionality to change)

## Checklist:

<!--- Go over all the following points, and put an `x` in all the boxes
that apply. -->
<!--- If you're unsure about any of these, don't hesitate to ask. We're
here to help! -->

- [x] My code follows the code style of this project.
- [x] My change requires a change to the documentation.
- [x] I have updated the documentation accordingly.
- [x] I have added tests to cover my changes.
- [x] I have added a storybook story or extended an existing story to
show my changes
- [x] All new and existing tests passed.
  • Loading branch information
tran-simon authored and Gabriel Mercier committed Nov 23, 2023
1 parent 8d120f2 commit 39c8724
Showing 1 changed file with 3 additions and 3 deletions.
6 changes: 3 additions & 3 deletions src/util/ActiveShapeUtils.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -140,15 +140,15 @@ type GetActiveShapeIndexForTooltip = {
};

export function isFunnel(graphicalItem: GraphicalItem, _item: unknown): _item is FunnelItem {
return 'trapezoids' in graphicalItem.props;
return _item != null && 'trapezoids' in graphicalItem.props;
}

export function isPie(graphicalItem: GraphicalItem, _item: unknown): _item is PieItem {
return 'sectors' in graphicalItem.props;
return _item != null && 'sectors' in graphicalItem.props;
}

export function isScatter(graphicalItem: GraphicalItem, _item: unknown): _item is ScatterItem {
return 'points' in graphicalItem.props;
return _item != null && 'points' in graphicalItem.props;
}

export function compareFunnel(shapeData: FunnelItem, activeTooltipItem: FunnelItem) {
Expand Down

0 comments on commit 39c8724

Please sign in to comment.