callstack · k0ndee · Sep 3, 2026
diff --git a/src/components/Appbar/AppbarContent.tsx b/src/components/Appbar/AppbarContent.tsx
@@ -140,7 +140,6 @@ const AppbarContent = ({
           numberOfLines={1}
           accessible
           role={onPress ? 'none' : 'heading'}
-          testID={`${testID}-title-text`}
           maxFontSizeMultiplier={titleMaxFontSizeMultiplier}
         >
           {title}

diff --git a/src/components/Appbar/AppbarHeader.tsx b/src/components/Appbar/AppbarHeader.tsx
@@ -124,7 +124,6 @@ const AppbarHeader = ({
 
   return (
     <View
-      testID={`${testID}-root-layer`}
       style={[
         {
           backgroundColor,

diff --git a/src/components/BottomNavigation/BottomNavigation.tsx b/src/components/BottomNavigation/BottomNavigation.tsx
@@ -578,7 +578,6 @@ const BottomNavigation = <Route extends BaseRoute>({
         safeAreaInsets={safeAreaInsets}
         labelMaxFontSizeMultiplier={labelMaxFontSizeMultiplier}
         compact={compact}
-        testID={`${testID}-bar`}
         theme={theme}
       />
     </View>

diff --git a/src/components/BottomNavigation/BottomNavigationBar.tsx b/src/components/BottomNavigation/BottomNavigationBar.tsx
@@ -494,10 +494,7 @@ const BottomNavigationBar = <Route extends BaseRoute>({
       onLayout={onLayout}
       container
     >
-      <Animated.View
-        style={[styles.barContent, { backgroundColor }]}
-        testID={`${testID}-content`}
-      >
+      <Animated.View style={[styles.barContent, { backgroundColor }]}>
         <View
           style={[
             styles.items,
@@ -510,7 +507,6 @@ const BottomNavigationBar = <Route extends BaseRoute>({
             },
           ]}
           role={'tablist'}
-          testID={`${testID}-content-wrapper`}
         >
           {routes.map((route, index) => {
             const focused = navigationState.index === index;

diff --git a/src/components/Button/Button.tsx b/src/components/Button/Button.tsx
@@ -319,7 +319,6 @@ const Button = ({
     <Surface
       {...rest}
       ref={ref}
-      testID={`${testID}-container`}
       style={
         [
           styles.button,
@@ -366,7 +365,7 @@ const Button = ({
       >
         <View style={[styles.content, { opacity: textOpacity }, contentStyle]}>
           {icon && loading !== true ? (
-            <View style={iconStyle} testID={`${testID}-icon-container`}>
+            <View style={iconStyle}>
               <Icon
                 source={icon}
                 size={customLabelSize ?? iconSize}
@@ -393,7 +392,6 @@ const Button = ({
             variant="labelLarge"
             selectable={false}
             numberOfLines={1}
-            testID={`${testID}-text`}
             style={[
               styles.label,
               isMode('text')

diff --git a/src/components/Card/Card.tsx b/src/components/Card/Card.tsx
@@ -236,14 +236,12 @@ const Card = ({
       ]}
       theme={theme}
       elevation={isMode('elevated') ? elevation : 0}
-      testID={`${testID}-container`}
       container
       {...rest}
     >
       {isMode('outlined') && (
         <View
           pointerEvents="none"
-          testID={`${testID}-outline`}
           style={[
             {
               borderColor,

diff --git a/src/components/Checkbox/CheckboxItem.tsx b/src/components/Checkbox/CheckboxItem.tsx
@@ -174,7 +174,6 @@ const CheckboxItem = ({
         {isLeading && checkbox}
         <Text
           variant={labelVariant}
-          testID={`${testID}-text`}
           maxFontSizeMultiplier={labelMaxFontSizeMultiplier}
           style={[styles.label, computedStyle, labelStyle]}
         >

diff --git a/src/components/Chip/Chip.tsx b/src/components/Chip/Chip.tsx
@@ -292,7 +292,6 @@ const Chip = ({
       ]}
       elevation={elevationStyle}
       {...rest}
-      testID={`${testID}-container`}
       theme={theme}
       container
     >

diff --git a/src/components/CrossFadeIcon.tsx b/src/components/CrossFadeIcon.tsx
@@ -87,6 +87,7 @@ const CrossFadeIcon = ({
 
   return (
     <View
+      testID={testID}
       style={[
         styles.content,
         {
@@ -104,7 +105,6 @@ const CrossFadeIcon = ({
               transform: [{ rotate: rotatePrev }],
             },
           ]}
-          testID={`${testID}-previous`}
         >
           <Icon source={previousIcon} size={size} color={color} theme={theme} />
         </Animated.View>
@@ -117,7 +117,6 @@ const CrossFadeIcon = ({
             transform: [{ rotate: rotateNext }],
           },
         ]}
-        testID={`${testID}-current`}
       >
         <Icon source={currentIcon} size={size} color={color} theme={theme} />
       </Animated.View>

diff --git a/src/components/DataTable/DataTableCell.tsx b/src/components/DataTable/DataTableCell.tsx
@@ -81,7 +81,6 @@ const DataTableCell = ({
     >
       <CellContent
         textStyle={textStyle}
-        testID={testID}
         maxFontSizeMultiplier={maxFontSizeMultiplier}
       >
         {children}
@@ -94,11 +93,7 @@ const CellContent = ({
   children,
   textStyle,
   maxFontSizeMultiplier,
-  testID,
-}: Pick<
-  Props,
-  'children' | 'textStyle' | 'testID' | 'maxFontSizeMultiplier'
->) => {
+}: Pick<Props, 'children' | 'textStyle' | 'maxFontSizeMultiplier'>) => {
   if (React.isValidElement(children)) {
     return children;
   }
@@ -108,7 +103,6 @@ const CellContent = ({
       style={textStyle}
       numberOfLines={1}
       maxFontSizeMultiplier={maxFontSizeMultiplier}
-      testID={`${testID}-text-container`}
     >
       {children}
     </Text>

diff --git a/src/components/Drawer/DrawerCollapsedItem.tsx b/src/components/Drawer/DrawerCollapsedItem.tsx
@@ -189,13 +189,9 @@ const DrawerCollapsedItem = ({
               },
               style,
             ]}
-            testID={`${testID}-outline`}
           />
 
-          <View
-            style={[styles.icon, { top: iconPadding }]}
-            testID={`${testID}-container`}
-          >
+          <View style={[styles.icon, { top: iconPadding }]}>
             {badge !== false && (
               <View style={styles.badgeContainer}>
                 {typeof badge === 'boolean' ? (

diff --git a/src/components/FAB/Content.tsx b/src/components/FAB/Content.tsx
@@ -27,7 +27,6 @@ export type ContentProps = {
   labelAnimatedStyle?: StyleProp<AnimatedStyle<ViewStyle>>;
   labelNumberOfLines?: number;
   labelEllipsisMode?: 'clip' | 'tail' | 'head' | 'middle';
-  testID?: string;
 };
 
 /**
@@ -50,7 +49,6 @@ const Content = ({
   labelAnimatedStyle,
   labelNumberOfLines,
   labelEllipsisMode,
-  testID,
 }: ContentProps) => {
   const hasLabel = label !== undefined && label !== '';
   const colorStyle = { color: contentColor };
@@ -86,7 +84,6 @@ const Content = ({
               ellipsizeMode={labelEllipsisMode}
               maxFontSizeMultiplier={labelMaxFontSizeMultiplier}
               style={colorStyle}
-              testID={testID ? `${testID}-text` : undefined}
             >
               {label}
             </AnimatedText>

diff --git a/src/components/FAB/Menu.tsx b/src/components/FAB/Menu.tsx
@@ -284,7 +284,6 @@ const MenuItem = ({
             leading={leading}
             trailing={trailing}
             iconLabelGap={iconLabelGap}
-            testID={testID}
           />
         </TouchableRipple>
       </View>

diff --git a/src/components/FAB/Shell.tsx b/src/components/FAB/Shell.tsx
@@ -295,7 +295,6 @@ const Shell = ({
         shadowStyle,
         visible ? styles.pointerEventsAuto : styles.pointerEventsNone,
       ]}
-      testID={`${testID}-container`}
     >
       <Reanimated.View style={[styles.clip, clipStyle]}>
         {overlay}
@@ -332,7 +331,6 @@ const Shell = ({
               labelAnimatedStyle={labelAnimatedStyle}
               labelNumberOfLines={labelAnimatedStyle ? 1 : undefined}
               labelEllipsisMode={labelAnimatedStyle ? 'clip' : undefined}
-              testID={testID}
             />
           )}
         </TouchableRipple>

diff --git a/src/components/IconButton/IconButton.tsx b/src/components/IconButton/IconButton.tsx
@@ -161,7 +161,6 @@ const IconButton = ({
   return (
     <Surface
       ref={ref}
-      testID={`${testID}-container`}
       style={[
         {
           backgroundColor: backgroundOpacity < 1 ? undefined : backgroundColor,

diff --git a/src/components/List/ListItem.tsx b/src/components/List/ListItem.tsx
@@ -240,10 +240,7 @@ const ListItem = ({
               style: getLeftStyles(alignToTop, description),
             })
           : null}
-        <View
-          style={[styles.item, styles.content, contentStyle]}
-          testID={`${testID}-content`}
-        >
+        <View style={[styles.item, styles.content, contentStyle]}>
           {renderTitle()}
 
           {description

diff --git a/src/components/Menu/Menu.tsx b/src/components/Menu/Menu.tsx
@@ -655,7 +655,6 @@ const Menu = ({
             style={[styles.wrapper, positionStyle, style]}
             pointerEvents={pointerEvents}
             onAccessibilityEscape={onDismiss}
-            testID={`${testID}-view`}
           >
             <Animated.View
               pointerEvents={pointerEvents}
@@ -675,7 +674,7 @@ const Menu = ({
                   contentStyle,
                 ]}
                 elevation={elevation}
-                testID={`${testID}-surface`}
+                testID={testID}
                 theme={theme}
                 container
               >

diff --git a/src/components/Menu/MenuItem.tsx b/src/components/Menu/MenuItem.tsx
@@ -220,7 +220,6 @@ const MenuItem = ({
             variant="bodyLarge"
             selectable={false}
             numberOfLines={1}
-            testID={`${testID}-title`}
             style={[titleTextStyle, titleStyle]}
             maxFontSizeMultiplier={titleMaxFontSizeMultiplier}
           >

diff --git a/src/components/Modal.tsx b/src/components/Modal.tsx
@@ -204,7 +204,6 @@ function Modal({
             }),
           },
         ]}
-        testID={`${testID}-backdrop`}
       />
       <View
         style={[
@@ -213,10 +212,8 @@ function Modal({
           style,
         ]}
         pointerEvents="box-none"
-        testID={`${testID}-wrapper`}
       >
         <Surface
-          testID={`${testID}-surface`}
           theme={theme}
           style={[{ opacity }, styles.content, contentContainerStyle]}
           container

diff --git a/src/components/ProgressBar.tsx b/src/components/ProgressBar.tsx
@@ -212,7 +212,6 @@ const ProgressBar = ({
       >
         {width ? (
           <Animated.View
-            testID={`${testID}-fill`}
             style={[
               styles.progressBar,
               {

diff --git a/src/components/Searchbar.tsx b/src/components/Searchbar.tsx
@@ -239,7 +239,6 @@ const Searchbar = ({
         styles.container,
         style,
       ]}
-      testID={`${testID}-container`}
       elevation={elevation}
       container
       theme={theme}
@@ -262,7 +261,6 @@ const Searchbar = ({
         }
         theme={theme}
         aria-label={searchAccessibilityLabel}
-        testID={`${testID}-icon`}
       />
       <TextInput
         style={[
@@ -300,7 +298,6 @@ const Searchbar = ({
         // when clearing the value.
         <View
           pointerEvents={value ? 'auto' : 'none'}
-          testID={`${testID}-icon-wrapper`}
           style={[
             !value && styles.v3ClearIcon,
             right !== undefined && styles.v3ClearIconHidden,
@@ -322,7 +319,6 @@ const Searchbar = ({
                 />
               ))
             }
-            testID={`${testID}-clear-icon`}
             role="button"
             theme={theme}
           />
@@ -336,7 +332,6 @@ const Searchbar = ({
           iconColor={traileringIconColor || colors.onSurfaceVariant}
           icon={traileringIcon}
           aria-label={traileringIconAccessibilityLabel}
-          testID={`${testID}-trailering-icon`}
         />
       ) : null}
       {isBarMode &&
@@ -350,7 +345,6 @@ const Searchbar = ({
               backgroundColor: colors.outline,
             },
           ]}
-          testID={`${testID}-divider`}
         />
       )}
     </Surface>

diff --git a/src/components/SegmentedButtons/SegmentedButtonItem.tsx b/src/components/SegmentedButtons/SegmentedButtonItem.tsx
@@ -211,14 +211,13 @@ const SegmentedButtonItem = ({
         >
           {showCheckedIcon ? (
             <Animated.View
-              testID={`${testID}-check-icon`}
               style={[iconStyle, { transform: [{ scale: checkScale }] }]}
             >
               <Icon source={'check'} size={iconSize} color={textColor} />
             </Animated.View>
           ) : null}
           {showIcon ? (
-            <Animated.View testID={`${testID}-icon`} style={iconStyle}>
+            <Animated.View style={iconStyle}>
               <Icon source={icon} size={iconSize} color={textColor} />
             </Animated.View>
           ) : null}
@@ -228,7 +227,6 @@ const SegmentedButtonItem = ({
             selectable={false}
             numberOfLines={1}
             maxFontSizeMultiplier={labelMaxFontSizeMultiplier}
-            testID={`${testID}-label`}
           >
             {label}
           </Text>

diff --git a/src/components/Snackbar.tsx b/src/components/Snackbar.tsx
@@ -351,7 +351,6 @@ const Snackbar = ({
                 }
                 aria-label={iconAccessibilityLabel}
                 style={styles.icon}
-                testID={`${testID}-icon`}
               />
             ) : null}
           </View>

diff --git a/src/components/Surface.tsx b/src/components/Surface.tsx
@@ -182,11 +182,7 @@ const SurfaceIOS = ({
   }, [style, elevation, backgroundColor, shadowColor, mode, container]);
 
   return (
-    <Animated.View
-      ref={ref}
-      style={outerLayerViewStyles}
-      testID={`${testID}-outer-layer`}
-    >
+    <Animated.View ref={ref} style={outerLayerViewStyles}>
       <Animated.View {...props} style={innerLayerViewStyles} testID={testID}>
         {children}
       </Animated.View>