RCTFont maps UltraBold font to UIFontWeightBold font weight

[dat-giggedin]

🐛 Bug Report

Cannot display correct GillSans-Bold font. It uses GillSans-UltraBold instead

To Reproduce

Add text to the screen <Text style={{fontFamily: 'GillSans-Bold'}}></Text>

Expected Behavior

Display correct font

Code Example

<Text style={{fontFamily: 'GillSans-Bold'}}></Text>

Environment

React Native Environment Info:
    System:
      OS: macOS 10.14.3
      CPU: (8) x64 Intel(R) Core(TM) i7-7820HQ CPU @ 2.90GHz
      Memory: 1.18 GB / 16.00 GB
      Shell: 3.2.57 - /bin/bash
    Binaries:
      Node: 11.6.0 - /usr/local/bin/node
      Yarn: 1.13.0 - /usr/local/bin/yarn
      npm: 6.7.0 - /usr/local/bin/npm
      Watchman: 4.9.0 - /usr/local/bin/watchman
    SDKs:
      iOS SDK:
        Platforms: iOS 12.1, macOS 10.14, tvOS 12.1, watchOS 5.1
      Android SDK:
        API Levels: 23, 25, 26, 28
        Build Tools: 28.0.3
        System Images: android-28 | Google Play Intel x86 Atom
    IDEs:
      Android Studio: 3.3 AI-182.5107.16.33.5199772
      Xcode: 10.1/10B61 - /usr/bin/xcodebuild
    npmPackages:
      react: 16.6.3 => 16.6.3 
      react-native: 0.58.4 => 0.58.4 
    npmGlobalPackages:
      react-native-cli: 2.0.1
      react-native-git-upgrade: 0.2.7

Because in RCTFont.mm, it uses UIFontWeight variants to get the fonts which has matching suffix (...Bold). It takes GillSans-UltraBold as its match and skip GillSans-Bold. Could you consider using UIFontWeightTrait and removing UIFontWeight variants checking?

[hramos]

cc @mmmulani / @shergin

[mmmulani]

does {fontFamily:'GillSans', fontWeight:'bold'} work? we use UIFontWeightTraits here: https://github.com/facebook/react-native/blob/master/React/Views/RCTFont.mm#L39

[dat-giggedin]

no, it didn’t. And yes, you use UIFontWeightTraits but it never reach to those code because the for loop map map UltraBold to Bold trait and return. I had to comment for loop in that function to make it work