Tooltip disappears after Component.setState()

With gratitude to the maintainers and contributors to this fine library! If this is an error in my code, do let me know! I took a look at the source code to see if I could make this a PR instead of an issue, but couldn’t determine the cause of this issue.

Do you want to request a feature or report a bug?

Bug

What is the current behavior?

As soon as Component.setState() is called by another component (not the recharts graph), the tooltip disappears.

Reproduction steps

Bug is present in this deployed app.

Before adding the following code in the code for <Sidebar />, tooltip was working perfectly. Sidebar is a component unrelated to the recharts graph.

  updateSidebar = event => {
    if (event && event.activeTooltipIndex) {
      const activePoint = this.state.graph.data[0].points[
        event.activeTooltipIndex
      ]

      this.setState(prevState => ({
        ...prevState,
        graph: Object.assign({}, this.state.graph, { activePoint })
      }))
    }
  }

Changing the contents of the setState function doesn’t make a difference, as long as setState() gets called, <Tooltip />'s props get set to active: false and the tooltip disappears.

May be related to #1179, though I don’t see the chart redraw animation happening each time setState is called.

I can recreate in a JSFiddle if someone has a working template (current templates are broken)

What is the expected behavior?

Tooltip can persist even as state is updated.

Which versions of Recharts, and which browser / OS are affected by this issue? Did this work in previous versions of Recharts?

Chrome 64.0.3282.186 Mac OS 10.12.6 Recharts 1.0.0-beta.10

Thanks for any insights!

[andyngdz]

Sadly this issue is still there https://codesandbox.io/s/a-moving-chart-from-rechart-x7juw

[simonhessner]

That should fix it: https://github.com/recharts/recharts/pull/2150