search

whawker / react-jsx-highcharts

Highcharts built with proper React components
https://whawker.github.io/react-jsx-highcharts/examples
MIT License
419 stars 94 forks source link

plotOptions events issue when using state/redux #229

Open leonardolessa opened 5 years ago

leonardolessa commented 5 years ago

Bug or Feature Request?

Bug

Description

When you define events inside plotOptions, it look like the previous event listeners are not "dead" as you change the state, or someway the previous state keeps stored.

How to reproduce

Define an event inside plotOptions object and try to interact with state (or redux state) as it changes. At some point you'll get the previous state value.

In my project, I'm beeing able to reproduce using the redux state, for some reason the chart event gets several previous values of the redux store.

Live demo demonstrating bug

https://stackblitz.com/edit/react-1wm1vu Just keep looking at the console and mouseOvering the chart until the state changes, the logger will log both null and "testing" after the state changes.

Versions

leonardolessa commented 5 years ago

I was testing again and It looks like the points that were hovered before the state changes, always get the previous values after the change. I could reproduce with the click event too, inside "series" property, but in this case the state value is always the initial one (null).

anajavi commented 5 years ago

This is a bug on Highcharts side.

I created a reproduction with pure Highcharts in https://jsfiddle.net/vopcu8mt/

anajavi commented 5 years ago

I created a issue in Highcharts repository: https://github.com/highcharts/highcharts/issues/12067

anajavi commented 5 years ago

This can be actually worked around on react-jsx-highcharts, but let's see what Highcharts has to say about it first.

@leonardolessa as you have tried the v4 alpha, can you share your experience in #228, or just add +1 if it works for you?

leonardolessa commented 5 years ago

Hi @anajavi, thanks a lot for your quick response, I really appreciate it.

I've briefly tested v4 alpha to reproduce the issue, but I'll have a try until the end of the day in my charts, I use a lot of features of this lib so I guess I can be helpful.

Thanks again!

anajavi commented 5 years ago

I don't know if your real world case can be worked around with useRef, but here's edited stackblitz which works with it: https://stackblitz.com/edit/react-znpnkp?file=Hello.js

It's just a workaround though, a real fix is needed.

anajavi commented 5 years ago

It seems that this can't be worked around in react-jsx-highcharts. We have to wait for Highcharts to fix the bug.