Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Nested Text on Android broken with fontWeight and fontStyle #34554

Closed
danilobuerger opened this issue Sep 1, 2022 · 3 comments
Closed

Nested Text on Android broken with fontWeight and fontStyle #34554

danilobuerger opened this issue Sep 1, 2022 · 3 comments
Labels
Needs: Triage 🔍 Platform: Android Android applications. Stale There has been a lack of activity on this issue and it may be closed soon.

Comments

@danilobuerger
Copy link
Contributor

danilobuerger commented Sep 1, 2022

Description

When nesting Text

<Text style={{fontWeight: 'bold'}}>
  bold<Text style={{fontStyle: 'italic'}}>bold & italic</Text>bold
</Text>

on Android, the font weight will not be applied to the inner Text:

Screenshot 2022-09-01 at 08 16 27

on iOS it renders as expected:

Screenshot 2022-09-01 at 08 25 01

Version

0.69.5 (also 0.70.0 rc4)

Output of npx react-native info

System:
    OS: macOS 12.5.1
    CPU: (8) arm64 Apple M1
    Memory: 124.08 MB / 16.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 18.7.0 - ~/.nvm/versions/node/v18.7.0/bin/node
    Yarn: 1.22.19 - /opt/homebrew/bin/yarn
    npm: 8.15.0 - ~/.nvm/versions/node/v18.7.0/bin/npm
    Watchman: 2022.08.15.00 - /opt/homebrew/bin/watchman
  Managers:
    CocoaPods: 1.11.3 - /Users/danilo/.rbenv/shims/pod
  SDKs:
    iOS SDK:
      Platforms: DriverKit 21.4, iOS 15.5, macOS 12.3, tvOS 15.4, watchOS 8.5
    Android SDK: Not Found
  IDEs:
    Android Studio: 2021.1 AI-211.7628.21.2111.8193401
    Xcode: 13.4.1/13F100 - /usr/bin/xcodebuild
  Languages:
    Java: 11.0.16 - /usr/bin/javac
  npmPackages:
    @react-native-community/cli: Not Found
    react: 18.0.0 => 18.0.0 
    react-native: 0.69.5 => 0.69.5 
    react-native-macos: Not Found
  npmGlobalPackages:
    *react-native*: Not Found

Steps to reproduce

  1. npx react-native init rn69 --version 0.69.5
  2. Apply this diff:
diff --git a/App.js b/App.js
index f85f38d..5fd3491 100644
--- a/App.js
+++ b/App.js
@@ -75,7 +75,9 @@ const App: () => Node = () => {
             screen and then come back to see your edits.
           </Section>
           <Section title="See Your Changes">
-            <ReloadInstructions />
+            <Text style={{fontWeight: 'bold'}}>
+              bold<Text style={{fontStyle: 'italic'}}>bold & italic</Text>bold
+            </Text>
           </Section>
           <Section title="Debug">
             <DebugInstructions />
  1. Run on Android. Notice that the text "bold & italic" is not bold, just italic.

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

https://snack.expo.dev/gomG4vYFh
(bug only shows on Android)

@fabOnReact
Copy link
Contributor

fabOnReact commented Sep 7, 2022

some of my notes on the ReactAndroid APIs #30375 (comment) #29117

@github-actions
Copy link

github-actions bot commented Mar 6, 2023

This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 7 days.

@github-actions github-actions bot added the Stale There has been a lack of activity on this issue and it may be closed soon. label Mar 6, 2023
@github-actions
Copy link

This issue was closed because it has been stalled for 7 days with no activity.

@facebook facebook locked as resolved and limited conversation to collaborators Mar 26, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Needs: Triage 🔍 Platform: Android Android applications. Stale There has been a lack of activity on this issue and it may be closed soon.
Projects
None yet
Development

No branches or pull requests

3 participants