A Semaphore demo CI pipeline for a React Native project targeting iOS and Android.

JavaScript 9.76% Ruby 4.13% Java 11.48% Objective-C 7.62% Starlark 1.01% TypeScript 65.36% C 0.35% Swift 0.29%

semaphore-demo-react-native's Introduction

Semaphore demo CI/CD pipeline using React Native

Example application and CI/CD pipeline showing how to run a React Native project on Semaphore 2.0. Uses React Native CLI Quickstart.

CI/CD on Semaphore

Fork this repository and use it to create a project.

The CI pipeline will look like this:

To run just iOS CI, change pipeline file to run ios.yml:

The CI pipeline will look like this (iOS):

To run just Android CI, change pipeline file to run android.yml:

The CI pipeline will look like this (Android):

The example pipeline contains 4 blocks:

Install dependencies
- Installs and caches all npm dependencies
Run linter
- Lint the code using eslint with @react-native-community/eslint-config
Run tests
- Runs unit and integration tests using Jest and Enzyme. Runs e2e UI tests using Detox
Build app
- Uses Fastlane as build automation tool (with a refference to Fastlane — Simple React Native iOS Releases and Fastlane — Simple React Native Android Releases)

Local project setup

Installation

$ npm install

Running the app

$ npm start

Lint

$ npm run lint

Unit and integration tests

$ npm test

e2e UI tests iOS

$ npm run detox-ios-build
$ npm run detox-ios-test

e2e UI tests android

$ npm run detox-android-build
$ npm run detox-android-test

Troubleshooting

If while runing your end to end tests on iOS you get this error #error Unsupported architecture make sure that the detox configuration uses the ONLY_ACTIVE_ARCH=YES flag as shown in the package.json file.

License

Distributed under the MIT License. See the file LICENSE.md.

semaphore-demo-react-native's People

Stargazers

Watchers

Forkers

aitechnolab mehmetboraezer higoramp ssengupta3 masterneuromancer shamex derekxxx markoa amarildolucas simonremotify doozie-akshay iksi aleksandar-mitrovic codebunny786 andreibarabas pilgrim2go aleksandarcole giangttd bpolge arsenije zsajjad davisuga sirfitz amandadyson chjkw wievtsal karthik-reddy-tom koliapp2019 asadrazaa1 thinhkhang97 hf-yevhen tylercwilliams arthwood simondelacourt rockinrone fifi98 martlaub cveoys cblair liatrio amirunpri2018 duwerq amuslija iamjon sfitzjava peeja kunoacc ezequielnubimetrics kubanac95 vitorrov chinvaejay petar313 leandrojo shahidql codynguyen soukaryag katharinepadilha pguerreiroic medvezhatina lukecapizano rrawla isabella232 myjaguar1982 jalada rikur obedrina dajulia3 oatmeal-apps aitnasser dozken jordyv3 hamir-suspect masoud-mahmoudi wjuniorw ilychevad themesias hnaga pandakunz jutenku muhdavi acapxasyrafx tushardubey121 hungnguyenckc rwyatt86 mka7 ravikirankiran097 ryan1000 jojitoon mvjdev hbprakharmishra magdamana001 virtechs madhu-mac sanscaar imtiazmehmood pedrohamarques privatedave

semaphore-demo-react-native's Issues

Running test on Android emulator fails

I’ve been having some issues trying to get the npm run detox-android-test-release command to run without errors. Initially I ran into the following error.

