Changing `theme.mode` from light to dark does not correctly update a line chart

[sirockin]

Introduction

As this sandbox shows, setting the theme property to {mode:'dark'} will instantly change the chart to dark mode, but setting it back by setting {mode:'light'} does not work. (Nor does setting it to `{mode:'undefined'}

Expected Behaviour

Changing themes.mode from 'dark' to 'light' should instantly change all the chart's colors to the light theme.

Actual Behaviour

The chart appears to redraw and the line changes color back to that of the light theme, but the rest of the chart (background and text colors) remain those of the dark theme.

[sirockin]

Some further information which may be useful:

1. I have tried invoking both updateOptions() and render() directly on the ChartComponent object (obtained via @ViewChild()) and this does not help.
2. I have tried replicating the issue in native javascript using the core apexcharts.js library in this codepen Although I need to explicitly set the background light/dark to match the theme, the actual theming of everything else (eg chart labels) does work there, so it looks like an issue specific to this wrapper

[sirockin]

Looking further, I can see that the issue seems to be that chart.foreColor and chart.background automatically get set to "#f6f7f8" and "#424242" when the theme is changed to "dark" but do not get set back to undefined when the theme changes back. So a workaround is to explicitly do that when changing the theme from "dark" to "light".

[faenigma]

Same thing seems to happen with most/all the charts from what I can tell, I seem to need to change the forecolor and background options directly alongwith the mode changes.

[mirceaciu]

Looking further, I can see that the issue seems to be that chart.foreColor and chart.background automatically get set to "#f6f7f8" and "#424242" when the theme is changed to "dark" but do not get set back to undefined when the theme changes back. So a workaround is to explicitly do that when changing the theme from "dark" to "light".

I can confirm a similar behavior in the react package

[MadEddieFFS]

Is there any update on this - apols for bumping but it still seem to be an issue

[raversa001]

Still occurring to this day.

Using Debian 12 with

• angular@17.3.6
• apexcharts@3.49.0
• ng-apexcharts@1.10.0

Happens whether that's by directly the ChartOptions the object is bound to or calling updateOptions via @ViewChild. Could you please address?