Skip to content

App is changing from Light to Dark Theme after Webpack HMR #289

@Tyler-V

Description

@Tyler-V

Environment
image

Describe the bug
I am trying to ensure the app remains in light mode. When I am debugging I set my phone settings to enable dark mode. I then debug the app and initially it appears in light mode however when webpack reloads on a change during development, it then appears to apply the dark theme.

To Reproduce

  1. Turn dark mode on in the phone settings
  2. ns debug android on my connected Pixel 5 (Android 11)
  3. Change text in a component to trigger HMR
  4. App reloads and appears in the dark theme

image

Expected behavior
Dark mode should remain disabled and the ns-dark theme should not apply.

Additional context
I have tried the following to ensure dark mode does not apply, none prevent the app from changing from light to dark on HMR.

  1. Setting <item name="android:forceDarkAllowed">false</item> in styles.xml (values-v29)
  2. Annotating class="ns-light" on <page-router-outlet>
  3. Setting Theme.setMode(Theme.Light); manually on ngOnInit in the app component and main.ts
  4. Adding the following snipplet to force it to disable night mode in main.ts
if (android) {
    on(launchEvent, (args: ApplicationEventData) => {
        androidx.appcompat.app.AppCompatDelegate.setDefaultNightMode(androidx.appcompat.app.AppCompatDelegate.MODE_NIGHT_NO);
    });
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions