feat: added rn detox setup

.detoxrc.js

@@ -3,7 +3,7 @@ module.exports = {
   testRunner: {
     args: {
       $0: 'jest',
-      config: 'e2e/jest.config.js',
+      config: 'detox-tests/e2e/jest.config.js',
     },
     jest: {
       setupTimeout: 120000,
@@ -58,6 +58,12 @@ module.exports = {
         avdName: 'Pixel_3a_API_34_extension_level_7_arm64-v8a',
       },
     },
+    ciEmulator: {
+      type: 'android.emulator',
+      device: {
+        avdName: 'Pixel_API_29_AOSP',
+      },
+    },
   },
   configurations: {
     'ios.sim.debug': {
@@ -80,6 +86,10 @@ module.exports = {
       device: 'emulator',
       app: 'android.debug',
     },
+    'android.emu.ci.debug': {
+      device: 'ciEmulator',
+      app: 'android.debug',
+    },
     'android.emu.release': {
       device: 'emulator',
       app: 'android.release',

.github/workflows/android-detox-automation.yml

@@ -0,0 +1,115 @@
+# .github/workflows/e2e-android.yml
+name: e2e-android
+on: push
+
+jobs:
+  e2e-android:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+
+      - name: Free Disk Space
+        run: |
+          sudo rm -rf /opt/hostedtoolcache
+          sudo rm -rf /usr/share/dotnet
+          sudo rm -rf /opt/ghc
+          sudo rm -rf "/usr/local/share/boost"
+
+      - name: Enable KVM
+        run: |
+          echo 'KERNEL=="kvm", GROUP="kvm", MODE="0666", OPTIONS+="static_node=kvm"' | sudo tee /etc/udev/rules.d/99-kvm4all.rules
+          sudo udevadm control --reload-rules
+          sudo udevadm trigger --name-match=kvm
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: '20'
+          # cache: 'npm'
+          # cache-dependency-path: '**/package-lock.json'
+
+      - name: Install dependencies
+        run: npm install
+
+      - name: Create .env file
+        run: |
+          touch .env
+          echo  ${{ secrets.HYPERSWITCH_PUBLISHABLE_KEY }}
+          echo STATIC_DIR = ./dist >> .env
+          echo HYPERSWITCH_PUBLISHABLE_KEY =  ${{ secrets.HYPERSWITCH_PUBLISHABLE_KEY }}>> .env
+          echo HYPERSWITCH_SECRET_KEY =  ${{ secrets.HYPERSWITCH_SECRET_KEY }}>> .env
+
+      - name: Start server
+        run: |
+          nohup node server.js &
+
+      - name: Check Server
+        run: |
+          curl http://localhost:5252/create-payment-intent
+
+      - name: Setup Java
+        uses: actions/setup-java@v3
+        with:
+          cache: gradle
+          distribution: temurin
+          java-version: 17
+
+      # - name: Cache Detox build
+      #   id: cache-detox-build
+      #   uses: actions/cache@v3
+      #   with:
+      #     path: android/app/build
+      #     key: ${{ runner.os }}-detox-build
+      #     restore-keys: |
+      #       ${{ runner.os }}-detox-build
+
+      # - name: List branches
+      #   run: |
+      #     cd android
+      #     git fetch --all
+      #     git branch -r
+
+      - name: Checkout Android Repo
+        uses: actions/checkout@v4
+        with:
+          repository: juspay/hyperswitch-sdk-android
+          ref: detox-poc
+          path: android
+          fetch-depth: 0
+
+      - name: Check Android branch
+        run: |
+          cd android && git branch && cd ..
+
+      - name: Generate & Supply JS Bundle to Test APK
+        run: |
+          npm run re:start && npm run bundle:android
+
+      - name: Detox build
+        run: cd android && ls && cd .. && npx detox build --configuration android.emu.ci.debug
+
+      - name: Get device name
+        id: device
+        run: node -e "console.log('AVD_NAME=' + require('./.detoxrc').devices.ciEmulator.device.avdName)" >> $GITHUB_OUTPUT
+
+      - name: Check Android branch
+        run: |
+          cd android && git branch && cd ..
+
+      - name: Detox test
+        uses: reactivecircus/android-emulator-runner@v2
+        with:
+          api-level: 30
+          target: default
+          arch: x86_64
+          profile: pixel
+          avd-name: ${{ steps.device.outputs.AVD_NAME }}
+          script: npx detox test --configuration android.emu.ci.debug  --headless --loglevel trace --record-logs all
+
+      - name: Upload artifacts
+        if: failure()
+        uses: actions/upload-artifact@v3
+        with:
+          name: detox-artifacts
+          path: artifacts

.gitignore

@@ -112,4 +112,9 @@ hyperswitch-react-native/lib/bs/
 #next
 .next/
 next-env.d.ts
-/out
+/out
+
+#detox
+*.log
+*.trace.json
+*.detox.jsonl

README.md

@@ -1,4 +1,4 @@
-# Hyperswitch Client Core
+# Hyperswitch Client Core test
 
 This repository hosts the essential components of the Hyperswitch SDK, which supports various platforms. Directly cloning this repository allows immediate access to a web-compatible version of the SDK.
 

detox-tests/babel.config.js

@@ -0,0 +1,8 @@
+module.exports = {
+  presets: [
+    '@babel/preset-env', // Handles modern JavaScript features like `export`
+  ],
+  plugins: [
+    '@babel/plugin-transform-modules-commonjs', // Transforms ES modules to CommonJS for Jest compatibility
+  ],
+};

detox-tests/e2e/card-flow-e2e.test.ts

@@ -0,0 +1,57 @@
+import * as testIds from "../../src/utility/test/TestUtils.bs.js";
+import { device } from "detox"
+describe('Example', () => {
+  jest.retryTimes(6);
+  beforeAll(async () => {
+    await device.launchApp({
+      launchArgs: { detoxEnableSynchronization: 1 },
+      newInstance: true,
+    });
+    await device.enableSynchronization();
+  });
+
+  it('demo app should load successfully', async () => {
+    await waitFor(element(by.text('Launch Payment Sheet')))
+      .toBeVisible()
+      .withTimeout(10000);
+    await element(by.text('Launch Payment Sheet')).tap();
+
+    await waitFor(element(by.text('Test Mode')))
+      .toBeVisible()
+      .withTimeout(10000);
+  });
+
+  it('should enter card no', async () => {
+    await device.enableSynchronization();
+    await waitFor(element(by.text('1234 1234 1234 1234')))
+      .toBeVisible()
+      .withTimeout(10000);
+
+    await element(by.id(testIds.cardNumberInputTestId)).tap();
+
+    await waitFor(element(by.id(testIds.cardNumberInputTestId))).toExist();
+    await waitFor(element(by.id(testIds.cardNumberInputTestId))).toBeVisible();
+
+    await element(by.id(testIds.cardNumberInputTestId)).clearText();
+    await element(by.id(testIds.cardNumberInputTestId)).replaceText('4242424242424242');
+
+    await waitFor(element(by.id(testIds.expiryInputTestId))).toExist();
+    await waitFor(element(by.id(testIds.expiryInputTestId))).toBeVisible();
+    await element(by.id(testIds.expiryInputTestId)).typeText('04/44');
+
+    await waitFor(element(by.id(testIds.cvcInputTestId))).toExist();
+    await waitFor(element(by.id(testIds.cvcInputTestId))).toBeVisible();
+    await element(by.id(testIds.cvcInputTestId)).typeText('123');
+
+
+    await waitFor(element(by.id(testIds.payButtonTestId)))
+      .toBeVisible()
+      .withTimeout(10000);
+
+
+    await element(by.id(testIds.payButtonTestId)).tap();
+    await waitFor(element(by.text('succeeded')))
+      .toBeVisible()
+      .withTimeout(10000);
+  });
+});

e2e/jest.config.js → detox-tests/e2e/jest.config.js

@@ -1,12 +1,17 @@
 /** @type {import('@jest/types').Config.InitialOptions} */
 module.exports = {
+  preset: 'ts-jest',
   rootDir: '..',
-  testMatch: ['<rootDir>/e2e/**/*.test.js'],
-  testTimeout: 120000,
+  testMatch: ['<rootDir>/e2e/**/*.test.ts'],
+  testTimeout: 1200000,
   maxWorkers: 1,
   globalSetup: 'detox/runners/jest/globalSetup',
   globalTeardown: 'detox/runners/jest/globalTeardown',
   reporters: ['detox/runners/jest/reporter'],
   testEnvironment: 'detox/runners/jest/testEnvironment',
   verbose: true,
+  transform: {
+    // Add a transformer for `.bs.js` files
+    '\\.bs\\.js$': 'babel-jest', // or specify a custom transformer if needed
+  },
 };

detox-tests/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "detox-tests",
+  "version": "1.0.0",
+  "main": "e2e/jest.config.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "author": "",
+  "license": "ISC",
+  "description": "",
+  "devDependencies": {
+    "@types/jest": "^29.5.14",
+    "@types/node": "^22.10.2",
+    "ts-jest": "^29.2.5",
+    "typescript": "^5.7.2"
+  }
+}

detox-tests/tsconfig.json

@@ -0,0 +1,9 @@
+{
+  "compilerOptions": {
+
+    "target": "ES2022",                          
+    "module": "commonjs",                               
+
+  },
+  "include": ["**/*.ts"]
+}

package.json

@@ -30,6 +30,8 @@
     "deploy-to-s3": "node ./scripts/pushToS3.js",
     "lint": "eslint .",
     "test": "jest",
+    "android:e2e": "npx detox test --configuration android.emu.debug  --loglevel trace --record-logs all",
+    "build:android-e2e": "npx detox build --configuration  android.emu.debug",
     "prepare": "husky"
   },
   "dependencies": {
@@ -192,5 +194,8 @@
     "@react-native/assets-registry": "patch:@react-native/assets-registry@npm%3A0.75.2#~/.yarn/patches/@react-native-assets-registry-npm-0.75.2-553af80bf2.patch",
     "react-native-code-push": "patch:react-native-code-push@npm%3A8.3.1#~/.yarn/patches/react-native-code-push-npm-8.3.1-9608679893.patch",
     "@react-native/gradle-plugin": "patch:@react-native/gradle-plugin@npm%3A0.75.2#~/.yarn/patches/@react-native-gradle-plugin-npm-0.75.2-3de59c69c5.patch"
-  }
+  },
+  "workspaces": [
+    "detox-tests"
+  ]
 }

