Commit 92a0916
fix(fabric): fix Text overflow in ScrollView on first render (macOS) (#2880)
## Summary
- Add a `layoutSubviews` override in `RCTScrollViewComponentView` on
macOS that resets the `_containerView` (documentView) frame to
`_contentSize` after AppKit's autoresizing corrupts it
- This fixes massive horizontal and vertical overflow when Text is
nested inside a ScrollView on the first render
## Root Cause
On macOS, the `_containerView` serves as the `NSScrollView`'s
`documentView`, whose frame **directly determines the scrollable content
area** (unlike iOS where `UIScrollView.contentSize` is a separate
property).
React's layout system explicitly manages `_containerView.frame` via
`updateState:` to match the content bounding rect. However,
`autoresizingMask` caused AppKit to **also** resize the container
whenever the `NSClipView` resized (e.g., during initial `tile` after
mounting). This added the clip view's size delta to the container's
dimensions, inflating it well beyond the correct content size.
The `layoutSubviews` override runs after AppKit's layout pass (which
triggers autoresizing), so it reliably corrects the frame back to the
React-managed `_contentSize`.
The issue self-corrects on window resize because the size change
triggers a React re-layout that overwrites the corrupted frame with
fresh measurements.
## Test plan
| Before (bug) | After (fix) |
|---|---|
| <img
src="https://github.com/user-attachments/assets/6a63357e-6dd3-4f69-b134-2d0f78c5b995"
/> | <img
src="https://github.com/user-attachments/assets/5678e2ad-bc40-4987-aaa3-5854c809649e"
/> |
Fixes #2857
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>1 parent cb0f4ad commit 92a0916
File tree
1 file changed
+24
-0
lines changed- packages/react-native/React/Fabric/Mounting/ComponentViews/ScrollView
1 file changed
+24
-0
lines changedLines changed: 24 additions & 0 deletions
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
| |||
184 | 184 | | |
185 | 185 | | |
186 | 186 | | |
| 187 | + | |
| 188 | + | |
| 189 | + | |
| 190 | + | |
| 191 | + | |
| 192 | + | |
| 193 | + | |
| 194 | + | |
| 195 | + | |
| 196 | + | |
| 197 | + | |
| 198 | + | |
| 199 | + | |
| 200 | + | |
| 201 | + | |
| 202 | + | |
| 203 | + | |
| 204 | + | |
| 205 | + | |
| 206 | + | |
| 207 | + | |
| 208 | + | |
| 209 | + | |
| 210 | + | |
187 | 211 | | |
188 | 212 | | |
189 | 213 | | |
| |||
0 commit comments