Add e2e test

apps/mobile/package.json

@@ -7,6 +7,7 @@
   "scripts": {
     "start": "expo start",
     "android": "expo run:android",
+    "android:release": "expo run:android --variant release",
     "ios": "expo run:ios",
     "web": "expo start --web",
     "prebuild": "expo prebuild",
@@ -16,9 +17,9 @@
     "fmt": "cross-env SORT_IMPORTS=true prettier --write .",
     "fmt:check": "cross-env SORT_IMPORTS=true prettier --check .",
     "typecheck": "tsc",
-    "eslint:check": "expo lint --max-warnings 0 .",
-    "lint:fix": "expo lint --fix --max-warnings 0 .",
-    "lint": "expo lint"
+    "lint:fix": "eslint --fix --max-warnings 0 --report-unused-disable-directives .",
+    "eslint:check": "eslint --max-warnings 0 --report-unused-disable-directives .",
+    "test:e2e": "maestro test test/e2e/"
   },
   "dependencies": {
     "@dylankenneally/react-native-ssh-sftp": "^1.5.20",

apps/mobile/src/app/index.tsx

@@ -113,6 +113,7 @@ export default function Index() {
 							{(field) => (
 								<field.TextField
 									label="Host"
+									testID="host"
 									placeholder="example.com or 192.168.0.10"
 									autoCapitalize="none"
 									autoCorrect={false}
@@ -120,12 +121,19 @@ export default function Index() {
 							)}
 						</connectionForm.AppField>
 						<connectionForm.AppField name="port">
-							{(field) => <field.NumberField label="Port" placeholder="22" />}
+							{(field) => (
+								<field.NumberField
+									label="Port"
+									placeholder="22"
+									testID="port"
+								/>
+							)}
 						</connectionForm.AppField>
 						<connectionForm.AppField name="username">
 							{(field) => (
 								<field.TextField
 									label="Username"
+									testID="username"
 									placeholder="root"
 									autoCapitalize="none"
 									autoCorrect={false}
@@ -145,6 +153,7 @@ export default function Index() {
 								{(field) => (
 									<field.TextField
 										label="Password"
+										testID="password"
 										placeholder="••••••••"
 										secureTextEntry
 									/>
@@ -163,6 +172,7 @@ export default function Index() {
 						<View style={styles.actions}>
 							<connectionForm.SubmitButton
 								title="Connect"
+								testID="connect"
 								onPress={() => {
 									if (isSubmitting) return;
 									void connectionForm.handleSubmit();

apps/mobile/src/app/shell.tsx

@@ -89,6 +89,7 @@ function CommandInput(props: {
 	return (
 		<View style={styles.commandBar}>
 			<TextInput
+				testID="command-input"
 				style={styles.commandInput}
 				value={command}
 				onChangeText={setCommand}
@@ -99,7 +100,11 @@ function CommandInput(props: {
 				returnKeyType="send"
 				onSubmitEditing={handleExecute}
 			/>
-			<Pressable style={styles.executeButton} onPress={handleExecute}>
+			<Pressable
+				style={styles.executeButton}
+				onPress={handleExecute}
+				testID="execute-button"
+			>
 				<Text style={styles.executeButtonText}>Execute</Text>
 			</Pressable>
 		</View>

apps/mobile/src/components/form-components.tsx

@@ -120,12 +120,14 @@ export function PickerField<T>(
 	);
 }
 
-export function SubmitButton(props: {
-	onPress?: () => void;
-	title?: string;
-	disabled?: boolean;
-}) {
-	const { onPress, title = 'Connect', disabled } = props;
+export function SubmitButton(
+	props: {
+		onPress?: () => void;
+		title?: string;
+		disabled?: boolean;
+	} & React.ComponentProps<typeof Pressable>,
+) {
+	const { onPress, title = 'Connect', disabled, ...rest } = props;
 	const formContext = useFormContext();
 	const isSubmitting = useStore(
 		formContext.store,
@@ -133,6 +135,7 @@ export function SubmitButton(props: {
 	);
 	return (
 		<Pressable
+			{...rest}
 			style={[
 				styles.submitButton,
 				disabled ? styles.buttonDisabled : undefined,

apps/mobile/test/e2e/ConnectToDemoServer.yml

@@ -0,0 +1,38 @@
+appId: dev.fressh.app
+---
+- launchApp:
+    clearState: true
+- tapOn:
+    id: host
+- eraseText
+- inputText: test.rebex.net
+- tapOn:
+    id: port
+- eraseText: 5
+- inputText: '22'
+- tapOn:
+    id: username
+- eraseText
+- inputText: demo
+- tapOn:
+    id: password
+- eraseText
+- inputText: password
+- tapOn:
+    id: connect
+- tapOn:
+    id: command-input
+- inputText: help
+- tapOn:
+    id: execute-button
+- assertVisible: 'Supported commands:'
+# https://github.com/mobile-dev-inc/Maestro/issues/1592#issuecomment-2829630053
+- extendedWaitUntil:
+    visible: somethingThatIsNotInTheUI # Any random text that does not exist in the UI
+    optional: true # This should be true so that the test won't fail
+    timeout: 10000 # 10 seconds
+- back
+- extendedWaitUntil:
+    visible: somethingThatIsNotInTheUI # Any random text that does not exist in the UI
+    optional: true # This should be true so that the test won't fail
+    timeout: 10000 # 10 seconds