From 15ff9d5582e17bad2ebbe73793c3d21cde0aedf0 Mon Sep 17 00:00:00 2001 From: Nick Gerleman Date: Fri, 20 Feb 2026 14:35:03 -0800 Subject: [PATCH] Enable defaultTextToOverflowHidden by default (#55632) Summary: Talking to mdvacca, we think this change should be pretty safe, so turning on by default. Changelog entry in last change. Changelog: [Internal] Reviewed By: mdvacca Differential Revision: D93796779 --- .../Pressable/__tests__/Pressable-itest.js | 3 +- .../Libraries/Text/__tests__/Text-itest.js | 3 +- .../Libraries/Text/__tests__/Text-test.js | 61 +++++++++++++++++++ .../ReactNativeFeatureFlagsDefaults.kt | 4 +- .../ReactNativeFeatureFlagsDefaults.h | 4 +- .../ReactNativeFeatureFlags.config.js | 2 +- .../featureflags/ReactNativeFeatureFlags.js | 4 +- 7 files changed, 72 insertions(+), 9 deletions(-) diff --git a/packages/react-native/Libraries/Components/Pressable/__tests__/Pressable-itest.js b/packages/react-native/Libraries/Components/Pressable/__tests__/Pressable-itest.js index eb0cf9ff038d..8fd6a774cee7 100644 --- a/packages/react-native/Libraries/Components/Pressable/__tests__/Pressable-itest.js +++ b/packages/react-native/Libraries/Components/Pressable/__tests__/Pressable-itest.js @@ -150,7 +150,8 @@ describe('', () => { ellipsizeMode="tail" fontSize="NaN" fontSizeMultiplier="NaN" - foregroundColor="rgba(0, 0, 0, 0)"> + foregroundColor="rgba(0, 0, 0, 0)" + overflow="hidden"> the quick brown fox , diff --git a/packages/react-native/Libraries/Text/__tests__/Text-itest.js b/packages/react-native/Libraries/Text/__tests__/Text-itest.js index c52e45de65e4..b5bb9dd4825c 100644 --- a/packages/react-native/Libraries/Text/__tests__/Text-itest.js +++ b/packages/react-native/Libraries/Text/__tests__/Text-itest.js @@ -42,7 +42,8 @@ describe('', () => { ellipsizeMode="tail" fontSize="NaN" fontSizeMultiplier="NaN" - foregroundColor="rgba(0, 0, 0, 0)"> + foregroundColor="rgba(0, 0, 0, 0)" + overflow="hidden"> {TEST_TEXT} , ); diff --git a/packages/react-native/Libraries/Text/__tests__/Text-test.js b/packages/react-native/Libraries/Text/__tests__/Text-test.js index c7c199f4b137..242a51db44bc 100644 --- a/packages/react-native/Libraries/Text/__tests__/Text-test.js +++ b/packages/react-native/Libraries/Text/__tests__/Text-test.js @@ -66,6 +66,11 @@ describe('Text', () => { accessible={true} allowFontScaling={true} ellipsizeMode="tail" + style={ + Object { + "overflow": "hidden", + } + } /> `); }); @@ -88,6 +93,11 @@ describe('Text', () => { ellipsizeMode="tail" isHighlighted={false} isPressable={true} + style={ + Object { + "overflow": "hidden", + } + } > Clickable Text @@ -107,6 +117,11 @@ describe('Text', () => { ellipsizeMode="tail" isHighlighted={false} isPressable={true} + style={ + Object { + "overflow": "hidden", + } + } > Long Press Text @@ -126,6 +141,11 @@ describe('Text', () => { ellipsizeMode="tail" isHighlighted={false} isPressable={true} + style={ + Object { + "overflow": "hidden", + } + } > Responder Text @@ -147,6 +167,11 @@ describe('Text', () => { ellipsizeMode="tail" isHighlighted={false} isPressable={true} + style={ + Object { + "overflow": "hidden", + } + } > Explicit Button Role @@ -169,6 +194,11 @@ describe('Text', () => { isHighlighted={false} isPressable={true} role="button" + style={ + Object { + "overflow": "hidden", + } + } > Explicit Role Prop @@ -193,6 +223,11 @@ describe('Text', () => { allowFontScaling={true} disabled={true} ellipsizeMode="tail" + style={ + Object { + "overflow": "hidden", + } + } > Disabled Pressable Text @@ -211,12 +246,22 @@ describe('Text', () => { accessible={true} allowFontScaling={true} ellipsizeMode="tail" + style={ + Object { + "overflow": "hidden", + } + } > Parent Text Nested Clickable Link @@ -232,6 +277,11 @@ describe('Text', () => { accessible={true} allowFontScaling={true} ellipsizeMode="tail" + style={ + Object { + "overflow": "hidden", + } + } > Non-pressable Text @@ -257,6 +307,11 @@ describe('Text compat with web', () => { allowFontScaling={true} ellipsizeMode="tail" nativeID="id" + style={ + Object { + "overflow": "hidden", + } + } tabIndex={0} testID="testID" /> @@ -374,6 +429,11 @@ describe('Text compat with web', () => { ellipsizeMode="tail" importantForAccessibility="no-hide-descendants" role="main" + style={ + Object { + "overflow": "hidden", + } + } /> `); }); @@ -404,6 +464,7 @@ describe('Text compat with web', () => { "display": "flex", "flex": 1, "marginInlineStart": 10, + "overflow": "hidden", "textAlignVertical": "center", "userSelect": undefined, "verticalAlign": undefined, diff --git a/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/internal/featureflags/ReactNativeFeatureFlagsDefaults.kt b/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/internal/featureflags/ReactNativeFeatureFlagsDefaults.kt index 087a5ea6badd..908a14911cf0 100644 --- a/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/internal/featureflags/ReactNativeFeatureFlagsDefaults.kt +++ b/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/internal/featureflags/ReactNativeFeatureFlagsDefaults.kt @@ -4,7 +4,7 @@ * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. * - * @generated SignedSource<<9ae90142061f1ea0766058d9cf6f3dc6>> + * @generated SignedSource<<65cdfdcbe22ff163b75e0b067bd72693>> */ /** @@ -29,7 +29,7 @@ public open class ReactNativeFeatureFlagsDefaults : ReactNativeFeatureFlagsProvi override fun cxxNativeAnimatedEnabled(): Boolean = false - override fun defaultTextToOverflowHidden(): Boolean = false + override fun defaultTextToOverflowHidden(): Boolean = true override fun disableEarlyViewCommandExecution(): Boolean = false diff --git a/packages/react-native/ReactCommon/react/featureflags/ReactNativeFeatureFlagsDefaults.h b/packages/react-native/ReactCommon/react/featureflags/ReactNativeFeatureFlagsDefaults.h index 40ea8221bf4a..7567e6bc597f 100644 --- a/packages/react-native/ReactCommon/react/featureflags/ReactNativeFeatureFlagsDefaults.h +++ b/packages/react-native/ReactCommon/react/featureflags/ReactNativeFeatureFlagsDefaults.h @@ -4,7 +4,7 @@ * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. * - * @generated SignedSource<<1926124626012fd9c635ccd00241f92a>> + * @generated SignedSource<> */ /** @@ -40,7 +40,7 @@ class ReactNativeFeatureFlagsDefaults : public ReactNativeFeatureFlagsProvider { } bool defaultTextToOverflowHidden() override { - return false; + return true; } bool disableEarlyViewCommandExecution() override { diff --git a/packages/react-native/scripts/featureflags/ReactNativeFeatureFlags.config.js b/packages/react-native/scripts/featureflags/ReactNativeFeatureFlags.config.js index 690c691ac099..cf8407d6c82a 100644 --- a/packages/react-native/scripts/featureflags/ReactNativeFeatureFlags.config.js +++ b/packages/react-native/scripts/featureflags/ReactNativeFeatureFlags.config.js @@ -83,7 +83,7 @@ const definitions: FeatureFlagDefinitions = { ossReleaseStage: 'none', }, defaultTextToOverflowHidden: { - defaultValue: false, + defaultValue: true, metadata: { dateAdded: '2026-02-13', description: diff --git a/packages/react-native/src/private/featureflags/ReactNativeFeatureFlags.js b/packages/react-native/src/private/featureflags/ReactNativeFeatureFlags.js index 80fcbabf0409..7143af0bc992 100644 --- a/packages/react-native/src/private/featureflags/ReactNativeFeatureFlags.js +++ b/packages/react-native/src/private/featureflags/ReactNativeFeatureFlags.js @@ -4,7 +4,7 @@ * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. * - * @generated SignedSource<> + * @generated SignedSource<<97e082b7554dba5b4f387ef783d2d6e3>> * @flow strict * @noformat */ @@ -211,7 +211,7 @@ export const cxxNativeAnimatedEnabled: Getter = createNativeFlagGetter( /** * When enabled, sets the default overflow style for Text components to hidden instead of visible. */ -export const defaultTextToOverflowHidden: Getter = createNativeFlagGetter('defaultTextToOverflowHidden', false); +export const defaultTextToOverflowHidden: Getter = createNativeFlagGetter('defaultTextToOverflowHidden', true); /** * Dispatch view commands in mount item order. */