Fix missing testIDs for existing button containers and enhance dynamic style test

Co-authored-by: anupriya13 <[email protected]>

Author: Copilot

packages/@react-native/tester/js/examples/Button/ButtonExample.js

@@ -72,7 +72,7 @@ exports.examples = [
         <RNTesterThemeContext.Consumer>
           {theme => {
             return (
-              <View style={styles.container}>
+              <View style={styles.container} testID="two_button_container">
                 <Button
                   onPress={() => onButtonPress('cancelled')}
                   testID="two_cancel_button"
@@ -101,7 +101,7 @@ exports.examples = [
         <RNTesterThemeContext.Consumer>
           {theme => {
             return (
-              <View style={styles.container}>
+              <View style={styles.container} testID="three_button_container">
                 <Button
                   onPress={() => onButtonPress('cancelled')}
                   testID="three_cancel_button"
@@ -336,7 +336,7 @@ function DynamicStyleButton(): React.Node {
   return (
     <RNTesterThemeContext.Consumer>
       {theme => (
-        <View style={[styles.dynamicContainer, isPressed && styles.pressedContainer]}>
+        <View style={[styles.dynamicContainer, isPressed && styles.pressedContainer]} testID="dynamic_style_container">
           <Button
             onPress={onPress}
             testID="dynamic_style_button"

packages/e2e-test-app-fabric/test/ButtonComponentTest.test.ts

@@ -215,9 +215,11 @@ describe('Button Tests', () => {
     const component = await app.findElementByTestID('dynamic_style_button');
     await component.waitForDisplayed({timeout: 5000});
 
-    // Get initial state
+    // Get initial state of both button and container
     const initialDump = await dumpVisualTree('dynamic_style_button');
     expect(initialDump).toMatchSnapshot('initial-styling');
+    const initialContainerDump = await dumpVisualTree('dynamic_style_container');
+    expect(initialContainerDump).toMatchSnapshot('initial-container-styling');
 
     // Click to change styling
     await component.click();
@@ -226,5 +228,9 @@ describe('Button Tests', () => {
     const updatedDump = await dumpVisualTree('dynamic_style_button');
     expect(updatedDump).toMatchSnapshot('updated-styling');
     expect(updatedDump.Text).toContain('Style Button (1)');
+    
+    // Also verify container styling changed
+    const updatedContainerDump = await dumpVisualTree('dynamic_style_container');
+    expect(updatedContainerDump).toMatchSnapshot('updated-container-styling');
   });
 });