From 9b84a42ea32628252e8bcaf6ad7740da7d0d2864 Mon Sep 17 00:00:00 2001 From: Nick Gerleman Date: Thu, 1 Jul 2021 10:21:22 -0700 Subject: [PATCH 1/7] Integrate June 9 Nightly RN Build Commits: https://github.com/facebook/react-native/compare/0d32aef3a...386dbd943 Has ACoates fixes for RNTester theming, and testID in NewAppScreen header. Will manuallly validate that the new RNTester example in https://github.com/facebook/react-native/commit/7463f6d0fd105a2074db78b620b3895753b13cbf works as expected on UWP. It does not run on NetUI due to using instance-global dimension APIs. --- ...-94d1206b-0696-4766-99fd-b8d90c32d00b.json | 7 + ...-fb7c16bc-ad37-4a71-9663-69d510de4bba.json | 7 + ...-7e8b6ba8-85f2-464c-bcb9-008c3749a75f.json | 7 + .../react-native-win32-tester/overrides.json | 6 +- .../react-native-win32-tester/package.json | 4 +- .../components/RNTesterExampleFilter.win32.js | 6 +- .../src/js/utils/RNTesterList.win32.js | 10 +- .../react-native-win32/overrides.json | 6 +- .../react-native-win32/package.json | 4 +- .../react-native-win32/src/index.win32.js | 3 +- .../tester/overrides.json | 6 +- .../@react-native-windows/tester/package.json | 4 +- .../Pressable/PressableExample.windows.js | 21 ++ .../src/js/utils/RNTesterList.windows.js | 9 +- .../@react-native/repo-config/overrides.json | 4 +- .../@react-native/repo-config/package.json | 4 + .../js/assets/bottom-nav-center-box.png | Bin 1340 -> 0 bytes .../tester/js/components/ExamplePage.js | 6 +- .../tester/js/components/RNTesterBlock.js | 25 ++- .../js/components/RNTesterExampleFilter.js | 6 +- .../tester/js/components/RNTesterHeader.js | 2 +- .../tester/js/components/RNTesterNavbar.js | 8 +- .../js/examples/Animated/AnimatedExample.js | 41 ++-- .../AnimatedGratuitousApp/AnExApp.js | 0 .../AnimatedGratuitousApp/AnExBobble.js | 0 .../AnimatedGratuitousApp/AnExChained.js | 10 +- .../AnimatedGratuitousApp/AnExScroll.js | 0 .../AnimatedGratuitousApp/AnExSet.js | 0 .../AnimatedGratuitousApp/AnExSlides.md | 0 .../AnimatedGratuitousApp/AnExTilt.js | 2 +- .../js/examples/Pressable/PressableExample.js | 21 ++ .../examples/ScrollView/ScrollViewExample.js | 12 +- .../SwipeableCardExample.js | 207 ++++++++++++++++++ .../js/examples/Text/TextExample.android.js | 9 + .../js/examples/Text/TextExample.ios.js | 26 +-- .../tester/js/utils/RNTesterList.android.js | 9 +- .../tester/js/utils/RNTesterList.ios.js | 10 +- packages/@react-native/tester/overrides.json | 4 +- packages/e2e-test-app/package.json | 2 +- packages/integration-test-app/package.json | 2 +- packages/node-rnw-rpc/package.json | 2 +- packages/playground/package.json | 2 +- packages/sample-apps/package.json | 2 +- vnext/overrides.json | 6 +- vnext/package.json | 4 +- .../Components/Picker/Picker.windows.js | 12 +- vnext/src/index.windows.js | 3 +- yarn.lock | 32 +-- 48 files changed, 444 insertions(+), 129 deletions(-) create mode 100644 change/@office-iss-react-native-win32-94d1206b-0696-4766-99fd-b8d90c32d00b.json create mode 100644 change/node-rnw-rpc-fb7c16bc-ad37-4a71-9663-69d510de4bba.json create mode 100644 change/react-native-windows-7e8b6ba8-85f2-464c-bcb9-008c3749a75f.json delete mode 100644 packages/@react-native/tester/js/assets/bottom-nav-center-box.png rename packages/@react-native/tester/js/examples/{Animated => }/AnimatedGratuitousApp/AnExApp.js (100%) rename packages/@react-native/tester/js/examples/{Animated => }/AnimatedGratuitousApp/AnExBobble.js (100%) rename packages/@react-native/tester/js/examples/{Animated => }/AnimatedGratuitousApp/AnExChained.js (94%) rename packages/@react-native/tester/js/examples/{Animated => }/AnimatedGratuitousApp/AnExScroll.js (100%) rename packages/@react-native/tester/js/examples/{Animated => }/AnimatedGratuitousApp/AnExSet.js (100%) rename packages/@react-native/tester/js/examples/{Animated => }/AnimatedGratuitousApp/AnExSlides.md (100%) rename packages/@react-native/tester/js/examples/{Animated => }/AnimatedGratuitousApp/AnExTilt.js (98%) create mode 100644 packages/@react-native/tester/js/examples/SwipeableCardExample/SwipeableCardExample.js diff --git a/change/@office-iss-react-native-win32-94d1206b-0696-4766-99fd-b8d90c32d00b.json b/change/@office-iss-react-native-win32-94d1206b-0696-4766-99fd-b8d90c32d00b.json new file mode 100644 index 00000000000..613e1ca39ab --- /dev/null +++ b/change/@office-iss-react-native-win32-94d1206b-0696-4766-99fd-b8d90c32d00b.json @@ -0,0 +1,7 @@ +{ + "type": "prerelease", + "comment": "Integrate June 9 Nightly RN Build", + "packageName": "@office-iss/react-native-win32", + "email": "ngerlem@microsoft.com", + "dependentChangeType": "patch" +} diff --git a/change/node-rnw-rpc-fb7c16bc-ad37-4a71-9663-69d510de4bba.json b/change/node-rnw-rpc-fb7c16bc-ad37-4a71-9663-69d510de4bba.json new file mode 100644 index 00000000000..5d26f96a1c0 --- /dev/null +++ b/change/node-rnw-rpc-fb7c16bc-ad37-4a71-9663-69d510de4bba.json @@ -0,0 +1,7 @@ +{ + "type": "patch", + "comment": "Integrate June 9 Nightly RN Build", + "packageName": "node-rnw-rpc", + "email": "ngerlem@microsoft.com", + "dependentChangeType": "patch" +} diff --git a/change/react-native-windows-7e8b6ba8-85f2-464c-bcb9-008c3749a75f.json b/change/react-native-windows-7e8b6ba8-85f2-464c-bcb9-008c3749a75f.json new file mode 100644 index 00000000000..cc00dbf818a --- /dev/null +++ b/change/react-native-windows-7e8b6ba8-85f2-464c-bcb9-008c3749a75f.json @@ -0,0 +1,7 @@ +{ + "type": "prerelease", + "comment": "Integrate June 9 Nightly RN Build", + "packageName": "react-native-windows", + "email": "ngerlem@microsoft.com", + "dependentChangeType": "patch" +} diff --git a/packages/@office-iss/react-native-win32-tester/overrides.json b/packages/@office-iss/react-native-win32-tester/overrides.json index 92ac0507fe5..dc072b19f4a 100644 --- a/packages/@office-iss/react-native-win32-tester/overrides.json +++ b/packages/@office-iss/react-native-win32-tester/overrides.json @@ -5,7 +5,7 @@ "excludePatterns": [ "src/js/examples-win32/**" ], - "baseVersion": "0.0.0-0d32aef3a", + "baseVersion": "0.0.0-386dbd943", "overrides": [ { "type": "patch", @@ -24,7 +24,7 @@ "type": "patch", "file": "src/js/components/RNTesterExampleFilter.win32.js", "baseFile": "packages/rn-tester/js/components/RNTesterExampleFilter.js", - "baseHash": "e0c08f622a9d7d12e2115ec16698c8612572a8e1" + "baseHash": "c803794564e567e92c5df76d9d8af65863b7c39d" }, { "type": "copy", @@ -37,7 +37,7 @@ "type": "derived", "file": "src/js/utils/RNTesterList.win32.js", "baseFile": "packages/rn-tester/js/utils/RNTesterList.android.js", - "baseHash": "94f48ba9b8613e1e04177ea43f4f1d411bc3cd0b" + "baseHash": "dd52a34f77f0cbfe08cbd11610cd71edc1ecd96f" }, { "type": "patch", diff --git a/packages/@office-iss/react-native-win32-tester/package.json b/packages/@office-iss/react-native-win32-tester/package.json index 1348231205c..a665452f0d1 100644 --- a/packages/@office-iss/react-native-win32-tester/package.json +++ b/packages/@office-iss/react-native-win32-tester/package.json @@ -16,7 +16,7 @@ "peerDependencies": { "@office-iss/react-native-win32": "^0.0.0-canary.98", "react": "17.0.2", - "react-native": "0.0.0-0d32aef3a" + "react-native": "0.0.0-386dbd943" }, "devDependencies": { "@office-iss/react-native-win32": "^0.0.0-canary.98", @@ -26,7 +26,7 @@ "@types/node": "^14.14.22", "eslint": "7.12.0", "just-scripts": "^1.3.3", - "react-native": "0.0.0-0d32aef3a", + "react-native": "0.0.0-386dbd943", "react-native-platform-override": "^1.4.17", "typescript": "^3.8.3" } diff --git a/packages/@office-iss/react-native-win32-tester/src/js/components/RNTesterExampleFilter.win32.js b/packages/@office-iss/react-native-win32-tester/src/js/components/RNTesterExampleFilter.win32.js index 486b28ba601..d7a1761bb55 100644 --- a/packages/@office-iss/react-native-win32-tester/src/js/components/RNTesterExampleFilter.win32.js +++ b/packages/@office-iss/react-native-win32-tester/src/js/components/RNTesterExampleFilter.win32.js @@ -106,7 +106,11 @@ class RNTesterExampleFilter extends React.Component { {theme => { return ( - + = [ key: 'SectionListExample', category: 'ListView', module: require('../examples/SectionList/SectionListExample'), + }, + { + key: 'SwipeableCardExample', + category: 'UI', + module: require('../examples/SwipeableCardExample/SwipeableCardExample'), }*/, { key: 'SwitchExample', + category: 'UI', module: require('../examples/Switch/SwitchExample'), }, { @@ -161,12 +167,12 @@ const APIExamples: Array = [ { key: 'AnimatedExample', category: 'UI', - module: require('../examples/Animated/AnimatedExample'), + module: require('../examples/Animated/AnimatedExample').default, }, { key: 'Animation - GratuitousAnimation', category: 'UI', - module: require('../examples/Animated/AnimatedGratuitousApp/AnExApp'), + module: require('../examples/AnimatedGratuitousApp/AnExApp'), }, { key: 'AppearanceExample', diff --git a/packages/@office-iss/react-native-win32/overrides.json b/packages/@office-iss/react-native-win32/overrides.json index a577223cdf9..862976c1f4f 100644 --- a/packages/@office-iss/react-native-win32/overrides.json +++ b/packages/@office-iss/react-native-win32/overrides.json @@ -6,7 +6,7 @@ "excludePatterns": [ "**/__snapshots__/**" ], - "baseVersion": "0.0.0-0d32aef3a", + "baseVersion": "0.0.0-386dbd943", "overrides": [ { "type": "derived", @@ -18,7 +18,7 @@ "type": "derived", "file": "src/index.win32.js", "baseFile": "index.js", - "baseHash": "ef954129bcecf1cba9f786bd2a32327adfb735a5" + "baseHash": "c7e80678448dd6d518b6ed47594775207b285610" }, { "type": "patch", @@ -290,7 +290,7 @@ "baseFile": "Libraries/Inspector/InspectorOverlay.js", "baseHash": "b11d03daa2e3f828a350667f543b2cda4fa65dbf" }, - { + { "type": "copy", "file": "src/Libraries/Lists/__tests__/FillRateHelper-test.js", "baseFile": "Libraries/Lists/__tests__/FillRateHelper-test.js", diff --git a/packages/@office-iss/react-native-win32/package.json b/packages/@office-iss/react-native-win32/package.json index 62b3f1227ae..02d24d658c2 100644 --- a/packages/@office-iss/react-native-win32/package.json +++ b/packages/@office-iss/react-native-win32/package.json @@ -69,14 +69,14 @@ "just-scripts": "^1.3.3", "prettier": "1.19.1", "react": "17.0.2", - "react-native": "0.0.0-0d32aef3a", + "react-native": "0.0.0-386dbd943", "react-native-platform-override": "^1.4.17", "react-shallow-renderer": "16.14.1", "typescript": "^3.8.3" }, "peerDependencies": { "react": "17.0.2", - "react-native": "0.0.0-0d32aef3a" + "react-native": "0.0.0-386dbd943" }, "beachball": { "defaultNpmTag": "canary", diff --git a/packages/@office-iss/react-native-win32/src/index.win32.js b/packages/@office-iss/react-native-win32/src/index.win32.js index 317d654deed..41e7fe319f3 100644 --- a/packages/@office-iss/react-native-win32/src/index.win32.js +++ b/packages/@office-iss/react-native-win32/src/index.win32.js @@ -157,7 +157,8 @@ module.exports = { return require('./Libraries/Components/TextInput/InputAccessoryView'); }, get KeyboardAvoidingView(): KeyboardAvoidingView { - return require('./Libraries/Components/Keyboard/KeyboardAvoidingView'); + return require('./Libraries/Components/Keyboard/KeyboardAvoidingView') + .default; }, get MaskedViewIOS(): MaskedViewIOS { warnOnce( diff --git a/packages/@react-native-windows/tester/overrides.json b/packages/@react-native-windows/tester/overrides.json index f224a930185..bd5011743ea 100644 --- a/packages/@react-native-windows/tester/overrides.json +++ b/packages/@react-native-windows/tester/overrides.json @@ -5,7 +5,7 @@ "excludePatterns": [ "src/js/examples-win/**" ], - "baseVersion": "0.0.0-0d32aef3a", + "baseVersion": "0.0.0-386dbd943", "overrides": [ { "type": "patch", @@ -18,7 +18,7 @@ "type": "patch", "file": "src/js/examples/Pressable/PressableExample.windows.js", "baseFile": "packages/rn-tester/js/examples/Pressable/PressableExample.js", - "baseHash": "cc2fb739dffedec67c3c8032e8f87d4edfd0aede", + "baseHash": "57c01049a8acb59a8e90dbc29aad297fb1a4d887", "issue": 6240 }, { @@ -45,7 +45,7 @@ "type": "derived", "file": "src/js/utils/RNTesterList.windows.js", "baseFile": "packages/rn-tester/js/utils/RNTesterList.android.js", - "baseHash": "94f48ba9b8613e1e04177ea43f4f1d411bc3cd0b" + "baseHash": "dd52a34f77f0cbfe08cbd11610cd71edc1ecd96f" } ] } \ No newline at end of file diff --git a/packages/@react-native-windows/tester/package.json b/packages/@react-native-windows/tester/package.json index 8f0ec9dcde4..29ddde9e465 100644 --- a/packages/@react-native-windows/tester/package.json +++ b/packages/@react-native-windows/tester/package.json @@ -15,7 +15,7 @@ }, "peerDependencies": { "react": "17.0.2", - "react-native": "0.0.0-0d32aef3a", + "react-native": "0.0.0-386dbd943", "react-native-windows": "^0.0.0-canary.335" }, "devDependencies": { @@ -25,7 +25,7 @@ "@types/node": "^14.14.22", "eslint": "7.12.0", "just-scripts": "^1.3.3", - "react-native": "0.0.0-0d32aef3a", + "react-native": "0.0.0-386dbd943", "react-native-platform-override": "^1.4.17", "react-native-windows": "^0.0.0-canary.335", "typescript": "^3.8.3" diff --git a/packages/@react-native-windows/tester/src/js/examples/Pressable/PressableExample.windows.js b/packages/@react-native-windows/tester/src/js/examples/Pressable/PressableExample.windows.js index 5a5420dda86..0c39a09a901 100644 --- a/packages/@react-native-windows/tester/src/js/examples/Pressable/PressableExample.windows.js +++ b/packages/@react-native-windows/tester/src/js/examples/Pressable/PressableExample.windows.js @@ -11,6 +11,7 @@ import * as React from 'react'; import { Animated, + Image, Pressable, StyleSheet, Text, @@ -472,6 +473,10 @@ const styles = StyleSheet.create({ fontWeight: '500', color: 'blue', }, + image: { + height: 100, + width: 100, + }, }); exports.displayName = (undefined: ?string); @@ -587,6 +592,22 @@ exports.examples = [ + + + + + + use foreground + ); }, diff --git a/packages/@react-native-windows/tester/src/js/utils/RNTesterList.windows.js b/packages/@react-native-windows/tester/src/js/utils/RNTesterList.windows.js index e70a761ff37..0cc5056a54e 100644 --- a/packages/@react-native-windows/tester/src/js/utils/RNTesterList.windows.js +++ b/packages/@react-native-windows/tester/src/js/utils/RNTesterList.windows.js @@ -150,6 +150,11 @@ const ComponentExamples: Array = [ category: 'ListView', module: require('../examples/SectionList/SectionListExample'), }, + { + key: 'SwipeableCardExample', + category: 'UI', + module: require('../examples/SwipeableCardExample/SwipeableCardExample'), + }, { key: 'SwitchExample', category: 'UI', @@ -236,12 +241,12 @@ const APIExamples: Array = [ { key: 'AnimatedExample', category: 'UI', - module: require('../examples/Animated/AnimatedExample'), + module: require('../examples/Animated/AnimatedExample').default, }, { key: 'Animation - GratuitousAnimation', category: 'UI', - module: require('../examples/Animated/AnimatedGratuitousApp/AnExApp'), + module: require('../examples/AnimatedGratuitousApp/AnExApp'), }, { key: 'AppearanceExample', diff --git a/packages/@react-native/repo-config/overrides.json b/packages/@react-native/repo-config/overrides.json index 55d1ff5b9f2..ad9386a49c4 100644 --- a/packages/@react-native/repo-config/overrides.json +++ b/packages/@react-native/repo-config/overrides.json @@ -1,11 +1,11 @@ { - "baseVersion": "0.0.0-0d32aef3a", + "baseVersion": "0.0.0-386dbd943", "overrides": [ { "type": "copy", "file": "package.json", "baseFile": "repo-config/package.json", - "baseHash": "2f3490ab342cd4e7f637a3516589cf1fe2a3a734" + "baseHash": "822d8785377375b502d2a1d40128ec9281a38d40" } ] } \ No newline at end of file diff --git a/packages/@react-native/repo-config/package.json b/packages/@react-native/repo-config/package.json index 26dbd2a6e4e..ebd4e88d292 100644 --- a/packages/@react-native/repo-config/package.json +++ b/packages/@react-native/repo-config/package.json @@ -11,10 +11,13 @@ "dependencies": { "@babel/core": "^7.14.0", "@babel/generator": "^7.14.0", + "@babel/template": "^7.0.0", + "@babel/types": "^7.0.0", "@react-native-community/eslint-plugin": "*", "@reactions/component": "^2.0.2", "async": "^2.4.0", "babel-eslint": "^10.1.0", + "babel-preset-fbjs": "^3.4.0", "clang-format": "^1.2.4", "connect": "^3.6.5", "coveralls": "^3.0.2", @@ -37,6 +40,7 @@ "jest": "^26.6.3", "jest-junit": "^10.0.0", "jscodeshift": "^0.11.0", + "metro-transform-plugins": "^0.66.0", "mkdirp": "^0.5.1", "prettier": "1.19.1", "react": "17.0.2", diff --git a/packages/@react-native/tester/js/assets/bottom-nav-center-box.png b/packages/@react-native/tester/js/assets/bottom-nav-center-box.png deleted file mode 100644 index 31b0427bb776abcb4f82fc47f2fc1a64dc60280f..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1340 zcmeAS@N?(olHy`uVBq!ia0vp^CxAGGgAGU?ZmZ`8QY`6?zK#qG8~eHcB(ehe3dtTp zz6=aiY77hwEes65fIRt zPXT0ZVp4u-iLH_n$Rap^xU(cP4PjGWG1OZ?59)(t^bPe4^xe zz@D*b2M33ZqQeCBfuPvTY4}h0yuO{2T~Oh~ z0)w?hK;3uFU+HY-5J(A_5w>&wfsai*Rf%!=rehmtxVOrus3MUR-SR146Fu_WDDmSMZ=eR5QPk0ip^!(}nd7W&jQ`9{^X;1tfbNsWP z?3BQH3eRKNg?ZH+CLDYi^%m%vnDiGd2U$3bEMiv20$u!?XRg5v21mB`?5)61D4M%a zm`zyW#DjvhWk9d4GcGxlz_gfE@=I^K{Qjos$Ud=@3+8flF%#D6xO0Dcy!{lzM-~nt z`Gu_aJR20=FM0i@f{Ep4--q9vC69w&T-zIe;oEoat;OEk?Hcp${%)Q9M*jr&hAHoq z9VXPyy#0ffiKUWp+ND~cwdv31^8cE<_g#uenV91{o;9BrZr^-;ZqK1}N*)mj$KI+s kOo+R;t5r~8Wbi)lUs)@(^(wCn6R3>xboFyt=akR{0C)oefB*mh diff --git a/packages/@react-native/tester/js/components/ExamplePage.js b/packages/@react-native/tester/js/components/ExamplePage.js index b9f620a43f1..a655549b07d 100644 --- a/packages/@react-native/tester/js/components/ExamplePage.js +++ b/packages/@react-native/tester/js/components/ExamplePage.js @@ -10,6 +10,7 @@ import * as React from 'react'; import {StyleSheet, View, Text} from 'react-native'; +import {RNTesterThemeContext} from './RNTesterTheme'; type Props = $ReadOnly<{| children?: React.Node, @@ -22,9 +23,11 @@ type Props = $ReadOnly<{| export default function ExamplePage(props: Props): React.Node { const description = props.description ?? ''; + const theme = React.useContext(RNTesterThemeContext); return ( <> - + {props.title} {description} @@ -35,7 +38,6 @@ export default function ExamplePage(props: Props): React.Node { const styles = StyleSheet.create({ titleView: { - backgroundColor: '#F3F8FF', paddingHorizontal: 25, paddingTop: 4, paddingBottom: 8, diff --git a/packages/@react-native/tester/js/components/RNTesterBlock.js b/packages/@react-native/tester/js/components/RNTesterBlock.js index 486aa90f107..2c83209ac86 100644 --- a/packages/@react-native/tester/js/components/RNTesterBlock.js +++ b/packages/@react-native/tester/js/components/RNTesterBlock.js @@ -21,11 +21,23 @@ type Props = $ReadOnly<{| const RNTesterBlock = ({description, title, children}: Props): React.Node => { const theme = React.useContext(RNTesterThemeContext); return ( - + - {title} + + {title} + + style={[ + styles.descriptionText, + {color: theme.LabelColor, marginTop: description ? 10 : 0}, + ]}> {description} @@ -40,7 +52,6 @@ const styles = StyleSheet.create({ borderWidth: 1, marginTop: 30, marginHorizontal: 20, - backgroundColor: 'white', }, titleText: { fontSize: 18, @@ -53,12 +64,10 @@ const styles = StyleSheet.create({ descriptionText: { fontSize: 12, opacity: 0.5, - color: 'black', }, children: { - paddingTop: 10, - paddingHorizontal: 10, - margin: 10, + marginHorizontal: 20, + marginVertical: 10, }, }); diff --git a/packages/@react-native/tester/js/components/RNTesterExampleFilter.js b/packages/@react-native/tester/js/components/RNTesterExampleFilter.js index 2666580948b..a8d9f1b1c9d 100644 --- a/packages/@react-native/tester/js/components/RNTesterExampleFilter.js +++ b/packages/@react-native/tester/js/components/RNTesterExampleFilter.js @@ -106,7 +106,11 @@ class RNTesterExampleFilter extends React.Component { {theme => { return ( - + - + {title} {documentationURL && ( diff --git a/packages/@react-native/tester/js/components/RNTesterNavbar.js b/packages/@react-native/tester/js/components/RNTesterNavbar.js index 24d703c00e4..6fe8d2185d5 100644 --- a/packages/@react-native/tester/js/components/RNTesterNavbar.js +++ b/packages/@react-native/tester/js/components/RNTesterNavbar.js @@ -15,9 +15,11 @@ import {RNTesterThemeContext} from './RNTesterTheme'; const BookmarkTab = ({handleNavBarPress, isBookmarkActive, theme}) => ( - ); +export default ({ + framework: 'React', + title: 'Animated', + category: 'UI', + documentationURL: 'https://reactnative.dev/docs/animated', + description: + 'Library designed to make animations fluid, powerful, and painless to ' + + 'build and maintain.', + examples: [ + FadeInViewExample, + ComposeAnimationsWithEasingExample, + RotatingImagesExample, + MovingBoxExample, + TransformBounceExample, + LoopingExample, + ContinuousInteractionsExample, + ], +}: RNTesterExampleModule); diff --git a/packages/@react-native/tester/js/examples/Animated/AnimatedGratuitousApp/AnExApp.js b/packages/@react-native/tester/js/examples/AnimatedGratuitousApp/AnExApp.js similarity index 100% rename from packages/@react-native/tester/js/examples/Animated/AnimatedGratuitousApp/AnExApp.js rename to packages/@react-native/tester/js/examples/AnimatedGratuitousApp/AnExApp.js diff --git a/packages/@react-native/tester/js/examples/Animated/AnimatedGratuitousApp/AnExBobble.js b/packages/@react-native/tester/js/examples/AnimatedGratuitousApp/AnExBobble.js similarity index 100% rename from packages/@react-native/tester/js/examples/Animated/AnimatedGratuitousApp/AnExBobble.js rename to packages/@react-native/tester/js/examples/AnimatedGratuitousApp/AnExBobble.js diff --git a/packages/@react-native/tester/js/examples/Animated/AnimatedGratuitousApp/AnExChained.js b/packages/@react-native/tester/js/examples/AnimatedGratuitousApp/AnExChained.js similarity index 94% rename from packages/@react-native/tester/js/examples/Animated/AnimatedGratuitousApp/AnExChained.js rename to packages/@react-native/tester/js/examples/AnimatedGratuitousApp/AnExChained.js index 4175fdf3684..cd411770047 100644 --- a/packages/@react-native/tester/js/examples/Animated/AnimatedGratuitousApp/AnExChained.js +++ b/packages/@react-native/tester/js/examples/AnimatedGratuitousApp/AnExChained.js @@ -110,11 +110,11 @@ const styles = StyleSheet.create({ }); const CHAIN_IMGS = [ - require('../../../assets/hawk.png'), - require('../../../assets/bunny.png'), - require('../../../assets/relay.png'), - require('../../../assets/hawk.png'), - require('../../../assets/bunny.png'), + require('../../assets/hawk.png'), + require('../../assets/bunny.png'), + require('../../assets/relay.png'), + require('../../assets/hawk.png'), + require('../../assets/bunny.png'), ]; module.exports = AnExChained; diff --git a/packages/@react-native/tester/js/examples/Animated/AnimatedGratuitousApp/AnExScroll.js b/packages/@react-native/tester/js/examples/AnimatedGratuitousApp/AnExScroll.js similarity index 100% rename from packages/@react-native/tester/js/examples/Animated/AnimatedGratuitousApp/AnExScroll.js rename to packages/@react-native/tester/js/examples/AnimatedGratuitousApp/AnExScroll.js diff --git a/packages/@react-native/tester/js/examples/Animated/AnimatedGratuitousApp/AnExSet.js b/packages/@react-native/tester/js/examples/AnimatedGratuitousApp/AnExSet.js similarity index 100% rename from packages/@react-native/tester/js/examples/Animated/AnimatedGratuitousApp/AnExSet.js rename to packages/@react-native/tester/js/examples/AnimatedGratuitousApp/AnExSet.js diff --git a/packages/@react-native/tester/js/examples/Animated/AnimatedGratuitousApp/AnExSlides.md b/packages/@react-native/tester/js/examples/AnimatedGratuitousApp/AnExSlides.md similarity index 100% rename from packages/@react-native/tester/js/examples/Animated/AnimatedGratuitousApp/AnExSlides.md rename to packages/@react-native/tester/js/examples/AnimatedGratuitousApp/AnExSlides.md diff --git a/packages/@react-native/tester/js/examples/Animated/AnimatedGratuitousApp/AnExTilt.js b/packages/@react-native/tester/js/examples/AnimatedGratuitousApp/AnExTilt.js similarity index 98% rename from packages/@react-native/tester/js/examples/Animated/AnimatedGratuitousApp/AnExTilt.js rename to packages/@react-native/tester/js/examples/AnimatedGratuitousApp/AnExTilt.js index ba8ca33efb9..ca193a94cb0 100644 --- a/packages/@react-native/tester/js/examples/Animated/AnimatedGratuitousApp/AnExTilt.js +++ b/packages/@react-native/tester/js/examples/AnimatedGratuitousApp/AnExTilt.js @@ -132,7 +132,7 @@ class AnExTilt extends React.Component { }, ], }} - source={require('../../../assets/trees.jpg')} + source={require('../../assets/trees.jpg')} /> ); diff --git a/packages/@react-native/tester/js/examples/Pressable/PressableExample.js b/packages/@react-native/tester/js/examples/Pressable/PressableExample.js index 3407d7afdcd..7b1bdf1fca5 100644 --- a/packages/@react-native/tester/js/examples/Pressable/PressableExample.js +++ b/packages/@react-native/tester/js/examples/Pressable/PressableExample.js @@ -11,6 +11,7 @@ import * as React from 'react'; import { Animated, + Image, Pressable, StyleSheet, Text, @@ -310,6 +311,10 @@ const styles = StyleSheet.create({ fontWeight: '500', color: 'blue', }, + image: { + height: 100, + width: 100, + }, }); exports.displayName = (undefined: ?string); @@ -425,6 +430,22 @@ exports.examples = [ + + + + + + use foreground + ); }, diff --git a/packages/@react-native/tester/js/examples/ScrollView/ScrollViewExample.js b/packages/@react-native/tester/js/examples/ScrollView/ScrollViewExample.js index 348ae82ea01..e031dbc0fca 100644 --- a/packages/@react-native/tester/js/examples/ScrollView/ScrollViewExample.js +++ b/packages/@react-native/tester/js/examples/ScrollView/ScrollViewExample.js @@ -567,8 +567,9 @@ const SnapToOptions = () => { { - if (value === 'start' || value === 'center' || value === 'end') + if (value === 'start' || value === 'center' || value === 'end') { setSnapToAlignment(value); + } }} itemStyle={styles.pickerItem}> {snapToAlignmentModes.map(label => { @@ -754,8 +755,9 @@ const OnScrollOptions = () => { { - if (value === 'always' || value === 'auto' || value === 'never') + if (value === 'always' || value === 'auto' || value === 'never') { setOverScrollMode(value); + } }} itemStyle={styles.pickerItem}> {overScrollModeOptions.map(label => { @@ -892,8 +894,9 @@ const KeyboardExample = () => { value === 'none' || value === 'on-drag' || value === 'interactive' - ) + ) { setKeyboardDismissMode(value); + } }} itemStyle={styles.pickerItem}> {dismissOptions.map(label => { @@ -904,8 +907,9 @@ const KeyboardExample = () => { { - if (value === 'never' || value === 'always' || value === 'handled') + if (value === 'never' || value === 'always' || value === 'handled') { setKeyboardShouldPersistTaps(value); + } }} itemStyle={styles.pickerItem}> {persistOptions.map(label => { diff --git a/packages/@react-native/tester/js/examples/SwipeableCardExample/SwipeableCardExample.js b/packages/@react-native/tester/js/examples/SwipeableCardExample/SwipeableCardExample.js new file mode 100644 index 00000000000..747ccb01e7a --- /dev/null +++ b/packages/@react-native/tester/js/examples/SwipeableCardExample/SwipeableCardExample.js @@ -0,0 +1,207 @@ +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow strict-local + * @format + */ + +import * as React from 'react'; +import { + Animated, + PanResponder, + View, + StyleSheet, + FlatList, + Text, + useWindowDimensions, +} from 'react-native'; + +module.exports = { + displayName: 'SwipeableCardExample', + framework: 'React', + title: 'SwipeableCard', + category: 'Basic', + description: + 'Example of a swipeable card with scrollable content to test PanResponder and JSResponderHandler interaction.', + examples: [ + { + title: 'SwipeableCardExample', + description: ('This example creates a swipeable card using PanResponder. ' + + 'Under the hood, JSResponderHandler should prevent scroll when the card is being swiped.': string), + render: function(): React.Node { + return ; + }, + }, + ], +}; + +function SwipeableCardExample() { + const cardColors = ['red', 'blue', 'pink', 'aquamarine']; + const [currentIndex, setCurrentIndex] = React.useState(0); + + const nextIndex = currentIndex + 1; + + const isFirstCardOnTop = currentIndex % 2 !== 0; + + const incrementCurrent = () => setCurrentIndex(currentIndex + 1); + + const getCardColor = index => cardColors[index % cardColors.length]; + + /* + * The cards try to reuse the views. Instead of always rebuilding the current card on top + * the order is configured by zIndex. This way, the native side reuses the same views for bottom + * and top after swiping out. + */ + return ( + <> + + + + ); +} + +function SwipeableCard(props: { + zIndex: number, + color: string, + onSwipedOut: () => void, +}) { + // eslint-disable-next-line react-hooks/exhaustive-deps + const movementX = React.useMemo(() => new Animated.Value(0), [props.color]); + + const panResponder = React.useMemo( + () => + PanResponder.create({ + onMoveShouldSetPanResponderCapture: (e, gestureState) => { + const {dx} = gestureState; + return Math.abs(dx) > 5; + }, + onPanResponderMove: Animated.event([null, {dx: movementX}], { + useNativeDriver: false, + }), + onPanResponderEnd: (e, gestureState) => { + const {dx} = gestureState; + if (Math.abs(dx) > 120) { + Animated.timing(movementX, { + toValue: dx > 0 ? 1000 : -1000, + useNativeDriver: true, + }).start(props.onSwipedOut); + } else { + Animated.timing(movementX, { + toValue: 0, + useNativeDriver: true, + }).start(); + } + }, + }), + [movementX, props.onSwipedOut], + ); + + const {width} = useWindowDimensions(); + const rotation = movementX.interpolate({ + inputRange: [-width / 2, 0, width / 2], + outputRange: (['-5deg', '0deg', '5deg']: $ReadOnlyArray), + extrapolate: 'clamp', + }); + + return ( + + + + + + ); +} + +const cardData = Array(5); + +function Card(props: {color: string}) { + const renderItem = ({item, index}) => ( + + ); + + const separatorComponent = () => ; + + const listRef = React.useRef>(); + + React.useEffect(() => { + listRef.current?.scrollToOffset({offset: 0, animated: false}); + }, [props.color]); + + return ( + + + + ); +} + +function CardSection(props: {index: number, color: string}) { + return ( + + Section #{props.index} + + ); +} + +const styles = StyleSheet.create({ + container: { + position: 'absolute', + height: '100%', + width: '100%', + padding: 10, + paddingTop: 30, + }, + card: { + flex: 1, + margin: 5, + backgroundColor: 'white', + borderWidth: 1, + borderColor: 'lightgray', + }, + separator: { + width: '100%', + height: 2, + backgroundColor: 'white', + }, + sectionBg: { + height: 200, + alignItems: 'center', + justifyContent: 'center', + }, + sectionText: { + color: 'white', + fontWeight: 'bold', + }, +}); diff --git a/packages/@react-native/tester/js/examples/Text/TextExample.android.js b/packages/@react-native/tester/js/examples/Text/TextExample.android.js index 219f5d29854..e8a09fb5209 100644 --- a/packages/@react-native/tester/js/examples/Text/TextExample.android.js +++ b/packages/@react-native/tester/js/examples/Text/TextExample.android.js @@ -388,6 +388,15 @@ class TextExample extends React.Component<{...}> { Move fast and be bold Move fast and be normal + FONT WEIGHT 900 + FONT WEIGHT 800 + FONT WEIGHT 700 + FONT WEIGHT 600 + FONT WEIGHT 500 + FONT WEIGHT 400 + FONT WEIGHT 300 + FONT WEIGHT 200 + FONT WEIGHT 100 Move fast and be italic diff --git a/packages/@react-native/tester/js/examples/Text/TextExample.ios.js b/packages/@react-native/tester/js/examples/Text/TextExample.ios.js index 1acdfd2e3aa..8c94f7bc70e 100644 --- a/packages/@react-native/tester/js/examples/Text/TextExample.ios.js +++ b/packages/@react-native/tester/js/examples/Text/TextExample.ios.js @@ -603,21 +603,17 @@ exports.examples = [ render: function(): React.Node { return ( - - Move fast and be ultralight - - - Move fast and be light - - - Move fast and be normal - - - Move fast and be bold - - - Move fast and be ultrabold - + Move fast and be bold + Move fast and be normal + FONT WEIGHT 900 + FONT WEIGHT 800 + FONT WEIGHT 700 + FONT WEIGHT 600 + FONT WEIGHT 500 + FONT WEIGHT 400 + FONT WEIGHT 300 + FONT WEIGHT 200 + FONT WEIGHT 100 ); }, diff --git a/packages/@react-native/tester/js/utils/RNTesterList.android.js b/packages/@react-native/tester/js/utils/RNTesterList.android.js index ae90cbd9558..dcaa6330a30 100644 --- a/packages/@react-native/tester/js/utils/RNTesterList.android.js +++ b/packages/@react-native/tester/js/utils/RNTesterList.android.js @@ -129,6 +129,11 @@ const ComponentExamples: Array = [ category: 'UI', module: require('../examples/StatusBar/StatusBarExample'), }, + { + key: 'SwipeableCardExample', + category: 'UI', + module: require('../examples/SwipeableCardExample/SwipeableCardExample'), + }, { key: 'SwitchExample', category: 'UI', @@ -175,12 +180,12 @@ const APIExamples: Array = [ { key: 'AnimatedExample', category: 'UI', - module: require('../examples/Animated/AnimatedExample'), + module: require('../examples/Animated/AnimatedExample').default, }, { key: 'Animation - GratuitousAnimation', category: 'UI', - module: require('../examples/Animated/AnimatedGratuitousApp/AnExApp'), + module: require('../examples/AnimatedGratuitousApp/AnExApp'), }, { key: 'AppearanceExample', diff --git a/packages/@react-native/tester/js/utils/RNTesterList.ios.js b/packages/@react-native/tester/js/utils/RNTesterList.ios.js index efbcca235a7..5eb3afea15b 100644 --- a/packages/@react-native/tester/js/utils/RNTesterList.ios.js +++ b/packages/@react-native/tester/js/utils/RNTesterList.ios.js @@ -154,6 +154,12 @@ const ComponentExamples: Array = [ module: require('../examples/StatusBar/StatusBarExample'), supportsTVOS: false, }, + { + key: 'SwipeableCardExample', + module: require('../examples/SwipeableCardExample/SwipeableCardExample'), + category: 'UI', + supportsTVOS: false, + }, { key: 'SwitchExample', module: require('../examples/Switch/SwitchExample'), @@ -216,12 +222,12 @@ const APIExamples: Array = [ }, { key: 'AnimatedExample', - module: require('../examples/Animated/AnimatedExample'), + module: require('../examples/Animated/AnimatedExample').default, supportsTVOS: true, }, { key: 'AnExApp', - module: require('../examples/Animated/AnimatedGratuitousApp/AnExApp'), + module: require('../examples/AnimatedGratuitousApp/AnExApp'), supportsTVOS: true, }, { diff --git a/packages/@react-native/tester/overrides.json b/packages/@react-native/tester/overrides.json index 9bfd57dda44..32fef998bb8 100644 --- a/packages/@react-native/tester/overrides.json +++ b/packages/@react-native/tester/overrides.json @@ -1,11 +1,11 @@ { - "baseVersion": "0.0.0-0d32aef3a", + "baseVersion": "0.0.0-386dbd943", "overrides": [ { "type": "copy", "directory": "js", "baseDirectory": "packages/rn-tester/js", - "baseHash": "302d418184bd1d0602839f339cb0e55cf72d13ad", + "baseHash": "706dff649b0aad95309f856b3a1aa78743a1a588", "issue": 4054 }, { diff --git a/packages/e2e-test-app/package.json b/packages/e2e-test-app/package.json index 8bdfb5c1b74..d4f620f9013 100644 --- a/packages/e2e-test-app/package.json +++ b/packages/e2e-test-app/package.json @@ -14,7 +14,7 @@ "@react-native-windows/tester": "0.0.1", "node-rnw-rpc": "^1.0.11-12", "react": "17.0.2", - "react-native": "0.0.0-0d32aef3a", + "react-native": "0.0.0-386dbd943", "react-native-windows": "^0.0.0-canary.335" }, "devDependencies": { diff --git a/packages/integration-test-app/package.json b/packages/integration-test-app/package.json index 285c53789f9..eec13a7b7a8 100644 --- a/packages/integration-test-app/package.json +++ b/packages/integration-test-app/package.json @@ -13,7 +13,7 @@ "chai": "^4.2.0", "node-rnw-rpc": "^1.0.11-12", "react": "17.0.2", - "react-native": "0.0.0-0d32aef3a", + "react-native": "0.0.0-386dbd943", "react-native-windows": "^0.0.0-canary.335" }, "devDependencies": { diff --git a/packages/node-rnw-rpc/package.json b/packages/node-rnw-rpc/package.json index 685f9ee6d7b..1e3fcde8e39 100644 --- a/packages/node-rnw-rpc/package.json +++ b/packages/node-rnw-rpc/package.json @@ -27,7 +27,7 @@ "just-scripts": "^1.3.2", "prettier": "1.19.1", "react": "17.0.2", - "react-native": "0.0.0-0d32aef3a", + "react-native": "0.0.0-386dbd943", "react-native-windows": "^0.0.0-canary.335", "typescript": "^3.8.3" }, diff --git a/packages/playground/package.json b/packages/playground/package.json index 3e00dba6a56..f7e146be812 100644 --- a/packages/playground/package.json +++ b/packages/playground/package.json @@ -12,7 +12,7 @@ "dependencies": { "@react-native-windows/tester": "0.0.1", "react": "17.0.2", - "react-native": "0.0.0-0d32aef3a", + "react-native": "0.0.0-386dbd943", "react-native-windows": "0.0.0-canary.335" }, "devDependencies": { diff --git a/packages/sample-apps/package.json b/packages/sample-apps/package.json index da3c52252e4..7adf51a3a66 100644 --- a/packages/sample-apps/package.json +++ b/packages/sample-apps/package.json @@ -12,7 +12,7 @@ }, "dependencies": { "react": "17.0.2", - "react-native": "0.0.0-0d32aef3a", + "react-native": "0.0.0-386dbd943", "react-native-windows": "0.0.0-canary.335" }, "devDependencies": { diff --git a/vnext/overrides.json b/vnext/overrides.json index 713467ae402..f35e3627052 100644 --- a/vnext/overrides.json +++ b/vnext/overrides.json @@ -8,7 +8,7 @@ "excludePatterns": [ "**/__snapshots__/**" ], - "baseVersion": "0.0.0-0d32aef3a", + "baseVersion": "0.0.0-386dbd943", "overrides": [ { "type": "derived", @@ -76,7 +76,7 @@ "type": "derived", "file": "src/index.windows.js", "baseFile": "index.js", - "baseHash": "ef954129bcecf1cba9f786bd2a32327adfb735a5" + "baseHash": "c7e80678448dd6d518b6ed47594775207b285610" }, { "type": "platform", @@ -198,7 +198,7 @@ "type": "patch", "file": "src/Libraries/Components/Picker/Picker.windows.js", "baseFile": "Libraries/Components/Picker/Picker.js", - "baseHash": "8dfd55bb237e9a96ed913e33dfbf407d90b408f8", + "baseHash": "900e5f4d60baba03691b5c8601e4d960f9cb34d9", "issue": 4611 }, { diff --git a/vnext/package.json b/vnext/package.json index 50a797b3e94..f41d4bfc972 100644 --- a/vnext/package.json +++ b/vnext/package.json @@ -71,7 +71,7 @@ "metro-config": "^0.66.0", "prettier": "1.19.1", "react": "17.0.2", - "react-native": "0.0.0-0d32aef3a", + "react-native": "0.0.0-386dbd943", "react-native-platform-override": "^1.4.17", "react-refresh": "^0.4.0", "react-shallow-renderer": "16.14.1", @@ -79,7 +79,7 @@ }, "peerDependencies": { "react": "17.0.2", - "react-native": "0.0.0-0d32aef3a" + "react-native": "0.0.0-386dbd943" }, "beachball": { "defaultNpmTag": "canary", diff --git a/vnext/src/Libraries/Components/Picker/Picker.windows.js b/vnext/src/Libraries/Components/Picker/Picker.windows.js index 188bf0222dc..1881548f929 100644 --- a/vnext/src/Libraries/Components/Picker/Picker.windows.js +++ b/vnext/src/Libraries/Components/Picker/Picker.windows.js @@ -168,24 +168,24 @@ class Picker extends React.Component { static Item: typeof PickerItem = PickerItem; - static defaultProps: {|mode: $TEMPORARY$string<'dialog'>|} = { - mode: MODE_DIALOG, - }; - render(): React.Node { + const {mode = MODE_DIALOG, children, ...rest} = this.props; + if (Platform.OS === 'ios') { /* $FlowFixMe[prop-missing] (>=0.81.0 site=react_native_ios_fb) This * suppression was added when renaming suppression sites. */ /* $FlowFixMe[incompatible-type] (>=0.81.0 site=react_native_ios_fb) This * suppression was added when renaming suppression sites. */ - return {this.props.children}; + return {children}; } else if (Platform.OS === 'android') { return ( /* $FlowFixMe[incompatible-type] (>=0.81.0 site=react_native_android_fb) This * suppression was added when renaming suppression sites. */ /* $FlowFixMe[prop-missing] (>=0.81.0 site=react_native_android_fb) This * suppression was added when renaming suppression sites. */ - {this.props.children} + + {children} + ); } else if (Platform.OS === 'windows') { return ( diff --git a/vnext/src/index.windows.js b/vnext/src/index.windows.js index 11066693584..a26e9cabab4 100644 --- a/vnext/src/index.windows.js +++ b/vnext/src/index.windows.js @@ -153,7 +153,8 @@ module.exports = { return require('./Libraries/Components/TextInput/InputAccessoryView'); }, get KeyboardAvoidingView(): KeyboardAvoidingView { - return require('./Libraries/Components/Keyboard/KeyboardAvoidingView'); + return require('./Libraries/Components/Keyboard/KeyboardAvoidingView') + .default; }, get MaskedViewIOS(): MaskedViewIOS { warnOnce( diff --git a/yarn.lock b/yarn.lock index 38f5688a7b0..7169e192651 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1469,11 +1469,6 @@ "@octokit/types" "^6.0.0" universal-user-agent "^6.0.0" -"@octokit/openapi-types@^7.3.5": - version "7.3.5" - resolved "https://registry.yarnpkg.com/@octokit/openapi-types/-/openapi-types-7.3.5.tgz#ffd195472f345b32fb29ba3c86a1ee68c09f24b3" - integrity sha512-6bm5lzGDOeSnWHM5W8OZ86RD2KpchynU+/Qlm5hNEFjfLDhwfAY2lSe68YRUEYFGlxSHe0HmakyhvmtWoD3Zog== - "@octokit/openapi-types@^8.1.4": version "8.1.4" resolved "https://registry.yarnpkg.com/@octokit/openapi-types/-/openapi-types-8.1.4.tgz#20684667b50176b5d24cdb89799a8a12d38c3775" @@ -1530,14 +1525,7 @@ "@octokit/plugin-request-log" "^1.0.2" "@octokit/plugin-rest-endpoint-methods" "5.3.7" -"@octokit/types@^6.0.0", "@octokit/types@^6.0.1", "@octokit/types@^6.0.3", "@octokit/types@^6.16.1": - version "6.16.7" - resolved "https://registry.yarnpkg.com/@octokit/types/-/types-6.16.7.tgz#f27e87daf7ed87bde3e67b2e71956468fa4d02a7" - integrity sha512-OuQELiwIKeDySgNID52vm33wDRc2aaX8lKYgAw9Hmw939ITow1HspT8/AH3M3jgGFUMDmHlMNBNEmH7xV7ggXQ== - dependencies: - "@octokit/openapi-types" "^7.3.5" - -"@octokit/types@^6.17.4": +"@octokit/types@^6.0.0", "@octokit/types@^6.0.1", "@octokit/types@^6.0.3", "@octokit/types@^6.16.1", "@octokit/types@^6.17.4": version "6.17.4" resolved "https://registry.yarnpkg.com/@octokit/types/-/types-6.17.4.tgz#5ec011bfe3d08b7605c7d92a15796c470ee541b6" integrity sha512-Ghk/JC4zC/1al1GwH6p8jVX6pLdypSWmbnx6h79C/yo3DeaDd6MsNsBFlHu22KbkFh+CdcAzFqdP7UdPaPPmmA== @@ -3074,10 +3062,10 @@ babel-preset-current-node-syntax@^1.0.0: "@babel/plugin-syntax-optional-chaining" "^7.8.3" "@babel/plugin-syntax-top-level-await" "^7.8.3" -babel-preset-fbjs@^3.3.0: - version "3.3.0" - resolved "https://registry.yarnpkg.com/babel-preset-fbjs/-/babel-preset-fbjs-3.3.0.tgz#a6024764ea86c8e06a22d794ca8b69534d263541" - integrity sha512-7QTLTCd2gwB2qGoi5epSULMHugSVgpcVt5YAeiFO9ABLrutDQzKfGwzxgZHLpugq8qMdg/DhRZDZ5CLKxBkEbw== +babel-preset-fbjs@^3.3.0, babel-preset-fbjs@^3.4.0: + version "3.4.0" + resolved "https://registry.yarnpkg.com/babel-preset-fbjs/-/babel-preset-fbjs-3.4.0.tgz#38a14e5a7a3b285a3f3a86552d650dca5cf6111c" + integrity sha512-9ywCsCvo1ojrw0b+XYk7aFvTH6D9064t0RIL1rtMf3nsa02Xw41MS7sZw216Im35xj/UY0PDBQsa1brUDDF1Ow== dependencies: "@babel/plugin-proposal-class-properties" "^7.0.0" "@babel/plugin-proposal-object-rest-spread" "^7.0.0" @@ -7949,7 +7937,7 @@ metro-symbolicate@0.66.0: through2 "^2.0.1" vlq "^1.0.0" -metro-transform-plugins@0.66.0: +metro-transform-plugins@0.66.0, metro-transform-plugins@^0.66.0: version "0.66.0" resolved "https://registry.yarnpkg.com/metro-transform-plugins/-/metro-transform-plugins-0.66.0.tgz#d40cb1a88110b0033b5a870c497ce56a38ec5b1f" integrity sha512-0jF27jozp4IYuzliM2R7NaXqbPXleiHQWVczECkHg3UjDroCKneCkkgeSeirVZ1TkBqu7KSLMiWdL2OOT+vVxQ== @@ -9307,10 +9295,10 @@ react-native-tscodegen@0.66.1: nullthrows "1.1.1" typescript "^3.5.3" -react-native@0.0.0-0d32aef3a: - version "0.0.0-0d32aef3a" - resolved "https://registry.yarnpkg.com/react-native/-/react-native-0.0.0-0d32aef3a.tgz#1093622f8110012aa2e428a635a494663dec598c" - integrity sha512-CxA0FGYkbAx63KDx+v1xYkAQ4c7yZI2sPd34JIt2KjUWIQAEdyLgzG0gL9t8pvp5/iDkuqA6TCtd9RlngbdrEg== +react-native@0.0.0-386dbd943: + version "0.0.0-386dbd943" + resolved "https://registry.yarnpkg.com/react-native/-/react-native-0.0.0-386dbd943.tgz#f7aecfbe5b565e7fef3877e651e8547f25e1e436" + integrity sha512-ERyvd042zul3/NoXdpiOvTsFzS1Qu4SoYk3ieLmG6xZeUTmONRDWEq3Voki8okt9FaRdVyYNFeJjUEK1AdyfOw== dependencies: "@jest/create-cache-key-function" "^27.0.1" "@react-native-community/cli" "^6.0.0-rc.0" From 898c457c0f66f947c24b06a3d6b4a016e9184432 Mon Sep 17 00:00:00 2001 From: Nick Gerleman Date: Fri, 2 Jul 2021 11:01:42 -0700 Subject: [PATCH 2/7] Update snapshots --- .../TextComponentTest.test.ts.snap | 84 +++++++++---------- 1 file changed, 42 insertions(+), 42 deletions(-) diff --git a/packages/e2e-test-app/test/__snapshots__/TextComponentTest.test.ts.snap b/packages/e2e-test-app/test/__snapshots__/TextComponentTest.test.ts.snap index c690ad06ff2..d9bf4a09560 100644 --- a/packages/e2e-test-app/test/__snapshots__/TextComponentTest.test.ts.snap +++ b/packages/e2e-test-app/test/__snapshots__/TextComponentTest.test.ts.snap @@ -11,9 +11,9 @@ Object { "FlowDirection": "LeftToRight", "Height": 95, "HorizontalAlignment": "Stretch", - "Left": 10, + "Left": 0, "Margin": "0,0,0,0", - "Top": 10, + "Top": 0, "VerticalAlignment": "Stretch", "Visibility": "Visible", "Width": 718, @@ -114,9 +114,9 @@ Object { "FlowDirection": "LeftToRight", "Height": 247, "HorizontalAlignment": "Stretch", - "Left": 10, + "Left": 0, "Margin": "0,0,0,0", - "Top": 10, + "Top": 0, "VerticalAlignment": "Stretch", "Visibility": "Visible", "Width": 718, @@ -728,9 +728,9 @@ Object { "FlowDirection": "LeftToRight", "Height": 395, "HorizontalAlignment": "Stretch", - "Left": 10, + "Left": 0, "Margin": "0,0,0,0", - "Top": 10, + "Top": 0, "VerticalAlignment": "Stretch", "Visibility": "Visible", "Width": 718, @@ -868,11 +868,11 @@ Object { "Foreground": "#FFFF0000", "Height": 19, "HorizontalAlignment": "Stretch", - "Left": 10, + "Left": 0, "Margin": "0,0,0,0", "Padding": "0,0,0,0", "Text": "Red color", - "Top": 10, + "Top": 0, "VerticalAlignment": "Stretch", "Visibility": "Visible", "Width": 718, @@ -888,11 +888,11 @@ Object { "Foreground": "#E4000000", "Height": 38, "HorizontalAlignment": "Stretch", - "Left": 10, + "Left": 0, "Margin": "0,0,0,0", "Padding": "0,0,0,0", "Text": "(Normal text,(R)red(G)green(B)blue(C)cyan(M)magenta(Y)yellow(K)black(and bold(and tiny bold italic blue(and tiny normal blue))))", - "Top": 10, + "Top": 0, "VerticalAlignment": "Stretch", "Visibility": "Visible", "Width": 718, @@ -908,11 +908,11 @@ Object { "Foreground": "#E4000000", "Height": 19, "HorizontalAlignment": "Stretch", - "Left": 10, + "Left": 0, "Margin": "0,0,0,0", "Padding": "0,0,0,0", "Text": "Solid line-through", - "Top": 48, + "Top": 38, "VerticalAlignment": "Stretch", "Visibility": "Visible", "Width": 718, @@ -928,11 +928,11 @@ Object { "Foreground": "#E4000000", "Height": 19, "HorizontalAlignment": "Stretch", - "Left": 10, + "Left": 0, "Margin": "0,0,0,0", "Padding": "0,0,0,0", "Text": "Solid underline", - "Top": 10, + "Top": 0, "VerticalAlignment": "Stretch", "Visibility": "Visible", "Width": 718, @@ -951,9 +951,9 @@ Object { "FlowDirection": "LeftToRight", "Height": 212, "HorizontalAlignment": "Stretch", - "Left": 10, + "Left": 0, "Margin": "0,0,0,0", - "Top": 10, + "Top": 0, "VerticalAlignment": "Stretch", "Visibility": "Visible", "Width": 718, @@ -1099,11 +1099,11 @@ Object { "Foreground": "#E4000000", "Height": 17, "HorizontalAlignment": "Stretch", - "Left": 10, + "Left": 0, "Margin": "0,0,0,0", "Padding": "0,0,0,0", "Text": "Sans-Serif Bold", - "Top": 27, + "Top": 17, "VerticalAlignment": "Stretch", "Visibility": "Visible", "Width": 718, @@ -1122,9 +1122,9 @@ Object { "FlowDirection": "LeftToRight", "Height": 163, "HorizontalAlignment": "Stretch", - "Left": 10, + "Left": 0, "Margin": "0,0,0,0", - "Top": 10, + "Top": 0, "VerticalAlignment": "Stretch", "Visibility": "Visible", "Width": 718, @@ -1244,11 +1244,11 @@ Object { "Foreground": "#E4000000", "Height": 19, "HorizontalAlignment": "Stretch", - "Left": 10, + "Left": 0, "Margin": "0,0,0,0", "Padding": "0,0,0,0", "Text": "Maximum of one line no matter now much I write here. If I keep writing it'll just truncate after one line. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus felis eget augue condimentum suscipit. Suspendisse hendrerit, libero aliquet malesuada tempor, urna nibh consectetur tellus, vitae efficitur quam erat non mi. Maecenas vitae eros sit amet quam vestibulum porta sed sit amet tellus. Fusce quis lectus congue, fringilla arcu id, luctus urna. Cras sagittis ornare mauris sit amet dictum. Vestibulum feugiat laoreet fringilla. Vivamus ac diam vehicula felis venenatis sagittis vitae ultrices elit. Curabitur libero augue, laoreet quis orci vitae, congue euismod massa. Aenean nec odio sed urna vehicula fermentum non a magna. Quisque ut commodo neque, eget eleifend odio. Sed sit amet lacinia sem. Suspendisse in metus in purus scelerisque vestibulum. Nam metus dui, efficitur nec metus non, tincidunt pharetra sapien. Praesent id convallis metus, ut malesuada arcu. Quisque quam libero, pharetra eu tellus ac, aliquam fringilla erat. Quisque tempus in lorem ac suscipit.", - "Top": 29, + "Top": 19, "VerticalAlignment": "Stretch", "Visibility": "Visible", "Width": 718, @@ -1264,11 +1264,11 @@ Object { "Foreground": "#E4000000", "Height": 19, "HorizontalAlignment": "Stretch", - "Left": 10, + "Left": 0, "Margin": "0,0,0,0", "Padding": "0,0,0,0", "Text": "This text is selectable if you click-and-hold, and will offer the native Android selection menus.", - "Top": 10, + "Top": 0, "VerticalAlignment": "Stretch", "Visibility": "Visible", "Width": 718, @@ -1287,9 +1287,9 @@ Object { "FlowDirection": "LeftToRight", "Height": 136, "HorizontalAlignment": "Stretch", - "Left": 10, + "Left": 0, "Margin": "0,0,0,0", - "Top": 10, + "Top": 0, "VerticalAlignment": "Stretch", "Visibility": "Visible", "Width": 718, @@ -1425,9 +1425,9 @@ Object { "FlowDirection": "LeftToRight", "Height": 100, "HorizontalAlignment": "Stretch", - "Left": 10, + "Left": 0, "Margin": "0,0,0,0", - "Top": 10, + "Top": 0, "VerticalAlignment": "Stretch", "Visibility": "Visible", "Width": 718, @@ -1477,11 +1477,11 @@ Object { "Foreground": "#E4000000", "Height": 39, "HorizontalAlignment": "Stretch", - "Left": 10, + "Left": 0, "Margin": "0,0,0,0", "Padding": "10,10,10,10", "Text": "This text is indented by 10px padding on all sides.", - "Top": 10, + "Top": 0, "VerticalAlignment": "Stretch", "Visibility": "Visible", "Width": 718, @@ -1497,11 +1497,11 @@ Object { "Foreground": "#E4000000", "Height": 19, "HorizontalAlignment": "Stretch", - "Left": 10, + "Left": 0, "Margin": "0,0,0,0", "Padding": "0,0,0,0", "Text": "This text will have a orange highlight on selection.", - "Top": 10, + "Top": 0, "VerticalAlignment": "Stretch", "Visibility": "Visible", "Width": 718, @@ -1517,11 +1517,11 @@ Object { "Foreground": "#E4000000", "Height": 27, "HorizontalAlignment": "Stretch", - "Left": 10, + "Left": 0, "Margin": "0,0,0,0", "Padding": "0,0,0,0", "Text": "Demo text shadow", - "Top": 10, + "Top": 0, "VerticalAlignment": "Stretch", "Visibility": "Visible", "Width": 718, @@ -1537,11 +1537,11 @@ Object { "Foreground": "#E4000000", "Height": 31, "HorizontalAlignment": "Stretch", - "Left": 10, + "Left": 0, "Margin": "0,0,0,0", "Padding": "0,0,0,0", "Text": "Size 23", - "Top": 10, + "Top": 0, "VerticalAlignment": "Stretch", "Visibility": "Visible", "Width": 718, @@ -1560,9 +1560,9 @@ Object { "FlowDirection": "LeftToRight", "Height": 209, "HorizontalAlignment": "Stretch", - "Left": 10, + "Left": 0, "Margin": "0,0,0,0", - "Top": 10, + "Top": 0, "VerticalAlignment": "Stretch", "Visibility": "Visible", "Width": 718, @@ -1818,9 +1818,9 @@ Object { "FlowDirection": "LeftToRight", "Height": 95, "HorizontalAlignment": "Stretch", - "Left": 10, + "Left": 0, "Margin": "0,0,0,0", - "Top": 10, + "Top": 0, "VerticalAlignment": "Stretch", "Visibility": "Visible", "Width": 718, @@ -1978,11 +1978,11 @@ Object { "Foreground": "#E4000000", "Height": 187, "HorizontalAlignment": "Stretch", - "Left": 10, + "Left": 0, "Margin": "0,0,0,0", "Padding": "0,0,0,0", "Text": "The text should wrap if it goes on multiple lines. See, this is going to the next line. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus felis eget augue condimentum suscipit. Suspendisse hendrerit, libero aliquet malesuada tempor, urna nibh consectetur tellus, vitae efficitur quam erat non mi. Maecenas vitae eros sit amet quam vestibulum porta sed sit amet tellus. Fusce quis lectus congue, fringilla arcu id, luctus urna. Cras sagittis ornare mauris sit amet dictum. Vestibulum feugiat laoreet fringilla. Vivamus ac diam vehicula felis venenatis sagittis vitae ultrices elit. Curabitur libero augue, laoreet quis orci vitae, congue euismod massa. Aenean nec odio sed urna vehicula fermentum non a magna. Quisque ut commodo neque, eget eleifend odio. Sed sit amet lacinia sem. Suspendisse in metus in purus scelerisque vestibulum. Nam metus dui, efficitur nec metus non, tincidunt pharetra sapien. Praesent id convallis metus, ut malesuada arcu. Quisque quam libero, pharetra eu tellus ac, aliquam fringilla erat. Quisque tempus in lorem ac suscipit.", - "Top": 10, + "Top": 0, "VerticalAlignment": "Stretch", "Visibility": "Visible", "Width": 718, From 4063a6d86c093fd6a1bba34fd662607870f0a68d Mon Sep 17 00:00:00 2001 From: Nick Gerleman Date: Fri, 2 Jul 2021 11:15:38 -0700 Subject: [PATCH 3/7] Fork UIManagerBinding --- .../renderer/uimanager/UIManagerBinding.h | 121 ++++++++++++++++++ vnext/overrides.json | 7 + 2 files changed, 128 insertions(+) create mode 100644 vnext/ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/uimanager/UIManagerBinding.h diff --git a/vnext/ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/uimanager/UIManagerBinding.h b/vnext/ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/uimanager/UIManagerBinding.h new file mode 100644 index 00000000000..3b3671612bd --- /dev/null +++ b/vnext/ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/uimanager/UIManagerBinding.h @@ -0,0 +1,121 @@ +/* + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ + +#pragma once + +#include +#include +#include +#include +#include +#include + +namespace facebook::react { + +/* + * Exposes UIManager to JavaScript realm. + */ +class UIManagerBinding : public jsi::HostObject { + public: + /* + * Installs UIManagerBinding into JavaScript runtime if needed. + * Creates and sets `UIManagerBinding` into the global namespace. + * In case if the global namespace already has a `UIManagerBinding` installed, + * returns that. + * Thread synchronization must be enforced externally. + */ + static std::shared_ptr createAndInstallIfNeeded( + jsi::Runtime &runtime, + RuntimeExecutor const &runtimeExecutor); + + /* + * Returns a pointer to UIManagerBinding previously installed into a runtime. + * Thread synchronization must be enforced externally. + */ + static std::shared_ptr getBinding(jsi::Runtime &runtime); + + UIManagerBinding(RuntimeExecutor const &runtimeExecutor); + + ~UIManagerBinding(); + + /* + * Establish a relationship between `UIManager` and `UIManagerBinding` by + * setting internal pointers to each other. + * Must be called on JavaScript thread or during VM destruction. + */ + void attach(std::shared_ptr const &uiManager); + + void setEnableAsyncMeasure(bool enable); + + /* + * Starts React Native Surface with given id, moduleName, and props. + * Thread synchronization must be enforced externally. + */ + void startSurface( + jsi::Runtime &runtime, + SurfaceId surfaceId, + std::string const &moduleName, + folly::dynamic const &initalProps, + DisplayMode displayMode) const; + + /* + * Updates the React Native Surface identified with surfaceId and moduleName + * with the given props. + * Thread synchronization must be enforced externally. + */ + void setSurfaceProps( + jsi::Runtime &runtime, + SurfaceId surfaceId, + std::string const &moduleName, + folly::dynamic const &props, + DisplayMode displayMode) const; + + /* + * Stops React Native Surface with given id. + * Thread synchronization must be enforced externally. + */ + void stopSurface(jsi::Runtime &runtime, SurfaceId surfaceId) const; + + /* + * Delivers raw event data to JavaScript. + * Thread synchronization must be enforced externally. + */ + void dispatchEvent( + jsi::Runtime &runtime, + EventTarget const *eventTarget, + std::string const &type, + ReactEventPriority priority, + ValueFactory const &payloadFactory) const; + + /* + * Invalidates the binding and underlying UIManager. + * Allows to save some resources and prevents UIManager's delegate to be + * called. + * Calling public methods of this class after calling this method is UB. + * Can be called on any thread. + */ + void invalidate() const; + + /* + * `jsi::HostObject` specific overloads. + */ + jsi::Value get(jsi::Runtime &runtime, jsi::PropNameID const &name) override; + + private: + void executeMeasure( + jsi::Runtime &runtime, + std::function &&callback) const noexcept; + + std::shared_ptr uiManager_; + std::unique_ptr eventHandler_; + mutable ReactEventPriority currentEventPriority_; + + bool enableAsyncMeasure_; + RuntimeExecutor runtimeExecutor_; +}; + +} // namespace facebook::react diff --git a/vnext/overrides.json b/vnext/overrides.json index f35e3627052..08a476b74be 100644 --- a/vnext/overrides.json +++ b/vnext/overrides.json @@ -37,6 +37,13 @@ "baseHash": "6951c3418c9aed3ab5f0378a168289968c02aef0", "issue": 7821 }, + { + "type": "patch", + "file": "ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/uimanager/UIManagerBinding.h", + "baseFile": "ReactCommon/react/renderer/uimanager/UIManagerBinding.h", + "baseHash": "db707f2820a60006ef33c93fa8655baa5f99e975", + "issue": 1 + }, { "type": "patch", "file": "ReactCommon/Yoga.cpp", From c6c980b21d553384298e1847888a7f3bba889618 Mon Sep 17 00:00:00 2001 From: Nick Gerleman Date: Fri, 2 Jul 2021 11:34:15 -0700 Subject: [PATCH 4/7] Fix fabric build --- vnext/Microsoft.ReactNative/Microsoft.ReactNative.vcxproj | 1 - 1 file changed, 1 deletion(-) diff --git a/vnext/Microsoft.ReactNative/Microsoft.ReactNative.vcxproj b/vnext/Microsoft.ReactNative/Microsoft.ReactNative.vcxproj index b1aa5293de5..c90b7508a7e 100644 --- a/vnext/Microsoft.ReactNative/Microsoft.ReactNative.vcxproj +++ b/vnext/Microsoft.ReactNative/Microsoft.ReactNative.vcxproj @@ -445,7 +445,6 @@ - From e06d942369e7632ca13d639c5a251e043ac56c22 Mon Sep 17 00:00:00 2001 From: Nick Gerleman Date: Fri, 2 Jul 2021 11:53:10 -0700 Subject: [PATCH 5/7] Change files --- ...tualized-list-ce2199f9-40e8-458c-be23-41a42eede4dc.json | 7 +++++++ 1 file changed, 7 insertions(+) create mode 100644 change/@react-native-windows-virtualized-list-ce2199f9-40e8-458c-be23-41a42eede4dc.json diff --git a/change/@react-native-windows-virtualized-list-ce2199f9-40e8-458c-be23-41a42eede4dc.json b/change/@react-native-windows-virtualized-list-ce2199f9-40e8-458c-be23-41a42eede4dc.json new file mode 100644 index 00000000000..296593ae63a --- /dev/null +++ b/change/@react-native-windows-virtualized-list-ce2199f9-40e8-458c-be23-41a42eede4dc.json @@ -0,0 +1,7 @@ +{ + "type": "prerelease", + "comment": "Integrate June 9 Nightly RN Build", + "packageName": "@react-native-windows/virtualized-list", + "email": "ngerlem@microsoft.com", + "dependentChangeType": "patch" +} From df07f5d0eec9f7d87153d404813a5e5b23905bf0 Mon Sep 17 00:00:00 2001 From: Nick Gerleman Date: Thu, 15 Jul 2021 02:17:08 -0700 Subject: [PATCH 6/7] save lockfile --- package.json | 1 - yarn.lock | 35 ++++++++++++++++++++++++++++++++++- 2 files changed, 34 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index cd72b1fdeb8..e4928962b22 100644 --- a/package.json +++ b/package.json @@ -37,7 +37,6 @@ "lage": "^0.29.3" }, "resolutions": { - "babel-preset-fbjs": "3.3.0", "eslint-plugin-react-hooks": "4.0.7", "kind-of": "6.0.3", "glob-parent": "^5.1.2", diff --git a/yarn.lock b/yarn.lock index b3ddc24e2d2..7b94aa12909 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3062,7 +3062,7 @@ babel-preset-current-node-syntax@^1.0.0: "@babel/plugin-syntax-optional-chaining" "^7.8.3" "@babel/plugin-syntax-top-level-await" "^7.8.3" -babel-preset-fbjs@3.3.0, babel-preset-fbjs@^3.3.0, babel-preset-fbjs@^3.4.0: +babel-preset-fbjs@^3.3.0: version "3.3.0" resolved "https://registry.yarnpkg.com/babel-preset-fbjs/-/babel-preset-fbjs-3.3.0.tgz#a6024764ea86c8e06a22d794ca8b69534d263541" integrity sha512-7QTLTCd2gwB2qGoi5epSULMHugSVgpcVt5YAeiFO9ABLrutDQzKfGwzxgZHLpugq8qMdg/DhRZDZ5CLKxBkEbw== @@ -3095,6 +3095,39 @@ babel-preset-fbjs@3.3.0, babel-preset-fbjs@^3.3.0, babel-preset-fbjs@^3.4.0: "@babel/plugin-transform-template-literals" "^7.0.0" babel-plugin-syntax-trailing-function-commas "^7.0.0-beta.0" +babel-preset-fbjs@^3.4.0: + version "3.4.0" + resolved "https://registry.yarnpkg.com/babel-preset-fbjs/-/babel-preset-fbjs-3.4.0.tgz#38a14e5a7a3b285a3f3a86552d650dca5cf6111c" + integrity sha512-9ywCsCvo1ojrw0b+XYk7aFvTH6D9064t0RIL1rtMf3nsa02Xw41MS7sZw216Im35xj/UY0PDBQsa1brUDDF1Ow== + dependencies: + "@babel/plugin-proposal-class-properties" "^7.0.0" + "@babel/plugin-proposal-object-rest-spread" "^7.0.0" + "@babel/plugin-syntax-class-properties" "^7.0.0" + "@babel/plugin-syntax-flow" "^7.0.0" + "@babel/plugin-syntax-jsx" "^7.0.0" + "@babel/plugin-syntax-object-rest-spread" "^7.0.0" + "@babel/plugin-transform-arrow-functions" "^7.0.0" + "@babel/plugin-transform-block-scoped-functions" "^7.0.0" + "@babel/plugin-transform-block-scoping" "^7.0.0" + "@babel/plugin-transform-classes" "^7.0.0" + "@babel/plugin-transform-computed-properties" "^7.0.0" + "@babel/plugin-transform-destructuring" "^7.0.0" + "@babel/plugin-transform-flow-strip-types" "^7.0.0" + "@babel/plugin-transform-for-of" "^7.0.0" + "@babel/plugin-transform-function-name" "^7.0.0" + "@babel/plugin-transform-literals" "^7.0.0" + "@babel/plugin-transform-member-expression-literals" "^7.0.0" + "@babel/plugin-transform-modules-commonjs" "^7.0.0" + "@babel/plugin-transform-object-super" "^7.0.0" + "@babel/plugin-transform-parameters" "^7.0.0" + "@babel/plugin-transform-property-literals" "^7.0.0" + "@babel/plugin-transform-react-display-name" "^7.0.0" + "@babel/plugin-transform-react-jsx" "^7.0.0" + "@babel/plugin-transform-shorthand-properties" "^7.0.0" + "@babel/plugin-transform-spread" "^7.0.0" + "@babel/plugin-transform-template-literals" "^7.0.0" + babel-plugin-syntax-trailing-function-commas "^7.0.0-beta.0" + babel-preset-jest@^26.6.2: version "26.6.2" resolved "https://registry.yarnpkg.com/babel-preset-jest/-/babel-preset-jest-26.6.2.tgz#747872b1171df032252426586881d62d31798fee" From f8d22df9ea1f3ef621ab36210be96683a125a464 Mon Sep 17 00:00:00 2001 From: Nick Gerleman Date: Thu, 15 Jul 2021 02:36:37 -0700 Subject: [PATCH 7/7] Workaround Babel transform bug --- packages/e2e-test-app/test/LegacyTextInputTest.test.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/e2e-test-app/test/LegacyTextInputTest.test.ts b/packages/e2e-test-app/test/LegacyTextInputTest.test.ts index bdfe824da2e..51e682294fa 100644 --- a/packages/e2e-test-app/test/LegacyTextInputTest.test.ts +++ b/packages/e2e-test-app/test/LegacyTextInputTest.test.ts @@ -78,10 +78,10 @@ describe('LegacyTextInputTest', () => { test('TextInput onChange before onSelectionChange', async () => { const textInput = await textInputField(); await textInput.setValue('a'); - await assertLogContainsInOrder( + await assertLogContainsInOrder([ 'onChange text: a', 'onSelectionChange range: 1,1', - ); + ]); }); }); @@ -111,7 +111,7 @@ async function assertLogContains(text: string) { ); } -async function assertLogContainsInOrder(...expectedLines: string[]) { +async function assertLogContainsInOrder(expectedLines: string[]) { const textLogComponent = await $('~textinput-log'); await browser.waitUntil(