Summary:
#Changelog:
[General][Changed] - Remove `data` as a prop for VirtualizedSectionList. In the reactnative.dev docs it mentions that `sections` is the equivalent for `*SectionList`: https://reactnative.dev/docs/sectionlist#sections
Reviewed By: nadiia
Differential Revision: D26992800
fbshipit-source-id: afcd027fca0cc8b4d7418e0c5543382bc8e2f56c
Summary:
Changelog:
[Internal][Changed] -Remove keyExtractor from defaultProps as part of larger effort to remove defaultProps from VirtualizedList
Reviewed By: nadiia
Differential Revision: D26969588
fbshipit-source-id: b00922a339cbe471fcbf560ab4abdd9e48eda1fc
Summary:
Changelog:
[Internal][Changed] -Remove updateCellsBatchingPeriod from defaultProps as part of larger effort to remove defaultProps from VirtualizedList
Reviewed By: nadiia
Differential Revision: D26969581
fbshipit-source-id: b1d1d18d575d9a6af2e68fe564d221849094f26b
Summary:
Changelog:
[Internal][Changed] -Remove windowSize from defaultProps as part of larger effort to remove defaultProps from VirtualizedList
Reviewed By: nadiia
Differential Revision: D26969589
fbshipit-source-id: da6215ee3876c8f186d59f91ef6fd94396366119
Summary:
Changelog:
[Internal][Changed] -Remove scrollEventThrottle from defaultProps as part of larger effort to remove defaultProps from VirtualizedList
Reviewed By: nadiia
Differential Revision: D26969580
fbshipit-source-id: 504e11493113c01d70e77b90f96c6506c179c060
Summary:
Changelog:
[Internal][Changed] -Remove onEndReachedThreshold from defaultProps as part of larger effort to remove defaultProps from VirtualizedList
Reviewed By: nadiia
Differential Revision: D26969584
fbshipit-source-id: 03968c5831587f9ed60dc52c55c55c0980f20cbd
Summary:
Changelog:
[Internal][Changed] -Remove maxToRenderPerBatch from defaultProps as part of larger effort to remove defaultProps from VirtualizedList
Reviewed By: nadiia
Differential Revision: D26969582
fbshipit-source-id: 64a07aae11f0403b01c01896b4f83565da6ecf43
Summary:
Changelog:
[General][Changed] - Change VirtualizeUtils to use ESM and change function signature on `computeWindowedRenderLimits` as part of larger effort to remove defaultProps from VirtualizedList
Reviewed By: nadiia
Differential Revision: D26969586
fbshipit-source-id: cd1961a2088d37543dbc9bca8c4a062cdb426a35
Summary:
Changelog:
[Internal][Changed] - Remove initialNumToRender from defaultProps as part of larger effort to remove defaultProps from VirtualizedList
Reviewed By: nadiia
Differential Revision: D26969585
fbshipit-source-id: 8674544c06b7b99eee693cc7508c9e4199232e98
Summary:
Changelog:
[Internal][Changed] - Remove horizontal from defaultProps as part of larger effort to remove defaultProps from VirtualizedList
Reviewed By: nadiia
Differential Revision: D26969583
fbshipit-source-id: c21ac15a220a68a58e32b78dcc37c053756b72cf
Summary:
Changelog:
[Internal][Changed] - Remove disableVirtualization from defaultProps as part of larger effort to remove defaultProps from VirtualizedList
Reviewed By: nadiia
Differential Revision: D26969587
fbshipit-source-id: 662fa620bc5b6b9a64c1906f62dae1f4b373a23b
Summary:
This diff forces a remeasure of the children of VirtualizedLists everytime the VirtualizedList is measured.
The goal is to ensure that nested VirtualizedList has the correct "scroll information" all the time, scroll information information is used by ViewabilityHelper.computeViewableItems method to determine if Items of the list are visible to the user.
This new code is controlled by the MC: rn_core:enable_virtualizedlist_remeasure_children_if_needed.
changelog: [internal] internal
// I used an internal changelog because this is under a MC
Reviewed By: lunaleaps
Differential Revision: D27003249
fbshipit-source-id: f9452ceb27683b0f595dd4bffdcced0ecf6bb0b5
Summary:
See https://github.com/react-native-community/discussions-and-proposals/pull/335 for extra context.
A VirtualizedList may have sticky headers, forwarded on to ScrollView. These sticky headers are exempt from virtualization once realized for the first time. This change documents the behavior of keeping sticky header cells realized after scrolling away.
This scenario performs the same behavior as creating an internal "realization window" for sticky headers with a single cell window size. Generalizing the concept of realization windows should be shaped to support the existing sticky header scenario.
## Changelog
<!-- Help reviewers and the release process by writing your own changelog entry. For an example, see:
https://github.com/facebook/react-native/wiki/Changelog
-->
[Internal] [Added] - Add tests describing current sticky header realization behavior
Pull Request resolved: https://github.com/facebook/react-native/pull/31075
Reviewed By: lunaleaps
Differential Revision: D26767582
Pulled By: appden
fbshipit-source-id: 0d151bd6046fcb5384c646205aafa1ca7edf6c77
Summary:
`React.ElementRef<HostComponent<mixed>>` is an inexact object type, which can not be spread into an exact object type, as is happening here. This error is masked in types-first mode, but causes the instance type of this component to be `any`. In a future version of Flow, this issue will be fixed, so this change unblocks upgrading Flow.
This change is likely to cause code using `TextInput` refs to find errors which were missed before.
Changelog:
[General][Fixed] - Fixed Flow typing of TextInput refs
Reviewed By: yungsters
Differential Revision: D26733314
fbshipit-source-id: 8aa26ce5b49357b279f76dd1767a17a9fb4dd4f1
Summary:
This PR fixes few suppressed Flow issues in `VirtualizedList` component.
I have also removed few no longer valid Flow suppressions in `ActivityIndicator` and `ReactNativeTestTools`.
## Changelog
[General] [Fixed] - Flow: fix few issues in `VirtualizedList`,
[General] [Removed] - Flow: remove few no longer valid suppressions in `ReactNativeTestTools`
Pull Request resolved: https://github.com/facebook/react-native/pull/30128
Test Plan: Successful run of `yarn flow` check.
Reviewed By: kacieb
Differential Revision: D26489398
Pulled By: lunaleaps
fbshipit-source-id: db71d8bfeb3b6dc5a2738a73ac6644aef4a0311b
Summary:
ES Modules implicitly enable strict mode. Adding the "use strict" directive is, therefore, not required.
This diff removes all "use strict" directives from ES modules.
Changelog:
[Internal]
Reviewed By: motiz88
Differential Revision: D26172715
fbshipit-source-id: 57957bcbb672c4c3e62b1db633cf425c1c9d6430
Summary:
There may be assumptions that `Native*.js` contains TurboModule. In order to avoid introducing unplanned breaking changes (especially right before the holidays), roll this back for now.
In doing so, I also realized that I forgot to migrate over `ScrollContentViewNativeComponent`. This does that, too.
Changelog:
[Internal]
Reviewed By: RSNara
Differential Revision: D25129324
fbshipit-source-id: 343c4b800969dab91f7cd9f2bf253788c94d38e6
Summary:
The Flow team has been building a new implementation of the system that typechecks the body of generic functions and classes. This system is more sound than the previous approach and detects errors that were uncaught previously. This diff turns on the new generic system by setting generate_tests=false in the .flowconfig, and suppresses newly discovered errors.
This diff modifies and re-signs some generated modules, because syncing from www pulled in a ton of other changes that have runtime differences, and I'm not equipped to verify that the changes are safe to land.
Changelog: [Internal]
Reviewed By: panagosg7
Differential Revision: D24801184
fbshipit-source-id: bb31fe4c5a4107d183649b436a548df5ff42e217
Summary:
Migrates `ScrollView` (and its related native components) to use `NativeComponentRegistry`. This will enable it to be configured using experiments to conditionally use the native `ViewConfig` or verify the static `ViewConfig`.
This also cleans up a bunch of the modules and types related to defining the native `ScrollView` component.
This also proposes adopting the same module naming protocol was has been adopted for TurboModules (i.e. `NativeScrollView` instead of `ScrollViewNativeComponent`).
Changelog:
[Internal]
Reviewed By: JoshuaGross
Differential Revision: D25098530
fbshipit-source-id: ff1394bfac023daf58e85d5f9068e4f8da3538be
Summary:
Changelog:
[General] [Changed] - Added (DEV-only) `displayName` to some RN contexts to make them more easy to differentiate when debugging.
Reviewed By: lunaleaps
Differential Revision: D24993068
fbshipit-source-id: 4904259eda50444c2f74700a3540ff4fd02ac322
Summary:
With nested FlatLists, three methods aren't firing: `onMomentumScrollBegin`, `onMomentumScrollEnd`, and `onScrollDragEnd`. This is because the nested child lists' methods are not being called.
This copies the solution for this from `onScrollBeginDrag` to the other three methods.
Changelog: [Fixed] Fix nested FlatList not firing onScrollDragEnd and onMomentum methods
Reviewed By: nadiia
Differential Revision: D24803418
fbshipit-source-id: 8685b1ab9f1bd5f67a88d93ac5de628d4bd69024
Summary:
Removes `fbjs` dependency from `react-native` because it is no longer referenced.
Changelog:
[General][Changed] - Removed `fbjs` dependency from `react-native`.
Reviewed By: cpojer
Differential Revision: D23358201
fbshipit-source-id: 1945590d2e7ea853434c716a151fc1058718d471
Summary:
Replaces `fbjs/warning` call sites in React Native with `console.warn`. A few warnings will now log as warnings without the "Warning:" prefix.
Changelog:
[General][Changed] - Some warnings changed to use `console.warn` without the "Warning:" prefix.
Reviewed By: TheSavior, cpojer
Differential Revision: D22445946
fbshipit-source-id: 96b01e1bdee52b89ff3b808bc9d6cd494f6787f5
Summary:
This change makes the behavior of providing a null value to onEndReachedThreshold match the behavior of not providing the prop at all.
## Changelog:
[General] [Changed] - Adjusted VirtualizedList's onEndReachedThreshold default value when null is provided
Reviewed By: olegbl
Differential Revision: D22870445
fbshipit-source-id: 29cbf0550702244007689759846ae0356f06b48d
Summary:
Replaces `fbjs/performanceNow` call sites in React Native with `performance.now`.
We did not originally polyfill this in `InitializeCore`, but now we do (and back it with a proper `nativePerformanceNow` implementation). Also, added the missing polyfill to our Jest setup.
Changelog:
[Internal]
Reviewed By: cpojer
Differential Revision: D22445948
fbshipit-source-id: dcfd9867c050617f6e2a3d0a1eb6f48a44771dda
Summary:
The initialScrollIndex in VirtualizedList contains a performance optimization to start rendering the list at the index provided.
ContentOffset does not contain this optimization and there is currently no way to specify the first item in the list to start rendering without contentOffset being ignored.
This change makes it so that if both initialScrollIndex and ContentOffset are provided, the list will start rendering at the initialScrollIndex but ContentOffset will still be used to set the scroll position.
initialScrollIndex functionality will remain the same if ContentOffset is not provided.
Changelog: [Changed] VirtualizedList will use contentOffset for scroll position instead of initialScrollIndex if both are provided
Reviewed By: sahrens
Differential Revision: D21980172
fbshipit-source-id: 36d2d2bc360845ef02329d2b95a2cf14b91c2b0b
Summary:
This has caused SEVs because the warning has gone unnoticed, so upgrading to error which should be much harder to miss or ignore.
https://fb.workplace.com/groups/rn.core/permalink/2680043542227367/
# Changelog
[Internal] update nested VList warning to error
Reviewed By: TheSavior
Differential Revision: D21945364
fbshipit-source-id: 88a9a9ab0b51e0afcf9b25be9854f65a61f419af
Summary:
Add a `console.warn()` call when calling `_scrollRef.scrollTo`, because `scrollTo` is not guaranteed to exist on `_scrollRef`.
Context:
`VirtualizedList` holds `_scrollRef`, which is usually a reference to a `ScrollView` component. However, there are several cases where it holds a `View` or other type of component instead.
A custom component can be passed in to `renderScrollComponent`, and then `_scrollRef` will point to that custom component. Additionally, if two VirtualizedLists are nested with the same orientation, `_defaultRenderScrollComponent` will return a View instead of a ScrollView.
Due to these possibilities, `_scrollRef` is not guaranteed to have a `scrollTo` method.
Changelog: [General] [Added] - Add warning when scrollRef does not have a scrollTo method
Reviewed By: JoshuaGross, TheSavior
Differential Revision: D21386842
fbshipit-source-id: 01e167e0ae0edea8f29853e8b242ce88a5103b49
Summary:
Removes `PropTypes` as a dependency of `VirtualizedList` by no longer validating the return value of `getItemLayout`.
Changelog: [Internal]
Reviewed By: TheSavior, cpojer
Differential Revision: D21370890
fbshipit-source-id: 966db3557b714987aa91179c7654a5ebf27818ad
Summary:
I refined the error message of scrollToIndex.
When I used scrollToIndex with `index:0` and data that length is 0, I met the odd error message `Invariant Violation scrollToIndex out of range: requested index 0 but maximum is -1`.
Next, I thought that scrollToIndex with `index:-1` meant scrollToTop without checking data length. I met `Invariant Violation: scrollToIndex out of range: requested index -1 but maximum is -1`
Finally, I wondered what will happen to use scrollToIndex with `index:-1` and data that length is `5`. The result is `Invariant Violation: scrollToIndex out of range: requested index -1 but maximum is 5`
The above error messages will confuse us. I clarified the boudaries and separated the error messages
## Changelog
[General] [Fixed] - Clarified the boundaries in error message of scrollToIndex
Pull Request resolved: https://github.com/facebook/react-native/pull/28464
Test Plan:
I added 3 test cases to cover the new error messages for VirtualizedList.
Run `yarn test` and confirm it passes.
Reviewed By: cpojer
Differential Revision: D21140133
Pulled By: TheSavior
fbshipit-source-id: 9a7a704f7ec599d833d2ed3ca2be059d950539b5
Summary:
onEndReached can be triggered twice when more items are added to the end of the list. This change makes it so that a second call to onEndReached won't happen until the user scrolls down to the new end of the list.
Changelog:
[General] [Fixed] - Fix double call to onEndReached in VirtualizedList
Reviewed By: sahrens
Differential Revision: D20066740
fbshipit-source-id: 129d7ae6bfd241eeea18fe0bb12b82be67735874
Summary:
Have ScrollView use forwardRef so that the host component methods like `measure` and `measureLayout` are available without having to call `getNativeScrollRef`. Instead, you can use `<ScrollView ref={myRef} />` and directly call all methods of ScrollView and host components on `myRef`.
Previous usage:
```
const myRef = React.createRef<React.ElementRef<typeof ScrollView>>();
<ScrollView ref={myRef} />
const innerViewRef = myRef.current.getNativeScrollRef();
innerViewRef.measure();
```
New usage:
```
const myRef = React.createRef<React.ElementRef<typeof View>>();
<ScrollView ref={myRef} />
// now, myRef.current can be used directly as the ref
myRef.current.measure();
myRef.current.measureLayout();
// Additionally, myRef still has access to ScrollView methods
myRef.current.scrollTo(...);
```
Changes:
* Added deprecation warnings to ScrollView methods `getNativeScrollRef`, `getScrollableNode`, and `getScrollResponder`
* Added the forwardRef call to create `ForwardedScrollView` - this takes in `ref` and passes it into the class ScrollView as `scrollViewRef`.
* Forwarded the ref to the native scroll view using `setAndForwardRef`.
* Added statics onto `ForwardedScrollView` so that `ScrollView.Context` can still be accessed.
* Added type `ScrollViewImperativeMethods`, which lists the public methods of ScrollView.
* Converted all public methods of ScrollView to arrow functions. This is because they need to be bound to the forwarded ref.
* Bound all public methods of ScrollView to the forwarded ref in the `setAndForwardRef` call.
* Flow typed the final output (ForwardedScrollView) as an abstract component that takes in the props of the `ScrollView` class, and has all methods of both the inner host component (`measure`, `measureLayout`, etc) and the public methods (`scrollTo`, etc).
Changes to mockScrollView:
* Changed mockScrollView to be able to mock the function component instead of a class component
* Updated necessary tests
Changelog:
[General] [Changed] - Make ScrollView use forwardRef
Reviewed By: TheSavior
Differential Revision: D19304480
fbshipit-source-id: 6c359897526d9d5ac6bc6ab6d5f9d82bfc0d8af4
Summary:
This gets us on the latest Prettier 2.x:
https://prettier.io/blog/2020/03/21/2.0.0.html
Notably, this adds support for TypeScript 3.8,
which introduces new syntax, such as `import type`.
Reviewed By: zertosh
Differential Revision: D20636268
fbshipit-source-id: fca5833d003804333a05ba16325bbbe0e06d6c8a
Summary:
A few recent imports have explicitly added ".js" to the end of their path. This prevents Metro from resolving platform-specific JS files, e.g. "Foo.android.js" or "Foo.windows.js" instead of "Foo.js".
React Native Windows provides its own implementation of files in a few cases where stock React Native will share them between Android and iOS. We hope to reduce/eliminate these long term, but requiring explicit ".js" files currently breaks us in a couple of places where we have custom implementations.
This change is a quick regex replace of ES6 and CommonJS imports in 'Libraries/" to eliminate ".js".
## Changelog
[General] [Fixed] - Do not explicitly include ".js" in Library imports
Pull Request resolved: https://github.com/facebook/react-native/pull/28311
Test Plan: I haven't done any manual validation of this, but `flow-check` should catch any issues with this during CI.
Reviewed By: cpojer
Differential Revision: D20486466
Pulled By: TheSavior
fbshipit-source-id: 31e1ccc307967417d7d09c34c859f0b2b69eac84
Summary:
When any list cell that may contain nested VirtualizedLists is laid out, it's possible that the offset of any child lists relative to the outermost list has changed. We need to tell these children to re-measure themselves relative to that outermost list, so that their viewability calculations are correct.
We already do this for regular list cells -- we just need to extend that logic to any child lists that may live in the ListFooterComponent.
Changelog: [General] [Fixed] - Fix viewability calculations for nested VirtualizedLists inside of a parent list's FooterComponent
Differential Revision: D20310961
fbshipit-source-id: 4bfcfb95c87329f2ee337d5499e5c7162ba692e8
Summary:
We will soon be enforcing that flow suppressions will only apply when on an error's primary location ([post](https://fb.workplace.com/groups/179614562644215/permalink/559286354677032/)). This diff uses the codemod created in D20008770 to move all suppression comments to their primary locations in the `xplat/js` flow root, and deletes suppression comments that are not on any primary locations.
This diff was generated with:
```
~/fbsource/fbcode/flow/packages/flow-dev-tools/bin/tool suppression-primary-locations --json-file ~/www/errors.json ~/fbsource/xplat/js
hg st -n | xargs grep -l -P '@(partially-)?generated' | xargs hg revert
hg st -n | xargs grep -l 'format' | xargs prettier --write
```
Changelog: [Internal]
bypass-lint
Reviewed By: dsainati1
Differential Revision: D20122544
fbshipit-source-id: d94e409aadb18bb399a1ddbf9f3f2494fe4fb54c
Summary:
We recently updated React Native's docs site to have its own domain reactnative.dev and needed to update the URLs in the source code
CHANGELOG:
[INTERNAL]
Reviewed By: hramos
Differential Revision: D20072842
fbshipit-source-id: 1970d9214c872a6e7abf697d99f8f5360b3b308e
Summary:
This diff regenerates all Jest inline snapshots (`expect().toMatchInlineSnapshot()`) now that we use Jest 24.9.0 which fixes a longstanding [formatting instability bug](https://github.com/facebook/jest/issues/8424).
This is strictly a formatting change.
Changelog: [Internal]
Reviewed By: cpojer
Differential Revision: D19684238
fbshipit-source-id: 77c1e5fe9d2dfef85dffdcc00056fb439d7d7f84
Summary:
## Context
When a `VirtualizedList` contains a cell which itself contains more than one `VirtualizedList` of the same orientation as the parent list, we log an error if sibling lists in a cell don't have unique `listKey`s (e.g. when the `listKey` prop isn't explicitly set). In release builds, this error does not have a component stack - nor a useful call stack - so it can be hard to track down the true source of the error in complex applications.
## This diff
Here, in addition to the generic error message, we also print the `listKey`, `cellKey` and orientation of each `VirtualizedList` in the hierarchy, from the child list upwards. This is done without significant overhead, by reusing the already-in-place context that `VirtualizedList`s use to manage nesting.
The assumption is that common strategies for deriving `listKey`s and `cellKey`s will make it possible to identify at least some lists in the hierarchy in common cases, and therefore help narrow down the search space even when component stacks are not available.
## Example
(See code in unit test)
```
A VirtualizedList contains a cell which itself contains more than one VirtualizedList of the same orientation as the parent list. You must pass a unique listKey prop to each sibling list.
VirtualizedList trace:
Child (horizontal):
listKey: level2
cellKey: cell0
Parent (horizontal):
listKey: level1
cellKey: cell0
Parent (vertical):
listKey: level0
cellKey: rootList
```
Changelog: [Internal]
Reviewed By: TheSavior
Differential Revision: D19600366
fbshipit-source-id: 73f29507ec58a6a3f9b3f6b174a32b21dcd237a1
Summary:
Fixes https://github.com/facebook/react-native/issues/16067
The issue is due to a race between `onLayout` and `onContentSizeChange`, which in general should be fine because there is no expectation of ordering between the two, and only causes issues with certain configurations.
The bug can be triggered if `initialNumToRender` is smaller than needed to fill past the `onEndReachedThreshold` (say the default, 10, is only 580px tall, but it takes 15 to reach the threshold). This will cause an incrementally render of more items to try and fill the viewport. The problem is that if the `onLayout` comes back before the first `onContentSizeChange`, it will first do the state increment to render 20 items and then the stale `onContentSizeChange` callback from 10 items will fire and we'll think that the content size for 20 items is 580px when in fact it's 1160px (which is past the threshold). If those 20 items are also all of our available data, then we'll call `onEndReached` because we think we've rendered everything and are still within the `onEndReachedThreshold`.
The fundamental problem here is the system getting confused when a stale async `onContentSizeChange` comes in after increasing `state.last`. I wish there was a concrete timeframe, but Fabric will give us more flexibility to do things synchronously so hopefully we can avoid class of issues once that roles out.
The fix here simply adds a check to make sure `contentLength` has been set before adjusting the render window so it's not possible to increase the window size before the initial `onContentSizeChange` callback fires.
For completeness, there are a few user-code workarounds to avoid this issue entirely:
1) Provide the `getItemLayout` prop so the list doesn't have to rely on async layout data (you should do this whenever possible anyway for better perf). e.g. for the original snack example, you can just add `getItemLayout={(d, index) => ({length: 58, offset: 58 * index, index})}` since all the rows are height 58 and the issue will no longer repro. Note this is fragile and must be kept in sync with UI changes, a11y font scaling, etc - a more robust approach could be to render a single representative row offscreen and measure it with `onLayout` then use that value.
2) If `getItemLayout` is not feasible to compute for your UI, increase `initialNumToRender` to cover the `onEndReachedThreshold`.
3) And/or add your own logic to protect against extra calls to `onEndReached` as others have suggested.
Changelog:
[General][Fixed] - Fix sporadic issue with onEndReached called on load when not needed
# Test Plan
Adds a new jest test that fails without this fix and succeeds with it.
Reviewed By: TheSavior
Differential Revision: D18966721
fbshipit-source-id: de05d9f072e24a2faf351e7f5d60578a31def996