Hacktoberfest 2026：維護者為十月標記出來的 issue，仍然開放、適合新手。 瀏覽 Hacktoberfest issue

[iOS][Fabric] Runtime Dynamic Type change leaves stale text layout: lines overflow and clip, onTextLayout reports stale widths (0.86)

未關閉
  • 哪裡不對？
#57,512 1 則留言 1 個 reaction 已指派 0 人 在 GitHub 檢視

維護者通常 1 天內回覆

還沒有人認領這個 Issue。

評估

難度
4/5
預估耗時
3-5 天
新手友好度
48/100
Issue 類型
缺陷
描述清晰度
基本清楚
活躍度
冷清
技術堆疊
cpp, ios, react-native
領域
mobile

研究方向

從連結的 rn-ios-dynamic-type-stale-text-layout reproducer 開始，並執行 npm install && npx expo run:ios --configuration Release。在執行期間變更模擬器的 content size，並使用 plain 和 with-reanimated 兩個分支，將版面配置和 onTextLayout 輸出與冷啟動重新執行進行比較。完成標準是：執行期間的 Dynamic Type 變更會重新排版文字、回報目前的行寬，且不再發生裁切或溢位。

由索引模型根據 Issue 內容生成。

描述

Description

On iOS with the New Architecture, when the user changes the Dynamic Type size while the app is running, already-rendered <Text> keeps its stale line breaks and box heights while glyphs draw at the new scale. Lines run past the right edge of the screen and are clipped mid-glyph. onTextLayout continues to report the stale (fitting) line widths, so the app cannot even detect the overflow programmatically. Killing and relaunching the app at the same Dynamic Type size renders the identical tree correctly.

This looks like the same stale-cached-text-measurement mechanism as #45857 (fixed via #45978) and is adjacent to #45655 (no re-render on font scale change), but it still reproduces on 0.86.0.

Observations:

  • Plain <View>/<Text> trees reproduce it — no third-party code involved (main branch of the reproducer).
  • The with-reanimated branch (same screen with the cards wrapped in react-native-reanimated Animated.Views, mirroring the production layout where this was first observed) reproduces identically. In production this also manifested as some text "freezing" at the pre-change font scale while other text scaled — i.e. mixed text sizes on one screen.
  • Android is unaffected.
  • Fresh mounts after a cold start are always correct; the defect only appears when the content size category changes during the app's lifetime.
  • Originally observed in production on RN 0.83 (Expo SDK 55) as paragraphs of rich text drawing past the right viewport edge whenever Dynamic Type was above default; no combination of flexShrink, explicit width, two-pass mount after onLayout, or removing onPress/accessibilityRole from nested spans avoided it.
Steps to reproduce
  1. npm install && npx expo run:ios --configuration Release (reproducer repo below)
  2. Launch on an iOS simulator at the default text size — everything renders correctly (banner shows fontScale 1.000 · 0 overflowing).
  3. While the app is running: xcrun simctl ui booted content_size extra-extra-large
  4. Observe: paragraphs draw past the right content edge (marked by a red hairline) with stale line breaks; the two cards clip their text; the banner still claims 0 overflowing because onTextLayout returns stale line widths.
  5. Kill and relaunch the app — the identical tree renders correctly at fontScale 1.235.
React Native Version

0.86.0

Affected Platforms

Runtime - iOS

Areas

Fabric - The New Renderer

Output of npx @react-native-community/cli info
System:
  OS: macOS 26.3.1
  CPU: (8) arm64 Apple M1
  Memory: 355.03 MB / 16.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 22.20.0
    path: /usr/local/bin/node
  Yarn: Not Found
  npm:
    version: 10.9.3
    path: /usr/local/bin/npm
  Watchman: Not Found
Managers:
  CocoaPods:
    version: 1.16.2
    path: /opt/homebrew/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 25.5
      - iOS 26.5
      - macOS 26.5
      - tvOS 26.5
      - visionOS 26.5
      - watchOS 26.5
IDEs:
  Xcode:
    version: 26.6/17F113
npmPackages:
  react: 19.2.0
  react-native: 0.86.0
Metro: bundled (Release build, no dev server)
Stacktrace or Logs
No crash — layout-only defect. The measurement API returns false negatives:
after the runtime Dynamic Type change, text visibly overflows the container,
yet onTextLayout still reports every line as fitting inside the Yoga box
("0 overflowing" in the reproducer's banner), because the reported line
widths are the pre-change values.
Reproducer

https://github.com/v-metricsadmin/rn-ios-dynamic-type-stale-text-layout

Screenshots and Videos
Fresh launch @ default (correct) Runtime change to XXL (broken) Relaunch @ XXL (correct)
baseline broken relaunch

Same defect on the with-reanimated branch (production-fidelity variant) — cards stop wrapping and clip after the runtime change:

reanimated-broken

主要語言
C++
星號
127k
分支
25.3k
30 天內沒有已合併 PR

環境準備

從這裡開始

  1. 先讀完整個 Issue，再讀專案的貢獻指南。
  2. 在 Issue 下留言說明你要接手 —— 這能避免兩個人做同樣的事。
  3. Fork 儲存庫，在一個分支上完成修改。
  4. 送出 Pull Request，並在描述裡引用這個 Issue 編號。

react/react-native 的其他 Issue

查看 react/react-native 的全部 Issue

相似的 Issue

更多 C++ Issue

把新 issue 寄到你的電子郵件信箱

精選適合新手參與的 GitHub issue 摘要。