cipolleschi/Test Your Library against React Native 0.74.0-RCs.md

## Test Your Library against React Native 0.74.0-RCs.md

      
    Raw
  

              Test Your Library against React Native 0.74.0-RCs.md
            
          
    Test Your Library against React Native 0.74.0-rcs.

We cut the branch for 0.74 and we released the first RCs. We would like to check that the libraries in the ecosystem are working well, especially with the New Architecture.
To simplify the work, we prepared a sort of template you can use to test your library against the most recent version of React Native.
There are two ways to test this:

Using a newly created app;
Using the example app that might live in your library repo.

The first approach can be used to check whether the latest version you already released is compatible with the New Architecture.
The second approach is helpful to check whether the version of the library you have on main is compatible with the latest RC version of React Native.
1. Using a newly created app

To use a newly created app with the RC, follow these steps:
npx react-native@next init AppLibTest --skip-install --version next
cd AppLibTest 
yarn add <your-library>
cd ios
bundle install
RCT_NEW_ARCH_ENABLED=1 bundle exec pod install
open AppLibTest.xcworkspace
cd ../..
yarn start
This script does the following:

Creates a new app called AppLibTests
Installs your library in the app
Installs the iOS dependencies
Opens Xcode
Start Metro

Now, you can build and run the app from Xcode.
To build and run Android, you need to:

Update the gradle.properties file to turn on the New Architecture

# Use this property to enable support to the new architecture.
# This will allow you to use TurboModules and the Fabric render in
# your application. You should enable this flag either if you want
# to write custom TurboModules/Fabric components OR use libraries that
# are providing them.
- newArchEnabled=false
+ newArchEnabled=true

Open a new Terminal window, navigate to AppLibTest and run:

yarn android

Finally, modify the App.tsx to load the component or module exposed by your library and exercise some of their features to make sure they work properly.
This setup will test a New App running with the New Architecture and Bridgeless turned on.
2. Using the example app that might live in your library repo

To use the example app in your repo:

Clone your repository
Navigate to the Examplefolder, where the app's package.json lives
run yarn add react-native@next
cd ios
RCT_NEW_ARCH_ENABLED=1 bundle exec pod install

And then follow the same steps highlighted in the previous section.
Turn off the New Architecture

On top of ensuring that your library works with the New Architecture (either you migrated it or it is going through the interop layers we are providing), it is important to check that the library works in other two scenarios:

New Architecture, in Bridge mode
Old Architecture.

Disable Bridgeless in the New Architecture

Android

Open the MainApplication.kt file and update the following lines:
    if (BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {
      // If you opted-in for the New Architecture, we load the native entry point for this app.
-      load()
+      load(bridgelessEnabled = false)
    }
You can now rerun the app in Bridge mode.
iOS

Open the AppDelegate.mm file and add the following function:
-(BOOL)bridgelessEnabled
{
  return NO;
}
You can now rerun the app in Bridge mode.
Disable the New Architecture

Android

Open the gradle.properties file and updates these lines as it follows:
# Use this property to enable support to the new architecture.
# This will allow you to use TurboModules and the Fabric render in
# your application. You should enable this flag either if you want
# to write custom TurboModules/Fabric components OR use libraries that
# are providing them.
- newArchEnabled=true
+ newArchEnabled=false
You can now rerun the app with the Old Architecture.
iOS

Reinstall your dependencies with:
bundle exec pod install

Notice that the RCT_NEW_ARCH_ENABLED flag has gone.
You can now rerun the app with the Old Architecture
How to Report Issues

In case your library encounters some issue, please report that in the React Native repository using the New Architecture Template for new issues.
When filling the issue form, please make sure to include:

The library that you are testing
A minimal reproducer that we can use to debug the issue. You can use this repo to start your reproducer.

We are actively looking into those kinds of bugs.
The resolution could be:

A fix in React Native Core
The React Native team coming back to you, suggesting how to fix the issue. In some cases we might also open a PR against the repo directly, depending how big the issue is.

Thank you so much for your help and collaboration! 🙏 🙇