detox[4635] INFO:  [test.js] configuration="android.emu.release" useCustomLogger=true forceAdbInstall=false DETOX_START_TIMESTAMP=1600872586299 readOnlyEmu=false reportSpecs=true jest --config e2e/config.json --testNamePattern '^((?!:ios:).)*$' --maxWorkers 1 e2e
detox[4647] INFO:  [DetoxServer.js] server listening on localhost:38141...
detox[4647] ERROR: [exec.js/EXEC_FAIL, #1] ""/opt/android-sdk-linux/emulator/emulator" -version" failed with code = 127, stdout and stderr:

detox[4647] ERROR: [exec.js/EXEC_FAIL, #1] 
detox[4647] ERROR: [exec.js/EXEC_FAIL, #1] /opt/android-sdk-linux/emulator/qemu/linux-x86_64/qemu-system-x86_64: error while loading shared libraries: libpulse.so.0: cannot open shared object file: No such file or directory

Full error log

This error can be resolved by adding the following prologue command to the task:

apt-get install pulseaudio

After that running npm run detox-android-test-release results in the following error that I’ve not been able to solve:

detox[5084] INFO:  [test.js] configuration="android.emu.release" useCustomLogger=true forceAdbInstall=false DETOX_START_TIMESTAMP=1600871237068 readOnlyEmu=false reportSpecs=true jest --config e2e/config.json --testNamePattern '^((?!:ios:).)*$' --maxWorkers 1 e2e
detox[5096] INFO:  [DetoxServer.js] server listening on localhost:45275...
detox[5096] ERROR: [EmulatorLauncher.js/SPAWN_FAIL] `/opt/android-sdk-linux/emulator/emulator -verbose -no-audio -no-boot-anim -port 14720 @Pixel_API_28_AOSP` failed with code null
  err: ChildProcessError: `/opt/android-sdk-linux/emulator/emulator -verbose -no-audio -no-boot-anim -port 14720 @Pixel_API_28_AOSP` failed with code null
      at ChildProcess.<anonymous> (/root/redpanda/node_modules/child-process-promise/lib/index.js:132:23)
      at ChildProcess.emit (events.js:198:13)
      at maybeClose (internal/child_process.js:982:16)
      at Process.ChildProcess._handle.onexit (internal/child_process.js:259:5)
detox[5096] ERROR: [EmulatorLauncher.js/SPAWN_FAIL] Fatal: This application failed to start because no Qt platform plugin could be initialized. Reinstalling the application may fix this problem.

Available platform plugins are: xcb.
 ((null):0, (null))

Full error log

iOS tests Error: EMFILE: too many open files, watch

https://semaphore-demos.semaphoreci.com/workflows/fd9837ec-f501-419c-ba00-ea00056907ea

Problem running the React Native example

Hi @markoa, I'm opening an issue about having problems on running the app with npm run related to https://3.basecamp.com/3093216/buckets/11748920/todos/2723424581

Issue 1: The command npm run ios doesn't work for me either and I got a similar error. I needed to use the npx react-native run-ios as the React Official docs https://reactnative.dev/docs/environment-setup

Issue 2: The Android/iOS E2E tests are not passing because of the project configuration. For iOS, the command applesimutils --list --byType "iPhone 11 Pro" that is called inside $ npm run detox-ios-test can fall through an error for different causes:

Not having the right simulator installed as the same you have on package.json file. Changing the simulator name on this file or passing it as an argument on the npx react-native run-ios --simulator 'iPhone 11 Pro' command will work.
Not having installed the dependencies from https://github.com/wix/AppleSimulatorUtils until the use of any Detox e2E Test commands. After doing it, the test will pass.

I added also this Troubleshooting section on the article and make it short, but other errors can occur because the Semaphore project configuration can be different from the current user tools configuration, Android Studio virtual devices and Xcode Simulators.

### Troubleshooting

If you fall into some problem like this, make sure to:

1/ Run your iOS project directly in Xcode. Make sure to install all CocoaPods dependencies with `pod install` before doing this. I recommend you to search some of these repositories inside your Podfile and read their ReadMe to better be in the control of your projects. As an alternative, you can also run your iOS app with `npx react-native run-ios --simulator 'SIMULATOR_NAME'` on your console.

2/ Run your Android project in Android Studio. Check your Gradle dependencies. You can use a similar command `npx react-native run-android`. You will need to have Android Studio and Java Development Kit installed, otherwise your build will fail with the message `failed to install the app. Make sure you have the Android development environment set up`. So make sure you have the Android development environment set up.

Note: Check the Simulator names for both Android and iOS and make sure that you have them installed.

Note: In both cases the user needs to:

For iOS, enter the iOS folder in the project and run pod install to install the dependencies. Open the .xcworkspace and build the project.
Same for Android. Run Gradle dependencies and build the project to ensure that the configuration of the project is OK.

Anything that we run after these successful builds, even the npm commands that don't worked at the beginning will work now.

These are the commands that I ran to fix the errors successfully. I removed the outputs for better readability.

 2894  npm install OK
 2895  npm start OK
 2897  npm run lint OK
 2898  npm test OK
 2899  npm run detox-ios-build FAILED
 2900  npm run detox-ios-test FAILED
 2901  npx react-native run-ios FAILED
 2902  npx react-native run-ios --simulator 'iPhone 11 Pro' FAILED
 2904  cd ios
 2905  pod install OK
 2906  cd ..
 2908  npx react-native run-ios --simulator 'iPhone 11 Pro' PASSED (We should use the same Simulator)
 2909  npm run detox-ios-build PASSED
 2910  npm run detox-ios-test FAILED
 2911  applesimutils --list --byType "iPhone 11 Pro" FAILED, NOT INSTALLED
 2912  npx react-native run-android FAILED (following the Android Studio setup fix it) PASSED
 2913  npm run detox-android-build PASSED
 2914  npm run detox-android-test FAILED
 2915  npm run detox-ios-test FAILED
 2916  brew tap wix/brew
 2917  brew install applesimutils
 2918  npm run detox-ios-test PASSED

semaphoreci-demos / semaphore-demo-react-native Goto Github PK