Appearance issue

React-native Appearance has some issue on background mode. Here is an video example how to reproduce the bug in the app https://ru.files.fm/u/x5uzfjqtb#/view/swr72wr5p

Appearance listener will change the colorScheme value to “light” when app is in background mode and never back to dark.

useEffect(() => {
    const listener = ({colorScheme}: any) => {
      setIsDarkMode(colorScheme === 'dark');
    };
    Appearance.addChangeListener(listener);

    return () => {
      Appearance.removeChangeListener(listener);
    };
  }, []);

[ouabing]

Same issue like what @1111mp described. Appearance.addChangeListener will receive a wrong theme when app goes back to foreground.

react-native: 0.64.1

[1111mp]

I also encountered the same problem.

React.useEffect(() => {
    const _subscription = ({colorScheme}: Appearance.AppearancePreferences) => {
      console.log(colorScheme);
      console.log(Appearance.getColorScheme());
      stores.userStore.setAppTheme(colorScheme!);
    };

    Appearance.addChangeListener(_subscription);

    return () => {
      Appearance.removeChangeListener(_subscription);
    };
  }, []);

The phone is set to dark mode. When my app switches to the background, it will trigger a listener.The colorScheme parameter of the listener method prints light, while the one obtained by Appearance.getColorScheme() is dark. https://user-images.githubusercontent.com/31227919/117095257-771dad80-ad98-11eb-97d8-929b15d8f611.mov