server.js

@@ -5,7 +5,7 @@ app.use(cors());
 app.use(express.static('./dist'));
 app.use(express.json());
 
-require('dotenv').config({ path: './.env' });
+require('dotenv').config({path: './.env'});
 
 try {
   var hyper = require('@juspay-tech/hyperswitch-node')(
@@ -26,7 +26,7 @@ app.get('/create-payment-intent', async (req, res) => {
       capture_method: 'automatic',
       email: '[email protected]',
       business_country: 'US',
-      business_label: 'default',
+      profile_id: 'pro_ihVPK2u35TOUOp6ipPjF',
       billing: {
         address: {
           line1: '1467',
@@ -38,7 +38,7 @@ app.get('/create-payment-intent', async (req, res) => {
           country: 'PL',
           first_name: 'joseph',
           last_name: 'Doe',
-        }
+        },
       },
       shipping: {
         address: {
@@ -51,7 +51,7 @@ app.get('/create-payment-intent', async (req, res) => {
           country: 'PL',
           first_name: 'joseph',
           last_name: 'Doe',
-        }
+        },
       },
     });
 
@@ -61,7 +61,7 @@ app.get('/create-payment-intent', async (req, res) => {
       clientSecret: paymentIntent.client_secret,
     });
   } catch (err) {
-          console.log(err)
+    console.log(err);
 
     return res.status(400).send({
       error: {
@@ -81,7 +81,7 @@ app.get('/create-ephemeral-key', async (req, res) => {
           'Content-Type': 'application/json',
           'api-key': process.env.HYPERSWITCH_SECRET_KEY,
         },
-        body: JSON.stringify({ customer_id: "hyperswitch_sdk_demo_id" }),
+        body: JSON.stringify({customer_id: 'hyperswitch_sdk_demo_id'}),
       },
     );
     const ephemeralKey = await response.json();
@@ -108,7 +108,7 @@ app.get('/payment_methods', async (req, res) => {
           'Content-Type': 'application/json',
           'api-key': process.env.HYPERSWITCH_SECRET_KEY,
         },
-        body: JSON.stringify({ customer_id: 'hyperswitch_sdk_demo_id' }),
+        body: JSON.stringify({customer_id: 'hyperswitch_sdk_demo_id'}),
       },
     );
     const json = await response.json();