react-highcharts: Uncaught TypeError: Cannot read property 'chart' of undefined

First of all, really nice job for wrapping highcharts as a react component, exactly what I’ve been looking for!

Following the instruction, I was able to get it up and run pretty easily. Everything works as expected, except the browser keeps throwing the following error whenever page reflows.

Uncaught TypeError: Cannot read property 'chart' of undefined
    hb.reflow @highcharts.js:222
    (anonymous function) @ReactHighcharts.js:1

Although it doesn’t seem to cause any real problem (the charts redraw without issue), I’d love to see a way to workaround the error. Here is the code for reference, which is pretty much the bare minimal for showing a line chart.

import React, {Component} from 'react';
import ReactHighcharts from 'react-highcharts';

export default class HighchartLine extends Component {
  constructor(props) {
    super(props);
  }

  render() {
    const config = {
      ...... // skipping the detail here for saving space
    };
    return (<ReactHighcharts config = {config} />);
  }
}

About this issue

  • Original URL
  • State: closed
  • Created 8 years ago
  • Reactions: 1
  • Comments: 16 (8 by maintainers)

Commits related to this issue

Most upvoted comments

We have a similar issue. For us it happens because the reflow-call inside requestAnimationFrame happens after componentWillUnmount, so checking if the chart still exists in the callback might be a good idea.

What triggers this in our case is that it mounts->unmounts->mounts quickly. If that is an error on our part I’m currently figuring out.

Yay it works perfectly now! Thanks a lot!

This should be fixed in 8.1.0, thanks to @dbergey