Test with react@17 through a script updating dependencies

Author: AugustinLF

.circleci/config.yml

@@ -30,7 +30,6 @@ jobs:
           key: dependencies-{{ checksum "yarn.lock" }}
           paths:
             - ~/.cache/yarn
-      - run: yarn setup:react:17
       - persist_to_workspace:
           root: .
           paths:

package.json

@@ -83,8 +83,7 @@
     "build:ts:watch": "yarn build:ts --watch --preserveWatchOutput",
     "build": "yarn clean && yarn build:js && yarn build:ts && yarn copy-flowtypes",
     "prepare": "yarn build",
-    "setup:react:17": "del react-17-tests/src react-17-tests/jest-preset  && cp -R src jestSetup.js jest-preset babel.config.js react-17-tests/ && cd react-17-tests && yarn",
-    "test:react:17": "cd react-17-tests && yarn test"
+    "test:react:17": "scripts/test_react_17"
   },
   "jest": {
     "preset": "./jest-preset",
@@ -93,8 +92,7 @@
     ],
     "testPathIgnorePatterns": [
       "timerUtils",
-      "examples/",
-      "react-17-tests"
+      "examples/"
     ],
     "testTimeout": 60000,
     "transformIgnorePatterns": [

react-17-tests/.gitignore

@@ -0,0 +1,10 @@
+#!/bin/sh -e
+
+cp yarn.lock tmp.yarn.lock
+cp package.json tmp.package.json
+
+yarn add [email protected] [email protected] [email protected] --ignore-scripts
+yarn test
+
+mv tmp.package.json package.json
+mv tmp.yarn.lock yarn.lock

react-17-tests/package.json

@@ -205,7 +205,7 @@ test('debug changing component', () => {
 test('renders options.wrapper around node', () => {
   type WrapperComponentProps = { children: React.ReactNode };
   const WrapperComponent = ({ children }: WrapperComponentProps) => (
-    <SafeAreaView testID="wrapper">{children}</SafeAreaView>
+    <View testID="wrapper">{children}</View>
   );
 
   const { toJSON, getByTestId } = render(<View testID="inner" />, {
@@ -214,20 +214,20 @@ test('renders options.wrapper around node', () => {
 
   expect(getByTestId('wrapper')).toBeTruthy();
   expect(toJSON()).toMatchInlineSnapshot(`
-    <RCTSafeAreaView
+    <View
       testID="wrapper"
     >
       <View
         testID="inner"
       />
-    </RCTSafeAreaView>
+    </View>
   `);
 });
 
 test('renders options.wrapper around updated node', () => {
   type WrapperComponentProps = { children: React.ReactNode };
   const WrapperComponent = ({ children }: WrapperComponentProps) => (
-    <SafeAreaView testID="wrapper">{children}</SafeAreaView>
+    <View testID="wrapper">{children}</View>
   );
 
   const { toJSON, getByTestId, rerender } = render(<View testID="inner" />, {
@@ -240,15 +240,15 @@ test('renders options.wrapper around updated node', () => {
 
   expect(getByTestId('wrapper')).toBeTruthy();
   expect(toJSON()).toMatchInlineSnapshot(`
-    <RCTSafeAreaView
+    <View
       testID="wrapper"
     >
       <View
         accessibilityHint="test"
         accessibilityLabel="test"
         testID="inner"
       />
-    </RCTSafeAreaView>
+    </View>
   `);
 });