Expected behaviour
When a chart has a responsive rule that affects pane.size, resizing the viewport in a way that causes the chart width to go past the maxWidth of that rule should lead to the pane size changing.
Actual behaviour
On some resizes, the chart content instead stays in its pre-resize position, and the following error appears in the console:
Uncaught TypeError: a.remove is not a function
at eval (VM410 highcharts.js:397)
at Array.forEach (<anonymous>)
at a.update (VM410 highcharts.js:397)
at a.setResponsive (VM410 highcharts.js:582)
at a.redraw (VM410 highcharts.js:363)
at a.setSize (VM410 highcharts.js:378)
at eval (VM410 highcharts.js:376)
Interestingly, it appears this only occurs if Highcharts More has been activated in the environment.
Live demo with steps to reproduce
Due to the nature of the issue, I've produced two demos of the problem:
https://codesandbox.io/s/highcharts-responsive-error-demo-filgn?file=/index.html
https://jsfiddle.net/MichaelTDoyle93/Ldec6ht8/
The CodeSandbox issue more closely resembles the original setup (i.e. using the npm package rather than the CDN scripts), but the error message covers the viewport which obfuscates one of the symptoms; the jsfiddle example also illustrates that the cause isn't something specific to the package form of the library.
In both of these demos, he most consistent way I could find to reproduce the issue was to resize the preview pane down to as narrow as it could go, and then resize it out to as far as it could go.
Product version
HIghcharts (and Highcharts More) >= 9.0.0
Affected browser(s)
Chrome, Edge, Safari and Firefox (and potentially others)
In terms of a workaround, because the issue doesn't appear on version 8.2.2 a revert would likely be the best option, but obviously since 9.0.0 provided major security updates it would be less than ideal. Unfortunately, the addition of Highcharts More is also essential in our use case, as we use the polar area chart type. Thanks for your help!
Expected behaviour
When a chart has a
responsiverule that affectspane.size, resizing the viewport in a way that causes the chart width to go past themaxWidthof that rule should lead to the pane size changing.Actual behaviour
On some resizes, the chart content instead stays in its pre-resize position, and the following error appears in the console:
Interestingly, it appears this only occurs if Highcharts More has been activated in the environment.
Live demo with steps to reproduce
Due to the nature of the issue, I've produced two demos of the problem:
https://codesandbox.io/s/highcharts-responsive-error-demo-filgn?file=/index.html
https://jsfiddle.net/MichaelTDoyle93/Ldec6ht8/
The CodeSandbox issue more closely resembles the original setup (i.e. using the npm package rather than the CDN scripts), but the error message covers the viewport which obfuscates one of the symptoms; the jsfiddle example also illustrates that the cause isn't something specific to the package form of the library.
In both of these demos, he most consistent way I could find to reproduce the issue was to resize the preview pane down to as narrow as it could go, and then resize it out to as far as it could go.
Product version
HIghcharts (and Highcharts More) >= 9.0.0
Affected browser(s)
Chrome, Edge, Safari and Firefox (and potentially others)
In terms of a workaround, because the issue doesn't appear on version 8.2.2 a revert would likely be the best option, but obviously since 9.0.0 provided major security updates it would be less than ideal. Unfortunately, the addition of Highcharts More is also essential in our use case, as we use the polar area chart type. Thanks for your help!