Data update in rangearea series throws exception

[szpetny]

Expected behaviour

I would like to be able update data without exception

Actual behaviour

I have a chart with several series. The data gets updated upon zooming (which triggers a new HTTP request).
For the demo in jsfiddle the chart is updated inside afterSetExtremes event of x axis but it gives the same result (exception).

At first the jsfiddle should render into:

To reproduce the error try to zoom in in the main chart between green and orange part as marked in the picture below

The occurring exceptions is:

TypeError: this.series is undefined haloPath https://code.highcharts.com/stock/highcharts-more.js:7 setState https://code.highcharts.com/stock/highstock.js:8 setState https://code.highcharts.com/stock/highcharts-more.js:7 destroy https://code.highcharts.com/stock/highstock.js:8 destroy https://code.highcharts.com/stock/highstock.js:8 a https://code.highcharts.com/stock/highstock.js:8 remove https://code.highcharts.com/stock/highstock.js:8 update https://code.highcharts.com/stock/highstock.js:8 afterSetExtremes https://fiddle.jshell.net/_display/?editor_console=true:3391 afterSetExtremes https://fiddle.jshell.net/_display/?editor_console=true:3384 afterSetExtremes https://fiddle.jshell.net/_display/?editor_console=true:3374 C https://code.highcharts.com/stock/highstock.js:8 C https://code.highcharts.com/stock/highstock.js:8 redraw https://code.highcharts.com/stock/highstock.js:8 redraw https://code.highcharts.com/stock/highstock.js:8 redraw https://code.highcharts.com/stock/highstock.js:8 zoom https://code.highcharts.com/stock/highstock.js:8 drop https://code.highcharts.com/stock/highstock.js:8 C https://code.highcharts.com/stock/highstock.js:8 drop https://code.highcharts.com/stock/highstock.js:8 onDocumentMouseUp https://code.highcharts.com/stock/highstock.js:8 addEvent https://code.highcharts.com/stock/highstock.js:8 setDOMEvents https://code.highcharts.com/stock/highstock.js:8 S https://code.highcharts.com/stock/highstock.js:8 t https://code.highcharts.com/stock/highstock.js:8 C https://code.highcharts.com/stock/highstock.js:8 C https://code.highcharts.com/stock/highstock.js:8 firstRender https://code.highcharts.com/stock/highstock.js:8 init https://code.highcharts.com/stock/highstock.js:8 C https://code.highcharts.com/stock/highstock.js:8 init https://code.highcharts.com/stock/highstock.js:8 init https://code.highcharts.com/stock/highstock.js:8 tt https://code.highcharts.com/stock/highstock.js:8 C https://code.highcharts.com/stock/highstock.js:8 stockChart https://code.highcharts.com/stock/highstock.js:8 <anonymous> https://fiddle.jshell.net/_display/?editor_console=true:7733

This prevents the chart from being updated properly in our real world case.
I think it is related to the gap between the series.

Live demo with steps to reproduce

https://jsfiddle.net/nbpsa1v0/5/

Product version

Highcharts, Highstock 11.1.0

Affected browser(s)

tested in: Firefox 122.0 (64-bit), Chrome Version 121.0.6167.86 (Official Build) (64-bit)

[karolkolodziej]

Hi @szpetny!

Thank you for reporting the issue!
It has been broken since v11.0.0- we are trying to update the removed series.

I was unable to bisect and I'm also not convinced of how the data is updated there- needs further investigation.

Simplified demo.

[hubertkozik]

Workaround: https://jsfiddle.net/BlackLabel/4b1yfzh9/