tests: setup e2e using Detox

.detoxrc.json

@@ -0,0 +1,20 @@
+{
+  "testRunner": "jest",
+  "runnerConfig": "e2e/config.json",
+  "configurations": {
+    "ios": {
+      "type": "ios.simulator",
+      "binaryPath": "ios/build/Build/Products/Release-iphonesimulator/Shabad OS.app",
+      "build": "xcodebuild -workspace ios/mobile.xcworkspace -scheme mobile -configuration Release -sdk iphonesimulator -derivedDataPath ios/build -destination 'name=iPhone 11' -quiet",
+      "device": {
+        "type": "iPhone 11"
+      }
+    },
+    "android": {
+      "type": "android.emulator",
+      "device": "emu",
+      "build": "cd android ; ./gradlew assembleDebug assembleAndroidTest -DtestBuildType=debug ; cd -",
+      "binaryPath": "android/app/build/outputs/apk/debug/app-debug.apk"
+    }
+  }
+}

.eslintrc

@@ -4,11 +4,13 @@
     {
       "extends": ["plugin:jest/recommended", "plugin:jest/style"],
       "files": [
+        "e2e/**",
         "**/test/**/*.[jt]s?(x)",
         "**/?(*.)+(spec|test).[jt]s?(x)",
         "*.config.js"
       ],
       "env": {
+        "detox/detox": true,
         "jest": true
       },
       "rules": {
@@ -42,7 +44,7 @@
   "parserOptions": {
     "project": "./tsconfig.json"
   },
-  "plugins": ["react-native", "simple-import-sort"],
+  "plugins": ["react-native", "simple-import-sort", "detox"],
   "rules": {
     // Spacing in brackets is consistent and readable
     "array-bracket-spacing": ["error", "always"],

.github/workflows/continuous-integration.yml

@@ -92,3 +92,103 @@ jobs:
 
       - name: Run tests
         run: npm run test:types
+
+  ios-e2e:
+    name: iOS End to End Tests
+    runs-on: macos-latest
+    needs: lint
+    env:
+      DEVELOPER_DIR: /Applications/Xcode_12.2.app
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2
+
+      - name: Use Node.js 12.x
+        uses: actions/setup-node@v1
+        with:
+          node-version: 12.x
+
+      - name: Cache Node.js modules
+        uses: actions/cache@v1
+        with:
+          path: ~/.npm
+          key: ${{ runner.OS }}-node-${{ hashFiles('**/package-lock.json') }}
+          restore-keys: |
+            ${{ runner.OS }}-node-
+            ${{ runner.OS }}-
+
+      - name: Install npm dependencies
+        run: npm i
+
+      - name: Cache Pods
+        uses: actions/cache@v1
+        id: podcache
+        with:
+          path: ios/Pods
+          key: pods-${{ hashFiles('**/Podfile.lock') }}
+
+      - name: Install dependencies for Detox
+        run: |
+          brew tap wix/brew
+          brew install applesimutils
+
+      - name: Build iOS
+        run: npm run build:e2e-ios
+
+      - name: Run E2E Tests
+        run: npm run e2e:ios -- --cleanup
+
+  android-e2e:
+    name: Android End to End tests
+    runs-on: macos-latest
+    needs: lint
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2
+
+      - name: Use Node.js 12.x
+        uses: actions/setup-node@v1
+        with:
+          node-version: 12.x
+
+      - name: Use JDK 1.8
+      - uses: actions/setup-java@v1
+        with:
+          java-version: '8'
+          java-package: jdk
+          architecture: x64
+
+      - name: Cache Node.js modules
+        uses: actions/cache@v1
+        with:
+          path: ~/.npm
+          key: ${{ runner.OS }}-node-${{ hashFiles('**/package-lock.json') }}
+          restore-keys: |
+            ${{ runner.OS }}-node-
+            ${{ runner.OS }}-
+
+      - name: Install npm dependencies
+        run: npm i
+
+      - name: Download Android Emulator Image
+        run: |
+          echo y | sudo $ANDROID_HOME/tools/bin/sdkmanager --verbose "system-images;android-29;google_apis;x86"
+          $ANDROID_HOME/tools/bin/avdmanager create avd -n emu -k "system-images;android-29;google_apis;x86" -b "x86" -c 1G -d 7 -f
+
+      - name: Build Android
+        run: npm run build:e2e-android
+
+      - name: Android Emulator
+        timeout-minutes: 10
+        continue-on-error: true
+        run: |
+          echo "Starting emulator"
+          nohup $ANDROID_HOME/emulator/emulator -avd emu -no-audio -no-snapshot -no-window &
+          $ANDROID_HOME/platform-tools/adb wait-for-device shell 'while [[ -z $(getprop sys.boot_completed | tr -d '\r') ]]; do sleep 1; done; input keyevent 82'
+          $ANDROID_HOME/platform-tools/adb devices
+          echo "Emulator started"
+
+      - name: Run E2E Tests
+        run: npm run e2e:android -- --cleanup

CONTRIBUTING.md

@@ -43,6 +43,13 @@ For Android or iOS, you'll need the following:
 - [Flipper](https://fbflipper.com/) (Debugging)
 - [Watchman](https://facebook.github.io/watchman/docs/install.html) (Live-reloading support)
 
+For running end to end tests, you'll need the following:
+
+- Globally installed [`detox-cli`](https://github.com/wix/Detox/blob/master/docs/Introduction.GettingStarted.md#install-detox-command-line-tools-detox-cli)
+- AppleSimulatorUtils [`applesimutils`](https://github.com/wix/AppleSimulatorUtils#applesimulatorutils)
+
+For more detailed instructions checkout detox introduction guides for [iOS](https://github.com/wix/Detox/blob/master/docs/Introduction.IosDevEnv.md) and [Android](https://github.com/wix/Detox/blob/master/docs/Introduction.AndroidDevEnv.md).
+
 Then according to your platform and target OS, follow the [React Native CLI Quickstart](https://reactnative.dev/docs/environment-setup) to setup your dev environment.
 
 **NOTE**: The React Native CLI is already bundled with the `mobile` repo. If you need to manage multiple Node.JS versions, use a node version manager to install [Node.JS](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm) instead of chocolatey like the Quickstart suggests. **_Use only jdk 8 and python2_**.
@@ -78,6 +85,14 @@ clean:ios         # Clean iOS build files
 install-assets    # Install any changed files in the "assets/" directory
 lint              # ESLint and checks code style
 test              # Typechecks + Unit + integration tests
+
+build:e2e         # Build iOS and Android apps for e2e tests
+build:e2e-ios     # Build iOS using detox
+build:e2e-ios     # Build Android using detox
+
+e2e               # Run End to End tests on iOS and Android
+e2e:ios           # Run iOS end to end tests using detox
+e2e:android       # Run Android end to end tests using detox
 ```
 
 **NOTE**: You will need to [connect a device via USB](https://developer.android.com/studio/run/device#connect) or [create an AVD](https://developer.android.com/studio/run/managing-avds#createavd) to start the [Android Emulator](https://developer.android.com/studio/run/emulator).

e2e/config.json

@@ -0,0 +1,11 @@
+{
+  "testRunner": "jest-circus/runner",
+  "testTimeout": 120000,
+  "reporters": ["detox/runners/jest/streamlineReporter"],
+  "verbose": true,
+  "testRegex": "\\.ts$",
+  "transform": {
+    "\\.tsx?$": "ts-jest"
+  },
+  "testEnvironment": "./environment"
+}

e2e/environment.js

@@ -0,0 +1,18 @@
+/* eslint-disable @typescript-eslint/no-unsafe-call */
+const { DetoxCircusEnvironment, SpecReporter, WorkerAssignReporter } = require( 'detox/runners/jest-circus' )
+
+class CustomDetoxEnvironment extends DetoxCircusEnvironment {
+  constructor( config, context ) {
+    super( config, context )
+
+    this.initTimeout = 300000
+
+    // This takes care of generating status logs on a per-spec basis.
+    this.registerListeners( {
+      SpecReporter,
+      WorkerAssignReporter,
+    } )
+  }
+}
+
+module.exports = CustomDetoxEnvironment

e2e/first.ts

@@ -0,0 +1,15 @@
+import { expect, by } from 'detox'
+
+describe( 'Home', () => {
+  beforeAll( async () => {
+    await device.launchApp( { newInstance: true } )
+  } )
+
+  beforeEach( async () => {
+    await device.reloadReactNative()
+  } )
+
+  it( 'should have home screen', async () => {
+    await expect( element( by.text( 'Shabad OS' ) ) ).toBeVisible()
+  } )
+} )