progress on Test432

Author: kligarski

FabricExample/e2e/examplesTests/tests.e2e.ts

@@ -1,8 +1,27 @@
-import { device } from 'detox';
+import { device, expect, element, by } from 'detox';
 
-describe('Tests from PRs and issues', () => {
-  beforeEach(async () => {
+describe('Test432', () => {
+  beforeAll(async () => {
     await device.reloadReactNative();
   });
 
+  it('should Test432 exist', async () => {
+    await waitFor(element(by.id('root-screen-tests-Test432')))
+    .toBeVisible()
+    .whileElement(by.id('root-screen-examples-scrollview'))
+    .scroll(100, 'down', NaN, 0.85);
+
+    await expect(element(by.id('root-screen-tests-Test432'))).toBeVisible();
+    await element(by.id('root-screen-tests-Test432')).tap();
+  });
+
+
+  // home home-square
+  // details details-red-square | click | details-green-square | click | details-red-square | back
+  // info info-green-square-1 | click | info-red-square info-green-square-1 info-green-square-2 | click | info-green-square-1 | back
+  // settings settings-square
+  // za kazdym powrotem do home sprawdzic czarny square
+
+
+
 });

apps/src/shared/Square.tsx

@@ -4,11 +4,13 @@ import { View } from 'react-native';
 interface Props {
   color?: string;
   size?: number;
+  testID?: string;
 }
 
 export const Square = ({
   size = 100,
   color = 'red',
+  testID,
 }: Props): React.JSX.Element => (
-  <View style={{ width: size, height: size, backgroundColor: color }} />
+  <View style={{ width: size, height: size, backgroundColor: color }} testID={testID} />
 );

apps/src/tests/Test432.tsx

@@ -45,7 +45,7 @@ const DetailsScreen = ({ navigation }: StackScreenProps<'Details'>) => {
     navigation.setOptions({
       headerBackVisible: !x,
       headerRight: () =>
-        x ? <Square size={20} color="green" /> : <Square size={10} />,
+        x ? <Square size={20} color="green" testID="details-green-square" /> : <Square size={10} testID="details-red-square" />,
     });
   }, [navigation, x]);
 
@@ -61,13 +61,13 @@ const InfoScreen = ({ navigation }: StackScreenProps<'Info'>) => {
 
   const square1 = (props: { tintColor?: string }) => (
     <View style={{ gap: 8, flexDirection: 'row' }}>
-      {hasLeftItem && <Square {...props} color="green" size={20} />}
-      <Square {...props} color="green" size={20} />
+      {hasLeftItem && <Square {...props} color="green" size={20} testID="info-green-square-2" />}
+      <Square {...props} color="green" size={20} testID="info-green-square-1" />
     </View>
   );
 
   const square2 = (props: { tintColor?: string }) => (
-    <Square {...props} color="red" size={20} />
+    <Square {...props} color="red" size={20} testID="info-red-square" />
   );
 
   useLayoutEffect(() => {
@@ -95,7 +95,7 @@ const StackNavigator = () => {
         name="Home"
         component={HomeScreen}
         options={{
-          headerRight: () => <Square size={20} color="black" />,
+          headerRight: () => <Square size={20} color="black" testID="home-square" />,
         }}
       />
       <Stack.Screen name="Details" component={DetailsScreen} />
@@ -112,7 +112,7 @@ const StackNavigator = () => {
         options={{
           presentation: 'modal',
           animation: 'slide_from_bottom',
-          headerRight: () => <Square size={30} />,
+          headerRight: () => <Square size={30} testID="settings-square" />,
         }}
       />
     </Stack.Navigator>