Fix: text input scaling with different screen scales

[SBS-dlucas]

Description

Fixes issue with TextInput text rendering when working with monitors with different screen scales.

Type of Change

• Bug fix (non-breaking change which fixes an issue)

Why

Without this fix, rendering a textinput on a screen with a different resolution from the "primary" monitor can cause the text in TextInputs to appear blank, or large offset from correct position.

Resolves [https://github.com//issues/16141]

What

Fixed logic for updating textinput layout

Screenshots

Before, in E2E-test-app-fabric:
Note that there is text in these inputs, but it is invisible (but the cursor is in the right place still)

After, in E2E-test-app-fabric:

Testing

Locally tested rendering TextInput on different monitor scales

Changelog

Should this change be included in the release notes: yes

Resolved issue with TextInput text rendering when working with monitors with different screen scales.

Microsoft Reviewers: Open in CodeFlow

[SBS-dlucas]

@microsoft-github-policy-service agree company="Sea-Bird Scientific"

[vineethkuttan]

/azp run PR

[azure-pipelines]

Azure Pipelines successfully started running 1 pipeline(s).

[github-actions]

Performance Test Results

Branch: fix-text-input-scaling
Commit: 681c1485
Time: 2026-06-30T08:56:45.269Z
Tests: 161/161 passed

✅ Passed

161 scenario(s) across 28 suite(s) — no regressions

SectionList

Scenario	Mean	Median	StdDev	Renders	vs Baseline
SectionList mount	5.00ms	5.00ms	±0.94ms	1	+0.0%
SectionList unmount	0.00ms	0.00ms	±0.00ms	0	+0.0%
SectionList rerender	10.80ms	11.00ms	±1.75ms	2	+4.8%
SectionList with-3-sections-15-items	5.30ms	5.00ms	±1.06ms	1	-9.1%
SectionList with-5-sections-50-items	6.10ms	5.50ms	±1.91ms	1	-8.3%
SectionList with-10-sections-200-items	5.20ms	5.00ms	±0.63ms	1	-9.1%
SectionList with-20-sections-200-items	5.00ms	5.00ms	±2.40ms	1	+0.0%
SectionList with-section-separator	1.90ms	2.00ms	±0.32ms	1	+0.0%
SectionList with-item-separator	2.30ms	2.00ms	±0.67ms	1	+0.0%
SectionList with-header-footer	1.70ms	1.50ms	±0.82ms	1	-25.0%
SectionList with-section-footer	2.20ms	2.00ms	±1.40ms	1	+0.0%
SectionList with-sticky-section-headers	1.50ms	1.00ms	±0.71ms	1	-50.0%
SectionList with-empty-list	0.50ms	0.50ms	±0.53ms	1	-50.0%
SectionList with-50-sections-1000-items	1.50ms	1.50ms	±0.53ms	1	-25.0%

FlatList

Scenario	Mean	Median	StdDev	Renders	vs Baseline
FlatList mount	4.10ms	4.00ms	±0.74ms	1	+0.0%
FlatList unmount	0.40ms	0.00ms	±1.26ms	0	+0.0%
FlatList rerender	9.10ms	8.50ms	±1.37ms	2	-5.6%
FlatList with-10-items	4.20ms	4.00ms	±0.79ms	1	+0.0%
FlatList with-100-items	4.90ms	4.00ms	±1.60ms	1	-20.0%
FlatList with-500-items	4.20ms	4.00ms	±1.03ms	1	+0.0%
FlatList with-1000-items	4.40ms	4.00ms	±1.65ms	1	+0.0%
FlatList horizontal	3.50ms	4.00ms	±0.71ms	1	-20.0%
FlatList with-separator	2.10ms	2.00ms	±1.45ms	1	+0.0%
FlatList with-header-footer	1.20ms	1.00ms	±0.42ms	1	-50.0%
FlatList with-empty-list	0.40ms	0.00ms	±0.52ms	1	-100.0%
FlatList with-get-item-layout	1.60ms	1.50ms	±0.70ms	1	+50.0%
FlatList inverted	1.30ms	1.00ms	±0.48ms	1	-33.3%
FlatList with-num-columns	2.30ms	2.50ms	±0.82ms	1	-16.7%

TouchableOpacity

Scenario	Mean	Median	StdDev	Renders	vs Baseline
TouchableOpacity mount	0.60ms	1.00ms	±0.52ms	1	+0.0%
TouchableOpacity unmount	0.00ms	0.00ms	±0.00ms	0	+0.0%
TouchableOpacity rerender	1.30ms	1.00ms	±1.42ms	2	+0.0%
TouchableOpacity custom-active-opacity	0.60ms	1.00ms	±0.52ms	1	+0.0%
TouchableOpacity disabled	0.50ms	0.50ms	±0.53ms	1	-50.0%
TouchableOpacity with-all-handlers	0.60ms	1.00ms	±0.52ms	1	+0.0%
TouchableOpacity with-hit-slop	0.70ms	1.00ms	±0.48ms	1	+0.0%
TouchableOpacity with-delay	0.50ms	0.50ms	±0.53ms	1	-50.0%
TouchableOpacity nested	1.40ms	1.00ms	±0.52ms	1	+0.0%
TouchableOpacity multiple-10	4.87ms	4.00ms	±2.29ms	1	-33.3%
TouchableOpacity multiple-50	23.27ms	22.00ms	±3.24ms	1	-24.1%
TouchableOpacity multiple-100	21.80ms	20.00ms	±7.87ms	1	-60.0%

ScrollView

Scenario	Mean	Median	StdDev	Renders	vs Baseline
ScrollView mount	0.30ms	0.00ms	±0.48ms	1	+0.0%
ScrollView unmount	0.10ms	0.00ms	±0.32ms	0	+0.0%
ScrollView rerender	0.60ms	1.00ms	±0.52ms	2	+0.0%
ScrollView children-20	3.07ms	3.00ms	±1.16ms	1	-25.0%
ScrollView children-100	15.00ms	14.00ms	±2.83ms	1	-12.5%
ScrollView horizontal	3.60ms	3.00ms	±1.35ms	1	-25.0%
ScrollView sticky-headers	2.70ms	3.00ms	±0.67ms	1	+0.0%
ScrollView scroll-indicators	0.70ms	1.00ms	±0.48ms	1	+0.0%
ScrollView nested	1.40ms	1.00ms	±0.70ms	1	+0.0%
ScrollView content-container-style	0.70ms	1.00ms	±0.48ms	1	+0.0%
ScrollView children-500	19.00ms	19.00ms	±2.48ms	1	+0.0%

TouchableHighlight

Scenario	Mean	Median	StdDev	Renders	vs Baseline
TouchableHighlight mount	0.50ms	0.50ms	±0.53ms	1	+0.0%
TouchableHighlight unmount	0.00ms	0.00ms	±0.00ms	0	+0.0%
TouchableHighlight rerender	0.40ms	0.00ms	±0.52ms	2	-100.0%
TouchableHighlight custom-underlay-color	0.50ms	0.50ms	±0.53ms	1	+Infinity%
TouchableHighlight custom-active-opacity	0.30ms	0.00ms	±0.48ms	1	+0.0%
TouchableHighlight disabled	0.30ms	0.00ms	±0.48ms	1	+0.0%
TouchableHighlight with-all-handlers	0.20ms	0.00ms	±0.42ms	1	+0.0%
TouchableHighlight with-hit-slop	0.40ms	0.00ms	±0.52ms	1	+0.0%
TouchableHighlight nested-touchables	0.80ms	1.00ms	±0.42ms	1	+0.0%
TouchableHighlight multiple-touchables-10	2.40ms	2.00ms	±1.35ms	1	-33.3%
TouchableHighlight multiple-touchables-50	12.00ms	12.00ms	±1.63ms	1	-4.0%
TouchableHighlight multiple-touchables-100	21.80ms	21.50ms	±2.25ms	1	-4.4%

Pressable

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Pressable mount	0.20ms	0.00ms	±0.42ms	1	+0.0%
Pressable unmount	0.10ms	0.00ms	±0.32ms	0	+0.0%
Pressable rerender	0.40ms	0.00ms	±0.52ms	2	-100.0%
Pressable with-all-handlers	0.30ms	0.00ms	±0.48ms	1	+0.0%
Pressable with-style-function	0.20ms	0.00ms	±0.42ms	1	+0.0%
Pressable disabled	0.30ms	0.00ms	±0.48ms	1	+0.0%
Pressable with-hit-slop	0.40ms	0.00ms	±0.52ms	1	+0.0%
Pressable nested	1.20ms	1.00ms	±1.75ms	1	+0.0%
Pressable multiple-10	2.67ms	3.00ms	±0.62ms	1	+0.0%
Pressable multiple-50	14.00ms	14.00ms	±2.07ms	1	+0.0%
Pressable multiple-100	27.20ms	20.00ms	±23.01ms	1	+66.7%

Modal

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Modal mount	0.20ms	0.00ms	±0.42ms	1	+0.0%
Modal unmount	0.10ms	0.00ms	±0.32ms	0	+0.0%
Modal rerender	0.40ms	0.00ms	±0.52ms	2	+0.0%
Modal slide-animation	0.10ms	0.00ms	±0.32ms	1	+0.0%
Modal fade-animation	0.30ms	0.00ms	±0.48ms	1	+0.0%
Modal transparent	0.30ms	0.00ms	±0.48ms	1	+0.0%
Modal with-callbacks	0.20ms	0.00ms	±0.42ms	1	+0.0%
Modal rich-content	1.30ms	1.00ms	±0.48ms	1	-50.0%
Modal with-accessibility	0.40ms	0.00ms	±0.52ms	1	+0.0%

Image

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Image mount	0.20ms	0.00ms	±0.42ms	1	+0.0%
Image unmount	0.00ms	0.00ms	±0.00ms	0	+0.0%
Image rerender	0.20ms	0.00ms	±0.42ms	2	+0.0%
Image with-resize-mode	0.50ms	0.00ms	±1.27ms	1	+0.0%
Image with-border-radius	0.00ms	0.00ms	±0.00ms	1	+0.0%
Image with-tint-color	0.00ms	0.00ms	±0.00ms	1	+0.0%
Image with-blur-radius	0.10ms	0.00ms	±0.32ms	1	+0.0%
Image with-accessibility	0.10ms	0.00ms	±0.32ms	1	+0.0%
Image multiple-10	0.80ms	1.00ms	±0.41ms	1	+0.0%
Image multiple-50	3.60ms	3.00ms	±1.12ms	1	+0.0%
Image multiple-100	7.40ms	7.00ms	±1.06ms	1	-12.5%

ActivityIndicator

Scenario	Mean	Median	StdDev	Renders	vs Baseline
ActivityIndicator mount	0.20ms	0.00ms	±0.42ms	1	+0.0%
ActivityIndicator unmount	0.00ms	0.00ms	±0.00ms	0	+0.0%
ActivityIndicator rerender	0.00ms	0.00ms	±0.00ms	2	+0.0%
ActivityIndicator size-large	0.10ms	0.00ms	±0.32ms	1	+0.0%
ActivityIndicator size-small	0.00ms	0.00ms	±0.00ms	1	+0.0%
ActivityIndicator with-color	0.10ms	0.00ms	±0.32ms	1	+0.0%
ActivityIndicator not-animating	0.10ms	0.00ms	±0.32ms	1	+0.0%
ActivityIndicator with-accessibility	0.10ms	0.00ms	±0.32ms	1	+0.0%
ActivityIndicator multiple-10	0.87ms	1.00ms	±0.35ms	1	+0.0%
ActivityIndicator multiple-50	3.53ms	4.00ms	±0.99ms	1	+0.0%
ActivityIndicator multiple-100	7.40ms	7.00ms	±0.83ms	1	+0.0%

Switch

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Switch mount	0.30ms	0.00ms	±0.48ms	1	+0.0%
Switch unmount	0.00ms	0.00ms	±0.00ms	0	+0.0%
Switch rerender	0.20ms	0.00ms	±0.42ms	2	-100.0%
Switch value-true	0.30ms	0.00ms	±0.48ms	1	+0.0%
Switch disabled	0.30ms	0.00ms	±0.48ms	1	+0.0%
Switch custom-colors	0.30ms	0.00ms	±0.48ms	1	+0.0%
Switch on-value-change	0.20ms	0.00ms	±0.42ms	1	+0.0%
Switch with-accessibility	0.10ms	0.00ms	±0.32ms	1	+0.0%
Switch multiple-10	1.53ms	1.00ms	±1.06ms	1	-50.0%
Switch multiple-50	8.33ms	7.00ms	±2.82ms	1	-22.2%
Switch multiple-100	16.47ms	17.00ms	±2.77ms	1	+6.3%

Button

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Button mount	0.60ms	1.00ms	±0.52ms	1	+0.0%
Button unmount	0.10ms	0.00ms	±0.32ms	0	+0.0%
Button rerender	0.90ms	1.00ms	±0.57ms	2	+0.0%
Button disabled	0.40ms	0.00ms	±0.52ms	1	-100.0%
Button with-color	0.50ms	0.50ms	±0.53ms	1	+0.0%
Button with-accessibility	0.40ms	0.00ms	±0.52ms	1	-100.0%
Button multiple-10	5.00ms	5.00ms	±1.31ms	1	-16.7%
Button multiple-50	19.60ms	22.00ms	±6.59ms	1	-18.5%
Button multiple-100	14.33ms	14.00ms	±2.85ms	1	-26.3%

TextInput

Scenario	Mean	Median	StdDev	Renders	vs Baseline
TextInput mount	0.10ms	0.00ms	±0.32ms	1	+0.0%
TextInput unmount	0.00ms	0.00ms	±0.00ms	0	+0.0%
TextInput rerender	0.10ms	0.00ms	±0.32ms	2	+0.0%
TextInput multiline	0.00ms	0.00ms	±0.00ms	1	+0.0%
TextInput with-value	0.10ms	0.00ms	±0.32ms	1	+0.0%
TextInput styled	0.10ms	0.00ms	±0.32ms	1	+0.0%
TextInput multiple-100	6.87ms	6.00ms	±1.64ms	1	-14.3%

View

Scenario	Mean	Median	StdDev	Renders	vs Baseline
View mount	0.20ms	0.00ms	±0.42ms	1	+0.0%
View unmount	0.00ms	0.00ms	±0.00ms	0	+0.0%
View rerender	0.30ms	0.00ms	±0.48ms	2	+0.0%
View nested-50	3.00ms	3.00ms	±0.65ms	1	+0.0%
View nested-100	7.27ms	7.00ms	±1.49ms	1	+0.0%
View shadow	0.00ms	0.00ms	±0.00ms	1	+0.0%
View border-radius	0.10ms	0.00ms	±0.32ms	1	+0.0%
View nested-500	16.33ms	10.00ms	±11.53ms	1	+0.0%

Text

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Text mount	0.20ms	0.00ms	±0.42ms	1	+0.0%
Text unmount	0.00ms	0.00ms	±0.00ms	0	+0.0%
Text rerender	0.00ms	0.00ms	±0.00ms	2	+0.0%
Text long-1000	0.10ms	0.00ms	±0.32ms	1	+0.0%
Text nested	0.20ms	0.00ms	±0.42ms	1	+0.0%
Text styled	0.20ms	0.00ms	±0.42ms	1	+0.0%
Text multiple-100	8.33ms	8.00ms	±1.80ms	1	+14.3%

SectionList.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
SectionList native mount	4.81ms	4.65ms	±0.63ms	1	-28.4%

FlatList.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
FlatList native mount	4.42ms	4.38ms	±0.66ms	1	-52.5%

TouchableHighlight.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
TouchableHighlight native mount	1.33ms	1.29ms	±0.13ms	1	-38.3%

TouchableOpacity.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
TouchableOpacity native mount	1.48ms	1.50ms	±0.07ms	1	-52.2%

Pressable.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Pressable native mount	1.57ms	1.33ms	±0.68ms	1	-46.8%

ScrollView.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
ScrollView native mount	3.19ms	3.04ms	±0.44ms	1	-25.0%

ActivityIndicator.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
ActivityIndicator native mount	1.61ms	1.30ms	±0.73ms	1	-47.5%

TextInput.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
TextInput native mount	2.17ms	2.00ms	±0.50ms	1	-51.2%

Switch.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Switch native mount	1.13ms	1.02ms	±0.24ms	1	-41.1%

Button.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Button native mount	1.67ms	1.60ms	±0.19ms	1	-38.5%

Modal.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Modal native mount	0.86ms	0.80ms	±0.16ms	1	-34.0%

Image.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Image native mount	1.65ms	1.64ms	±0.16ms	1	-27.5%

View.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
View native mount	1.13ms	0.95ms	±0.45ms	1	-33.6%

Text.native-perf-test.ts

Scenario	Mean	Median	StdDev	Renders	vs Baseline
Text native mount	1.22ms	1.15ms	±0.28ms	1	-33.9%