microsoft / microsoft/react-native-windows
Parent Component's layout props not forwarded to the child component
Nobody has claimed this yet.
- Dominant language
- C++
- Stars
- 17.3k
- Forks
- 1.2k
- Avg merge
- 1d 13h
- Merged PRs (30d)
- 33
Description
Problem Description
In the RNTester app, A component which will adjust font size based on layout height is not working cause when modifying the parent layout prop it is not getting reflected in the child layout.
The changes have to be made in FabricUIManager.cpp I believe
screenshare video:
https://github.com/user-attachments/assets/ade42fb4-189b-4a3f-ab36-dd7275e1d24e
Steps To Reproduce
It can be checked in RN tester App Fabric
Expected Results
The fontSize should be adjusted according, to the height.
After this #14519 pull request got merged.
CLI version
15.0.0-alpha.2
Environment
System:
OS: Windows 11 10.0.26100
CPU: "(16) x64 AMD EPYC 7763 64-Core Processor "
Memory: 44.96 GB / 63.95 GB
Binaries:
Node:
version: 22.14.0
path: C:\Program Files\nodejs\node.EXE
Yarn:
version: 1.22.22
path: C:\ProgramData\global-npm\yarn.CMD
npm:
version: 10.9.2
path: C:\Program Files\nodejs\npm.CMD
Watchman: Not Found
SDKs:
Android SDK: Not Found
Windows SDK:
AllowDevelopmentWithoutDevLicense: Enabled
Versions:
- 10.0.19041.0
- 10.0.22621.0
IDEs:
Android Studio: Not Found
Visual Studio:
- 17.13.35931.197 (Visual Studio Enterprise 2022)
Languages:
Java: Not Found
Ruby: Not Found
npmPackages:
"@react-native-community/cli": Not Found
react: Not Found
react-native: Not Found
react-native-windows: Not Found
npmGlobalPackages:
"*react-native*": Not Found
Android:
hermesEnabled: Not found
newArchEnabled: Not found
iOS:
hermesEnabled: Not found
newArchEnabled: Not found
Community Modules
No response
Target Platform Version
None
Target Device(s)
No response
Visual Studio Version
None
Build Configuration
None
Snack, code example, screenshot, or link to a repository
No response
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 packages/@react-native/tester/js/examples/Text/TextAdjustsDynamicLayoutExample.js and FabricUIManager.cpp, then reproduce the behavior in the RNTester Fabric app. Trace why a parent layout-prop change is not reflected in the child after #14519. Done means the child receives the updated layout height and the example adjusts its font size as expected.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- cpp, react-native
- Domain
- desktop-dev, frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 42/100