microsoft / microsoft/react-native-windows
allowRTL (and forceRTL) set in index.tsx file won't get set early enough to be used
Nobody has claimed this yet.
- Dominant language
- C++
- Stars
- 17.3k
- Forks
- 1.2k
- Avg merge
- 1d 13h
- Merged PRs (30d)
- 33
Description
Environment
Run the following in your terminal and copy the results here.
npx react-native --version: 4.13.0npx react-native info:
System:
OS: Windows 10 10.0.19042
CPU: (20) x64 Intel(R) Xeon(R) W-2255 CPU @ 3.70GHz
Memory: 41.07 GB / 63.69 GB
Binaries:
Node: 10.15.0 - C:\Program Files\nodejs\node.EXE
Yarn: Not Found
npm: 6.4.1 - C:\Program Files\nodejs\npm.CMD
Watchman: Not Found
SDKs:
Android SDK: Not Found
Windows SDK:
AllowDevelopmentWithoutDevLicense: Enabled
AllowAllTrustedApps: Enabled
Versions: 10.0.17763.0, 10.0.18362.0
IDEs:
Android Studio: Not Found
Visual Studio: 15.9.28307.1300 (Visual Studio Enterprise 2017), 16.8.30711.63 (Visual Studio Enterprise 2019)
Languages:
Java: Not Found
Python: 2.7.15 - C:\Users\emrou.windows-build-tools\python27\python.EXE
npmPackages:
@react-native-community/cli: 4.13.0 => 4.13.0
react: 16.13.1 => 16.13.1
react-native: 0.63.3 => 0.63.3
react-native-windows: 0.63.6 => 0.63.6
npmGlobalPackages:
react-native: Not Found
What device(s) are you targeting? Choose any from Desktop, Xbox, Hololens)
- Target Device(s): Desktop
Which version of Visual Studio are you using? Specify Visual Studio 2017 or Visual Studio 2019 - Visual Studio Version: 2019
Steps To Reproduce
Provide a detailed list of steps that reproduce the issue.
- Turn on RTL language for RNW XB GP app
- App does the RTL formatting
However, with NativeUIManager.addRootView, when querying isRTL, it will return false due to allowRTL being set to false. Trying to do I18nManager.allowRTL(true) in our earliest tsx file will set the property to true, but past the initial root view rendering, which will then mean the app will be still in LTR configuration.
Expected Results
If I set allowRTL in the index.tsx/bootstrapping file of our RNW code the native I18nManager would see and re-render as needed OR have a way for us to set allowRTL to be true in some native code or config file.
If I just hardcode I18nManager.isRTL to return true, the app will appropriately be configured in the RTL format.
Snack, code example, screenshot, or link to a repository:
N/A or engage offline
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the index.tsx bootstrapping path and trace how I18nManager.allowRTL and isRTL interact with NativeUIManager.addRootView during initial rendering. Reproduce with the RTL language setting and verify that a setting made in index.tsx affects the initial native root view, or that the requested native configuration path is available.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react-native, typescript
- Domain
- desktop, internationalization
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100