Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

fontWeight behavior changed on Android between <0.60.0 and >= 0.60.0 - now high font weights can default to low ones

See original GitHub issue

Prior to 0.60.0 font weights that were not supported but were high would default to the nearest ‘bold’ font. Now they just default to a non-bold font.

React Native version:

Steps To Reproduce

1a. react-native init AwesomeProject (at time of writing defaults to version 0.60.3) 2a. Use this code in App.js


import React, {Fragment} from 'react';
import { Text, SafeAreaView } from 'react-native';

const App = () => {
  return (
      <SafeAreaView>
        <Text style={{fontWeight: '900'}}>FONT WEIGHT 900</Text>
        <Text style={{fontWeight: '800'}}>FONT WEIGHT 800</Text>
        <Text style={{fontWeight: '700'}}>FONT WEIGHT 700</Text>
        <Text style={{fontWeight: '600'}}>FONT WEIGHT 600</Text>
        <Text style={{fontWeight: '500'}}>FONT WEIGHT 500</Text>
        <Text style={{fontWeight: '400'}}>FONT WEIGHT 400</Text>
        <Text style={{fontWeight: '300'}}>FONT WEIGHT 300</Text>
        <Text style={{fontWeight: '200'}}>FONT WEIGHT 200</Text>
        <Text style={{fontWeight: '100'}}>FONT WEIGHT 100</Text>
      </SafeAreaView>
  );
};

export default App;

3a. Run the app in an emulator or on device 4a. Output: https://imgur.com/VEpgKzC

react-native info

  info Fetching system and libraries information...
  System:
      OS: macOS 10.14.5
      CPU: (8) x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
      Memory: 1.28 GB / 16.00 GB
      Shell: 3.2.57 - /bin/bash
    Binaries:
      Node: 12.2.0 - /usr/local/bin/node
      Yarn: 1.15.2 - /usr/local/bin/yarn
      npm: 6.10.0 - /usr/local/bin/npm
      Watchman: 4.9.0 - /usr/local/bin/watchman
    SDKs:
      iOS SDK:
        Platforms: iOS 12.2, macOS 10.14, tvOS 12.2, watchOS 5.2
      Android SDK:
        API Levels: 23, 28
        Build Tools: 28.0.3
        System Images: android-28 | Intel x86 Atom_64, android-28 | Google APIs Intel x86 Atom, android-28 | Google Play Intel x86 Atom
    IDEs:
      Android Studio: 3.4 AI-183.6156.11.34.5692245
      Xcode: 10.2.1/10E1001 - /usr/bin/xcodebuild
    npmPackages:
      react: 16.8.6 => 16.8.6 
      react-native: 0.60.3 => 0.60.3 
    npmGlobalPackages:
      create-react-native-app: 1.0.0
      react-native-cli: 2.0.1

THEN

1b. react-native init AwesomeProject2 --version 0.59.9 2b. Use code from above in App.js 3b. Run the app in an emulator or on device 4b. Output: https://imgur.com/ZW9hZGU

react-native info

  info 
    React Native Environment Info:
      System:
        OS: macOS 10.14.5
        CPU: (8) x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
        Memory: 1.34 GB / 16.00 GB
        Shell: 3.2.57 - /bin/bash
      Binaries:
        Node: 12.2.0 - /usr/local/bin/node
        Yarn: 1.15.2 - /usr/local/bin/yarn
        npm: 6.10.0 - /usr/local/bin/npm
        Watchman: 4.9.0 - /usr/local/bin/watchman
      SDKs:
        iOS SDK:
          Platforms: iOS 12.2, macOS 10.14, tvOS 12.2, watchOS 5.2
        Android SDK:
          API Levels: 23, 28
          Build Tools: 28.0.3
          System Images: android-28 | Intel x86 Atom_64, android-28 | Google APIs Intel x86 Atom, android-28 | Google Play Intel x86 Atom
      IDEs:
        Android Studio: 3.4 AI-183.6156.11.34.5692245
        Xcode: 10.2.1/10E1001 - /usr/bin/xcodebuild
      npmPackages:
        react: 16.8.3 => 16.8.3 
        react-native: 0.59.9 => 0.59.9 
      npmGlobalPackages:
        create-react-native-app: 1.0.0
        react-native-cli: 2.0.1

Describe what you expected to happen:

When an unsupported font weight is higher than a supported, non standard font weight, the default should be picked as the fatter one not the skinny one.

Snack, code example, or link to a repository: