Cutted on left for Android (BOLD text bug)

Question

I have react-native TextInput that automatically grows if I input long strings. On iOS it works as expected, but on Android, it starts cutting-off left side after 5-7 characters. The longer the string - the bigger cut-off. I tried to remove margins and paddings - no change. I looked into props in documentation - couldn't find a solution yet. I can scroll to see the cutted-off string, but I would like to see it without scrolling unless there is no more space to grow.

          <TextInput
            key={key}
            style={{
                flex:1, 
                fontSize: '1.2rem',
                fontWeight: 'bold',
            }}
            value={this.state.value}
            onChangeText={this._onChangeText}
            underlineColorAndroid="transparent"
            autoCapitalize="none"
            autoCompleteType='off' // Android
            autoCorrect={false} // iOS
            contextMenuHidden={true}
            importantForAutofill="no"
            keyboardAppearance="dark"
            maxLength={150}
            returnKeyType={returnKeyType}
            spellCheck={false}
            keyboardType={Platform.OS==='ios'
              ?'default'
              :"visible-password" // to disable autocorrect suggestions on android
            } 
          />

Answer 1

When I was preparing the question I found out that setting fontWeight: 'bold' causes this issue. But I am still looking at how to make it work with the bold text (if possible).

I tried to find a font which is bold without bold property, but it behaves the same... So it seems that TextInput works fine only with the default font, without bold property, which is unhandy.

Issue on github: https://github.com/facebook/react-native/issues/30317

Answer 2

Setting textBreakStrategy to simple on the TextInput element also seems to work for some devices.

Basically this is the conflict with the system font, so you can specify some other fontFamily for your text input. On more hack can be adding some extra space on left