Text component renders as black in dark mode

[chrisglein]

Problem Description

3 pieces of text:

1. No color set
2. Color set to 'green'
3. Use PlatformColor

While using PlatformColor on every text does get the right behavior... that's a change from the rendering on Paper.

Dark mode

Light mode

That first one (no color specified) should be white text, yes?

Steps To Reproduce

import { useColorScheme, Text, View, PlatformColor } from 'react-native';

function App() {
  const isDarkMode = useColorScheme() === 'dark';

  return (
    <View style={{flex: 1, justifyContent: 'center', alignItems: 'center', gap: 12, backgroundColor: isDarkMode ? '#444' : '#EEE'}}>
      <Text>Hello World</Text>
      <Text style={{color: 'green'}}>Hello World</Text>
      <Text style={{color: PlatformColor('TextControlForeground')}}>Hello World</Text>
    </View>
  );
}

export default App;

Expected Results

I would expect the text to default to white while in dark mode. But...
(via Expo Snack)

on iOS:

on Android:
[TBD]

CLI version

19.1.1

Environment

System:
  OS: Windows 11 10.0.27944
  CPU: "(24) x64 AMD Ryzen Threadripper PRO 3945WX 12-Cores     "
  Memory: 36.79 GB / 63.86 GB
Binaries:
  Node:
    version: 18.18.0
    path: C:\Program Files\nodejs\node.EXE
  Yarn:
    version: 1.22.19
    path: C:\Program Files (x86)\Yarn\bin\yarn.CMD
  npm:
    version: 9.8.1
    path: C:\Program Files\nodejs\npm.CMD
  Watchman: Not Found
SDKs:
  Android SDK: Not Found
  Windows SDK:
    AllowDevelopmentWithoutDevLicense: Enabled
    AllowAllTrustedApps: Enabled
    Versions:
      - 10.0.19041.0
      - 10.0.22621.0
      - 10.0.26100.0
IDEs:
  Android Studio: Not Found
  Visual Studio:
    - 17.14.36408.4 (Visual Studio Community 2022)
Languages:
  Java: Not Found
  Ruby: Not Found
npmPackages:
  "@react-native-community/cli":
    installed: 19.1.1
    wanted: 19.1.1
  react:
    installed: 19.1.0
    wanted: 19.1.0
  react-native:
    installed: 0.80.2
    wanted: 0.80.2
  react-native-windows:
    installed: 0.80.0-preview.6
    wanted: 0.80.0-preview.6
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: true
iOS:
  hermesEnabled: Not found
  newArchEnabled: Not found

Community Modules

None

Target React Native Architecture

New Architecture (WinAppSDK) Only

Target Platform Version

None

Visual Studio Version

None

Build Configuration

Debug

Snack, code example, screenshot, or link to a repository

https://snack.expo.dev/q9M5zdmgz11dXwy4oFLUA

[chrisglein]

Based on the behavior on iOS and Web (Android wasn't working for me, so I can't confirm), this is behaving by design (as in matching what happens in RN core).

However it isn't the same as Paper, so this should be covered in the migration guide for how to turn a Paper app into a Fabric app and challenges folks might find along the way.

[chrisglein]

Related: #15129
We should be consistent