6 detox tests working

components/AddWorkout.js

@@ -18,7 +18,7 @@ import { addWorkoutData } from "../services/AuthAPI";
 import { useTheme } from "../services/ThemeContext";
 import getStyles from "../styles/AddStyles";
 
-const AddWorkout = ({ route }) => {
+const AddWorkout = ({ route, testID }) => {
   const navigation = useNavigation();
   const { savedWorkouts, setSavedWorkouts } = useWorkouts();
   const { userID } = route.params;
@@ -91,60 +91,66 @@ const AddWorkout = ({ route }) => {
   };
 
   return (
-    <View style={styles.screen}>
+    <View style={styles.screen} testID="add-workout-test">
       <View style={styles.createTextContainer}>
         <Pressable onPress={() => navigation.goBack()}>
           <Text style={styles.backButton}>←</Text>
         </Pressable>
-        <Text style={styles.createText}>Create Workout</Text>
+        <Text style={styles.createText} testID="add-workout-safe">Create Workout</Text>
         <View style={{ width: 24 }} />
       </View>
       <ScrollView style={styles.container}>
         <WorkoutHeader onClose={() => handleClose()} />
         <TextInput
+          testID="workout-name"
           style={styles.input}
           value={workoutName}
           placeholder="Workout Name"
           placeholderTextColor="grey"
           onChangeText={setWorkoutName}
         />
         <TextInput
+        testID="workout-type"
           style={styles.input}
           value={workoutType}
           placeholder="Type"
           placeholderTextColor="grey"
           onChangeText={setWorkoutType}
         />
         <TextInput
+        testID="workout-muscle"
           style={styles.input}
           value={workoutMuscle}
           placeholder="Muscle"
           placeholderTextColor="grey"
           onChangeText={setWorkoutMuscle}
         />
         <TextInput
+          testID="workout-equipment"
           style={styles.input}
           value={workoutEquipment}
           placeholder="Equipment"
           placeholderTextColor="grey"
           onChangeText={setWorkoutEquipment}
         />
         <TextInput
+          testID="workout-difficulty"
           style={styles.input}
           value={workoutDifficulty}
           placeholder="Difficulty"
           placeholderTextColor="grey"
           onChangeText={setWorkoutDifficulty}
         />
         <TextInput
+          testID="workout-instructions"
           style={[styles.input, styles.tallInput]}
           value={workoutInstructions}
           placeholder="Add instructions..."
           placeholderTextColor="grey"
           multiline
           onChangeText={setWorkoutInstructions}
         />
-        <CreateButton onPress={() => handleAdd()} label={"Create Workout"} />
+        <CreateButton onPress={() => handleAdd()} label={"Create Workout"} testID="submit-workout"/>
 
         {/* Confirmation Alert */}
         {showConfirmation &&

components/BrowseMeals.js

@@ -37,6 +37,7 @@ const BrowseMeals = ({ route }) => {
           <TouchableOpacity
             onPress={() => handleQueryButtonClick("meat")}
             style={styles.wrapper}
+            testID="browse-cookbook-meat-test"
           >
             {
               <ImageBackground

components/BrowseWorkouts.js

@@ -57,6 +57,7 @@ const BrowseWorkouts = ({props}) => {
           <TouchableOpacity
             onPress={() => handleQueryButtonClick("biceps")}
             style={styles.wrapper}
+            testID="browse-workouts-biceps-test"
           >
             {
               <ImageBackground

components/CreateButton.js

@@ -1,9 +1,9 @@
 import React from "react";
 import { TouchableOpacity, Text, StyleSheet } from "react-native";
 
-const CreateButton = ({ onPress, label }) => {
+const CreateButton = ({ onPress, label, testID }) => {
   return (
-    <TouchableOpacity style={styles.button} onPress={onPress}>
+    <TouchableOpacity style={styles.button} onPress={onPress} testID={testID}>
       <Text style={styles.buttonText}>{label}</Text>
     </TouchableOpacity>
   );

e2e/addWorkout.test.js

@@ -0,0 +1,48 @@
+const TIMEOUT = 10000;
+import loginUser from "./loginUser";
+
+async function tapVisibleButton(buttonId) {
+    await waitFor(element(by.id(buttonId))).toBeVisible().withTimeout(TIMEOUT);
+    await element(by.id(buttonId)).tap();
+}
+
+async function tapVisibleText(buttonId, text) {
+    await waitFor(element(by.id(buttonId))).toBeVisible().withTimeout(TIMEOUT);
+    await element(by.id(buttonId)).typeText(text);
+}
+
+describe('Add workout test', () => {
+  beforeEach(async () => {
+      await device.launchApp({newInstance: true});
+  });
+
+  it('should add workout', async () => {
+      await loginUser();
+      console.log("Logged in");
+      await waitFor(element(by.id('home-screen')))
+        .toBeVisible()
+        .withTimeout(10000)
+        .catch(e => {
+            console.error("Failed to find home screen within timeout: ", e);
+      });
+
+      await tapVisibleButton('add-test');
+      console.log('add button tapped');
+      await element(by.text('Create Workout')).tap();
+      console.log('add workout pressed');
+      await waitFor(element(by.id('add-workout-test'))).toBeVisible().withTimeout(TIMEOUT);
+      console.log('Add workout screen open');
+      await element(by.id('workout-name')).tap();
+      await element(by.id('workout-name')).typeText('Bicep Curls');
+      await element(by.id('workout-type')).typeText('Biceps');
+      await tapVisibleText('workout-muscle', 'Biceps');
+      await tapVisibleText('workout-equipment', 'Dumbbells');
+      await device.pressBack();
+      await tapVisibleText('workout-difficulty', 'Easy');
+      await device.pressBack();
+      await tapVisibleText('workout-instructions', 'Grab dumbbells and curl up');
+      await device.pressBack();
+      await tapVisibleButton('submit-workout');
+      await element(by.text("CREATE")).tap();
+  });
+});

e2e/browseMeals.test.js

@@ -0,0 +1,28 @@
+const TIMEOUT = 10000;
+import loginUser from "./loginUser";
+
+async function tapVisibleButton(buttonId) {
+    await waitFor(element(by.id(buttonId))).toBeVisible().withTimeout(TIMEOUT);
+    await element(by.id(buttonId)).tap();
+}
+
+describe('Add payment test', () => {
+  beforeEach(async () => {
+      await device.launchApp({newInstance: true});
+  });
+
+  it('should go to cookbook and click meat', async () => {
+      await loginUser();
+      console.log("Logged in");
+      await waitFor(element(by.id('home-screen')))
+        .toBeVisible()
+        .withTimeout(10000)
+        .catch(e => {
+            console.error("Failed to find home screen within timeout: ", e);
+      });
+
+      await tapVisibleButton('cookbook-test');
+      await tapVisibleButton('browse-cookbook-test');
+      await tapVisibleButton('browse-cookbook-meat-test');
+  });
+});

e2e/browseWorkouts.test.js

@@ -0,0 +1,28 @@
+const TIMEOUT = 10000;
+import loginUser from "./loginUser";
+
+async function tapVisibleButton(buttonId) {
+    await waitFor(element(by.id(buttonId))).toBeVisible().withTimeout(TIMEOUT);
+    await element(by.id(buttonId)).tap();
+}
+
+describe('Add payment test', () => {
+  beforeEach(async () => {
+      await device.launchApp({newInstance: true});
+  });
+
+  it('should go to workouts and click biceps', async () => {
+      await loginUser();
+      console.log("Logged in");
+      await waitFor(element(by.id('home-screen')))
+        .toBeVisible()
+        .withTimeout(10000)
+        .catch(e => {
+            console.error("Failed to find home screen within timeout: ", e);
+      });
+
+      await tapVisibleButton('workouts-test');
+      await tapVisibleButton('browse-workouts-test');
+      await tapVisibleButton('browse-workouts-biceps-test');
+  });
+});

navigators/TabNavigation.js

@@ -68,10 +68,9 @@ const TabNavigator = ({ route }) => {
           } else if (route.name === "Your Cookbook") {
             iconName = "food-fork-drink";
           } else if (route.name === "Add") {
-            iconName = "plus-circle"; // Customize as needed
+            iconName = "plus-circle";
           }
 
-          // You can return any component that you like here!
           return (
             <MaterialCommunityIcons name={iconName} size={size} color={color} />
           );
@@ -111,6 +110,7 @@ const TabNavigator = ({ route }) => {
             />
           ),
           headerShown: false,
+          tabBarTestID: 'add-test'
         }}
       />
       <Tab.Screen
@@ -119,7 +119,7 @@ const TabNavigator = ({ route }) => {
         initialParams={{
           userID: userID , // Keep only serializable parameters
         }}
-        options={{ headerShown: false }}
+        options={{ headerShown: false, tabBarTestID: 'workouts-test' }}
       />
 
       <Tab.Screen
@@ -128,7 +128,7 @@ const TabNavigator = ({ route }) => {
         initialParams={{
           userID: userID,
         }}
-        options={{ headerShown: false }}
+        options={{ headerShown: false, tabBarTestID: 'cookbook-test' }}
       />
       {/* Hidden screens for action sheet options */}
       <Tab.Screen

screens/AddScreen.js

@@ -1,27 +1,51 @@
 import React from "react";
 import { createStackNavigator } from "@react-navigation/stack";
+import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
 import AddTask from "../components/AddTask";
 import AddWorkout from "../components/AddWorkout";
 import AddMeal from "../components/AddMeal";
 
 const Stack = createStackNavigator();
+const Tab = createBottomTabNavigator();
 
 const AddScreen = () => {
   return (
     <Stack.Navigator>
-      <Stack.Screen name="AddScreenTabs" component={AddScreenTabs} />
+      <Stack.Screen name="AddScreenTabs" component={AddScreenTabs} testID="stack-test"/>
     </Stack.Navigator>
   );
 };
 
 const AddScreenTabs = () => {
   return (
     <Tab.Navigator>
-      <Tab.Screen name="Create Task" component={AddTask} />
-      <Tab.Screen name="Create Workout" component={AddWorkout} />
-      <Tab.Screen name="Create Meal" component={AddMeal} />
+      <Tab.Screen
+        name="Create Task"
+        component={AddTask}
+        options={{
+          tabBarButton: (props) => <TouchableOpacity {...props} testID="add-task"/>,
+          tabBarTestID:"add-task" 
+        }}
+      />
+      <Tab.Screen
+        name="Create Workouttttt"
+        component={AddWorkout}
+        options={{
+          tabBarButton: (props) => <TouchableOpacity {...props} testID="add-workout"/>,
+          tabBarTestID:"add-workout"
+        }}
+      />
+      <Tab.Screen
+        name="Create Meal"
+        component={AddMeal}
+        options={{
+          tabBarButton: (props) => <TouchableOpacity {...props} testID="add-meal"/>,
+          tabBarTestID:"add-meal"
+        }}
+      />
     </Tab.Navigator>
   );
 };
 
+
 export default AddScreen;

screens/CookbookScreen.js

@@ -42,6 +42,7 @@ const CookbookScreen = ({ route }) => {
               styles.tabItem,
               activeTab === "BrowseMeals" && styles.activeTab,
             ]}
+            testID='browse-cookbook-test'
             onPress={() => setActiveTab("BrowseMeals")}
           >
             <Text style={styles.tabText}>Browse</Text>

screens/HomeScreen.js

@@ -18,7 +18,7 @@ import { useTheme } from "../services/ThemeContext";
 import getStyles from "../styles/HomeScreenStyles";
 import eventEmitter from "../components/EventEmitter";
 import { set } from "date-fns";
-import { LogBox } from 'react-native';
+import { LogBox } from 'react-native';  // Hide warnings
 
 const HomeScreen = ({ route }) => {
   const navigation = useNavigation();
@@ -34,7 +34,7 @@ const HomeScreen = ({ route }) => {
   const [work, setWork] = useState(0);  
   const [gym, setGym] = useState(0);  
   const [personal, setPersonal] = useState(0);
-  LogBox.ignoreAllLogs();
+  LogBox.ignoreAllLogs();  // Hide warnings
 
   // Function to fetch tasks and calculate progress
   const fetchAndCalculateTasks = async () => {

screens/WorkoutScreen.js

@@ -21,7 +21,7 @@ const WorkoutScreen = ({ route }) => {
   const renderTabContent = () => {
     switch (activeTab) {
       case "BrowseWorkouts":
-        return <BrowseWorkouts userID={userID} />;
+        return <BrowseWorkouts userID={userID}/>;
       case "SavedWorkouts":
         return <SavedWorkouts userID={userID} />; // No props passed here
       default:
@@ -42,6 +42,7 @@ const WorkoutScreen = ({ route }) => {
               styles.tabItem,
               activeTab === "BrowseWorkouts" && styles.activeTab,
             ]}
+            testID='browse-workouts-test'
             onPress={() => setActiveTab("BrowseWorkouts")}
           >
             <Text style={styles.tabText}>Browse</Text>