Integrate 3/18 nightly RN build. (#7549)

* Integrate 3/18 nightly RN build. * Change files * run liter * Remove DatePicker example from e2e test list. * Add new FlatList pages to visitAll test. Co-authored-by: Igor Klemenski <igklemen@microsoft.com>
microsoft · Apr 9, 2021 · fd49630 · fd49630
1 parent a0e1e99
commit fd49630
Show file tree

Hide file tree

Showing 43 changed files with 843 additions and 416 deletions.
diff --git a/change/@office-iss-react-native-win32-0d8aceb9-f7cf-4bd3-99f1-61b1a0f90c40.json b/change/@office-iss-react-native-win32-0d8aceb9-f7cf-4bd3-99f1-61b1a0f90c40.json
@@ -0,0 +1,7 @@
+{
+  "type": "prerelease",
+  "comment": "Integrate 3/18 nightly RN build.",
+  "packageName": "@office-iss/react-native-win32",
+  "email": "igklemen@microsoft.com",
+  "dependentChangeType": "patch"
+}
diff --git a/change/node-rnw-rpc-a4a4b07a-a174-49e3-894c-02e54e03611e.json b/change/node-rnw-rpc-a4a4b07a-a174-49e3-894c-02e54e03611e.json
@@ -0,0 +1,7 @@
+{
+  "type": "prerelease",
+  "comment": "Integrate 3/18 nightly RN build.",
+  "packageName": "node-rnw-rpc",
+  "email": "igklemen@microsoft.com",
+  "dependentChangeType": "patch"
+}
diff --git a/change/react-native-windows-9b8fed9e-be4c-430c-a6d8-324b0a1cf8d2.json b/change/react-native-windows-9b8fed9e-be4c-430c-a6d8-324b0a1cf8d2.json
@@ -0,0 +1,7 @@
+{
+  "type": "prerelease",
+  "comment": "Integrate 3/18 nightly RN build.",
+  "packageName": "react-native-windows",
+  "email": "igklemen@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
@@ -5,7 +5,7 @@
   "excludePatterns": [
     "src/js/examples-win32/**"
   ],
-  "baseVersion": "0.0.0-d477f8011",
+  "baseVersion": "0.0.0-cfb5b5e20",
   "overrides": [
     {
       "type": "patch",
@@ -37,7 +37,7 @@
       "type": "derived",
       "file": "src/js/utils/RNTesterList.win32.js",
       "baseFile": "packages/rn-tester/js/utils/RNTesterList.android.js",
-      "baseHash": "58b0acccf835104dec310ced6f7149739e4e06ff"
+      "baseHash": "94f48ba9b8613e1e04177ea43f4f1d411bc3cd0b"
     },
     {
       "type": "patch",

diff --git a/packages/@office-iss/react-native-win32-tester/package.json b/packages/@office-iss/react-native-win32-tester/package.json
@@ -15,7 +15,7 @@
   },
   "peerDependencies": {
     "@office-iss/react-native-win32": "^0.0.0-canary.85",
-    "react-native": "0.0.0-d477f8011"
+    "react-native": "0.0.0-cfb5b5e20"
   },
   "devDependencies": {
     "@office-iss/react-native-win32": "^0.0.0-canary.85",
@@ -24,7 +24,7 @@
     "@types/node": "^14.14.22",
     "eslint": "7.12.0",
     "just-scripts": "^1.3.3",
-    "react-native": "0.0.0-d477f8011",
+    "react-native": "0.0.0-cfb5b5e20",
     "react-native-platform-override": "^1.4.13",
     "typescript": "^3.8.3"
   }

diff --git a/packages/@office-iss/react-native-win32-tester/src/js/utils/RNTesterList.win32.js b/packages/@office-iss/react-native-win32-tester/src/js/utils/RNTesterList.win32.js
@@ -29,6 +29,21 @@ const ComponentExamples: Array<RNTesterExample> = [
     category: 'ListView',
     module: require('../examples/FlatList/FlatListExample'),
   },
+  {
+    key: 'FlatList-withSeparators',
+    module: require('../examples/FlatList/FlatList-withSeparators'),
+    category: 'ListView',
+  },
+  {
+    key: 'FlatList-onViewableItemsChanged',
+    module: require('../examples/FlatList/FlatList-onViewableItemsChanged'),
+    category: 'ListView',
+  },
+  {
+    key: 'FlatList-onEndReached',
+    module: require('../examples/FlatList/FlatList-onEndReached'),
+    category: 'ListView',
+  },
   {
     key: 'ImageExample',
     category: 'Basic',

diff --git a/packages/@office-iss/react-native-win32/.flowconfig b/packages/@office-iss/react-native-win32/.flowconfig
@@ -89,6 +89,7 @@ suppress_type=$FlowFixMeState
 suppress_type=$FlowFixMeEmpty
 
 experimental.abstract_locations=true
+experimental.new_signatures=true
 
 [lints]
 sketchy-null-number=warn

diff --git a/packages/@office-iss/react-native-win32/overrides.json b/packages/@office-iss/react-native-win32/overrides.json
@@ -3,13 +3,13 @@
     ".flowconfig",
     "src/**"
   ],
-  "baseVersion": "0.0.0-d477f8011",
+  "baseVersion": "0.0.0-cfb5b5e20",
   "overrides": [
     {
       "type": "derived",
       "file": ".flowconfig",
       "baseFile": ".flowconfig",
-      "baseHash": "f4da69b0623292df17b4cb39406edf68fecabe9d"
+      "baseHash": "718336b53dd84d09a5331cc4c6a3726114510030"
     },
     {
       "type": "derived",
@@ -376,7 +376,7 @@
       "type": "derived",
       "file": "src/Libraries/Utilities/Dimensions.win32.js",
       "baseFile": "Libraries/Utilities/Dimensions.js",
-      "baseHash": "33e55564b8716ff243e36de554cdcd90fccbe7e3"
+      "baseHash": "cc2a5b68d9207ece63b461f875ea91b7d1949cb6"
     },
     {
       "type": "platform",

diff --git a/packages/@office-iss/react-native-win32/package.json b/packages/@office-iss/react-native-win32/package.json
@@ -66,14 +66,14 @@
     "just-scripts": "^1.3.3",
     "prettier": "1.19.1",
     "react": "17.0.1",
-    "react-native": "0.0.0-d477f8011",
+    "react-native": "0.0.0-cfb5b5e20",
     "react-native-platform-override": "^1.4.13",
     "react-shallow-renderer": "16.14.1",
     "typescript": "^3.8.3"
   },
   "peerDependencies": {
     "react": "17.0.1",
-    "react-native": "0.0.0-d477f8011"
+    "react-native": "0.0.0-cfb5b5e20"
   },
   "beachball": {
     "defaultNpmTag": "canary",

diff --git a/packages/@office-iss/react-native-win32/src/Libraries/Utilities/Dimensions.win32.js b/packages/@office-iss/react-native-win32/src/Libraries/Utilities/Dimensions.win32.js
@@ -6,6 +6,8 @@
  * @flow
  */
 
+import {type EventSubscription} from '../vendor/emitter/EventEmitter';
+
 class Dimensions {
   static get(dim: string): Object {
     throw new Error(
@@ -19,12 +21,18 @@ class Dimensions {
     );
   }
 
-  static addEventListener(type: 'change', handler: Function) {
+  static addEventListener(
+    type: 'change',
+    handler: Function,
+  ): EventSubscription {
     throw new Error(
       'Having a global Dimensions object is too simplistic for Win32, so this API does not work',
     );
   }
 
+  /**
+   * @deprecated Use `remove` on the EventSubscription from `addEventListener`.
+   */
   static removeEventListener(type: 'change', handler: Function) {
     throw new Error(
       'Having a global Dimensions object is too simplistic for Win32, so this API does not work',

diff --git 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-d477f8011",
+  "baseVersion": "0.0.0-cfb5b5e20",
   "overrides": [
     {
       "type": "patch",
@@ -45,7 +45,7 @@
       "type": "derived",
       "file": "src/js/utils/RNTesterList.windows.js",
       "baseFile": "packages/rn-tester/js/utils/RNTesterList.android.js",
-      "baseHash": "58b0acccf835104dec310ced6f7149739e4e06ff"
+      "baseHash": "94f48ba9b8613e1e04177ea43f4f1d411bc3cd0b"
     }
   ]
 }
diff --git a/packages/@react-native-windows/tester/package.json b/packages/@react-native-windows/tester/package.json
@@ -14,7 +14,7 @@
     "@react-native/tester": "0.0.1"
   },
   "peerDependencies": {
-    "react-native": "0.0.0-d477f8011",
+    "react-native": "0.0.0-cfb5b5e20",
     "react-native-windows": "^0.0.0-canary.287"
   },
   "devDependencies": {
@@ -23,7 +23,7 @@
     "@types/node": "^14.14.22",
     "eslint": "7.12.0",
     "just-scripts": "^1.3.3",
-    "react-native": "0.0.0-d477f8011",
+    "react-native": "0.0.0-cfb5b5e20",
     "react-native-platform-override": "^1.4.13",
     "react-native-windows": "^0.0.0-canary.287",
     "typescript": "^3.8.3"

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
@@ -20,15 +20,35 @@ const ComponentExamples: Array<RNTesterExample> = [
     category: 'UI',
     module: require('../examples/Button/ButtonExample'),
   },
+  {
+    key: 'DatePickerExample',
+    category: 'UI',
+    module: require('../examples-win/DatePicker/DatePickerExample'),
+  },
   {
     key: 'FlatListExample',
     category: 'ListView',
     module: require('../examples/FlatList/FlatListExample'),
   },
   {
-    key: 'DatePickerExample',
-    category: 'UI',
-    module: require('../examples-win/DatePicker/DatePickerExample'),
+    key: 'FlatList-withSeparators',
+    module: require('../examples/FlatList/FlatList-withSeparators'),
+    category: 'ListView',
+  },
+  {
+    key: 'FlatList-onViewableItemsChanged',
+    module: require('../examples/FlatList/FlatList-onViewableItemsChanged'),
+    category: 'ListView',
+  },
+  {
+    key: 'FlatList-onEndReached',
+    module: require('../examples/FlatList/FlatList-onEndReached'),
+    category: 'ListView',
+  },
+  {
+    key: 'ImageExample',
+    category: 'Basic',
+    module: require('../examples/Image/ImageExample'),
   },
   {
     key: 'FastTextExample',
@@ -45,11 +65,6 @@ const ComponentExamples: Array<RNTesterExample> = [
     category: 'UI',
     module: require('../examples-win/Glyph/GlyphExample'),
   },
-  {
-    key: 'ImageExample',
-    category: 'Basic',
-    module: require('../examples/Image/ImageExample'),
-  },
   // {
   //   key: 'ModalExample',
   //   category: 'UI',

diff --git a/packages/@react-native/repo-config/overrides.json b/packages/@react-native/repo-config/overrides.json
@@ -1,5 +1,5 @@
 {
-  "baseVersion": "0.0.0-d477f8011",
+  "baseVersion": "0.0.0-cfb5b5e20",
   "overrides": [
     {
       "type": "copy",

diff --git a/packages/@react-native/tester/js/examples/Accessibility/AccessibilityExample.js b/packages/@react-native/tester/js/examples/Accessibility/AccessibilityExample.js
@@ -716,7 +716,7 @@ class SetAccessibilityFocusExample extends React.Component<{}> {
 
     const onClose = () => {
       if (myRef && myRef.current) {
-        AccessibilityInfo.sendAccessiblityEvent_unstable(
+        AccessibilityInfo.sendAccessibilityEvent_unstable(
           myRef.current,
           'focus',
         );

diff --git a/packages/@react-native/tester/js/examples/Button/ButtonExample.js b/packages/@react-native/tester/js/examples/Button/ButtonExample.js
@@ -174,6 +174,29 @@ exports.examples = [
       );
     },
   },
+  {
+    title: 'Button with accessibilityState={{disabled: true}}',
+    description: ('Note: This prop will announce on TalkBack that the button is disabled. ' +
+      'The "disabled" prop has higher precedence on the state of the component': string),
+    render: function(): React.Node {
+      return (
+        <RNTesterThemeContext.Consumer>
+          {theme => {
+            return (
+              <Button
+                accessibilityState={{disabled: true}}
+                onPress={() => onButtonPress('submitted')}
+                testID="accessibilityState_button"
+                color={theme.LinkColor}
+                title="Submit Application"
+                accessibilityLabel="Press to submit your application!"
+              />
+            );
+          }}
+        </RNTesterThemeContext.Consumer>
+      );
+    },
+  },
 ];
 
 const styles = StyleSheet.create({

diff --git a/packages/@react-native/tester/js/examples/Dimensions/DimensionsExample.js b/packages/@react-native/tester/js/examples/Dimensions/DimensionsExample.js
@@ -8,6 +8,7 @@
  * @flow
  */
 
+import type {EventSubscription} from 'react-native/Libraries/vendor/emitter/EventEmitter';
 import {Dimensions, Text, useWindowDimensions} from 'react-native';
 import * as React from 'react';
 
@@ -19,20 +20,23 @@ class DimensionsSubscription extends React.Component<
     dims: Dimensions.get(this.props.dim),
   };
 
+  _dimensionsSubscription: ?EventSubscription;
+
   componentDidMount() {
-    Dimensions.addEventListener('change', this._handleDimensionsChange);
+    this._dimensionsSubscription = Dimensions.addEventListener(
+      'change',
+      dimensions => {
+        this.setState({
+          dims: dimensions[this.props.dim],
+        });
+      },
+    );
   }
 
   componentWillUnmount() {
-    Dimensions.removeEventListener('change', this._handleDimensionsChange);
+    this._dimensionsSubscription?.remove();
   }
 
-  _handleDimensionsChange = dimensions => {
-    this.setState({
-      dims: dimensions[this.props.dim],
-    });
-  };
-
   render() {
     return <Text>{JSON.stringify(this.state.dims, null, 2)}</Text>;
   }

diff --git a/packages/@react-native/tester/js/examples/FlatList/FlatList-onEndReached.js b/packages/@react-native/tester/js/examples/FlatList/FlatList-onEndReached.js
@@ -0,0 +1,28 @@
+/**
+ * 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.
+ *
+ * @format
+ * @flow
+ */
+
+'use strict';
+import {FlatList_onEndReached} from './FlatListExamples';
+const React = require('react');
+
+exports.title = 'FlatList onEndReached';
+exports.testTitle = 'Test onEndReached callback';
+exports.category = 'ListView';
+exports.documentationURL = 'https://reactnative.dev/docs/flatlist';
+exports.description =
+  'Scroll to end of list or tap Test button to see `onEndReached` triggered.';
+exports.examples = [
+  {
+    title: 'FlatList onEndReached',
+    render: function(): React.Element<typeof FlatList_onEndReached> {
+      return <FlatList_onEndReached />;
+    },
+  },
+];