Summary:
Changelog: [Internal]
# Problem
## Step 1
JS clones a node that has size {100, 100} and changes props that cause the node to increase size to {200, 200}. JS holds pointer to this node.
Now, the size (stored in LayoutableShadowNode.layoutMetrics_) changes after Yoga layout is triggered.
However, the node gets cloned inside State Reconciliation before Yoga layout phase. The JS pointer points to a node with size {100, 100}, not to a node with size {200, 200}.
## Step 2
Again, JS clones node (with old reference, therefore gets old layoutMetrics_ with size {100, 100}) and it changes props that cause the node to decrease its size back to {100, 100}.
We go all the way to Yoga layout and looking for nodes that have been affected by the node. The node, affected by the layout because it went from {200, 200} to {100, 100}, will be evaluated as not affected. This causes onLayout event to not be fired.
# Fix
We can safely remove the frame equality check (please see below). This can be done because we already check for equality before dispatching onLayout. It happens here:
https://www.internalfb.com/intern/diffusion/FBS/browsefile/master/xplat/js/react-native-github/ReactCommon/react/renderer/components/view/ViewEventEmitter.cpp?commit=881853eb0c42625fd0812bd2652bf36fcbd614ee&lines=43
As far as I know, `affectedNodes` isn't used for anything else besides dispatching onLayout.
# Discussion
This problem manifests itself only when a node has two different sizes that it flips between. To better understand this, please watch the video in Test plan labelled "before". Notice how the text has 2 different values that it flips between.
Here is a code that was affected by it https://fburl.com/diffusion/3hwo0iy5
If you inspect it closely, you will notice that it depends on `onLayout` to return correct value to calculate offset from left.
Reviewed By: JoshuaGross
Differential Revision: D22999891
fbshipit-source-id: e2d0f5771c1bf3cd788e5e9da0155c92e33fb84e
Summary:
In the past I tried a few heuristics to guess when a batch of Animated Operations were ready, and none of these were super reliable. But it turns out we can safely allow JS to manage that explicitly.
Non-Fabric still uses the old behavior which seems fine.
Changelog: [Internal]
Reviewed By: mdvacca
Differential Revision: D23010844
fbshipit-source-id: 4c688d3a61460118557a4971e549ec7457f3eb8f
Summary:
This diff extends fabric module to compile in OSS
NOTE: As a side effect of this diff, Fabric will be included into "reactnativejni" which is used by RN OSS.
I'm planning to remove this dependency in the near future - T71320460
changelog: [internal] internal
Reviewed By: JoshuaGross
Differential Revision: D22991877
fbshipit-source-id: 0ab3ee410dd448bbd87130114bec27c6e6bc65c6
Summary:
This diff introduces the class CoreComponentsRegistry that is responsible of registering core components in fabric.
This is required to make RN Tester to work in Fabric, in the future we'll extract this registry into another module (once we figure it out what's the best way to do this)
changelog: [internal] internal
Reviewed By: JoshuaGross
Differential Revision: D22991876
fbshipit-source-id: 15e85e15aac5dd981161d9eae35eb2cee4fa66b6
Summary:
This diff refactors the ComponentFactoryDelegate class. It also introduces a new class called ComponentRegistry that will be used to register components into fabric
changelog: [internal] internal
Reviewed By: JoshuaGross
Differential Revision: D22985313
fbshipit-source-id: e33a3d4fcb3a1c509b80c6ff1f43889480b1c2c3
Summary:
This diff extends the 'textlayoutmanager' module to compile in OSS
As part of this diff I also moved Android files in order to make the module compatible with Android.mk system
changelog: [internal] internal
Reviewed By: JoshuaGross
Differential Revision: D22963706
fbshipit-source-id: 14a7309f589fe12c21131c7d5cef02b4323d4a93
Summary:
This diff refactors the class Runnable into a struct to make it work in OSS
changelog: [internal] internal
Reviewed By: JoshuaGross
Differential Revision: D22963704
fbshipit-source-id: 2212c8f1e4a62b2bcad5c061709e29b247454fc1
Summary:
This ties the stack together, utilizes new TM functionality to avoid using the bridge in `RCTEventDispatcher`.
Changelog: [Internal]
Differential Revision: D22962320
fbshipit-source-id: de4e001a4a6ce232c37d7feed1e0c0d1d70a80f8
Summary:
To get `RCTNativeAnimatedModule` working bridgeless, I need to get `RCTEventDispatcher` working bridgeless.
To get `RCTEventDispatcher` working bridgeless, I need to support 2 new bridge methods:
- `- (void)enqueueJSCall:(NSString *)moduleDotMethod args:(NSArray *)args`
- `- (void)dispatchBlock:(dispatch_block_t)block queue:(dispatch_queue_t)queue;`
For (1) I copied the bridge impl exactly. For (2), the bridge only dispatches to JS thread, else uses `dispatch_async`. I only added support for dispatching to JS thread, callers can `dispatch_async` themselves if they want to.
Changelog: [Internal]
Differential Revision: D22962292
fbshipit-source-id: e34d15aee72f80dffcaa945bfda05ea415f66df7
Summary:
This should fix https://github.com/facebook/react-native/issues/29082 and https://github.com/facebook/react-native/issues/10471
Currently when an alert is being shown while a modal is being dismissed, it causes the alert not to show and In some cases it causes the UI to become unresponsive. I think this was caused by using RCTPresentedViewController to try and display the Alert the currently presented view. The View the Alert was going to be shown on is dismissed and the modal doesn't show. I implemented a new RCTAlertController to show the alert on top of the view, the modal being dismissed should now not interfere with the alert being shown.
## Changelog
[iOS] [Fixed] - Fixed showing Alert while closing a Modal
Pull Request resolved: https://github.com/facebook/react-native/pull/29295
Test Plan:
To recreate the bug:
1. npx react-native init Test --version 0.63.0-rc.1
2. Paste the following code into App.js
```javascript
/**
* Sample React Native App
* https://github.com/facebook/react-native
*
* format
* flow strict-local
*/
import React from 'react';
import {
SafeAreaView,
StyleSheet,
View,
Text,
StatusBar,
Modal,
Alert
} from 'react-native';
const App: () => React$Node = () => {
const [visible, setVisible] = React.useState(false)
const onShowModal = () => {
setVisible(true)
}
onCloseBroken = () => {
setVisible(false)
Alert.alert('Alert', 'Alert won\'t show')
}
onCloseWorking = () => {
setVisible(false)
setTimeout(() => Alert.alert('Alert', 'Works fine'), 10)
}
return (
<>
<StatusBar barStyle="dark-content" />
<SafeAreaView style={styles.container}>
<Text onPress={onShowModal}>Show modal</Text>
</SafeAreaView>
<Modal animationType="fade" visible={visible} onRequestClose={onCloseWorking} >
<View style={styles.container}>
<Text onPress={onCloseBroken}>Close modal immediately</Text>
<Text onPress={onCloseWorking}>Close modal with delay</Text>
</View>
</Modal>
</>
)
}
const styles = StyleSheet.create({
container: {
flex: 1,
alignItems: 'center',
justifyContent: 'space-around',
},
})
export default App
```
3. cd Test && npx react-native run-ios
4. Show the modal and click the `Close modal immediately` button
The first button doesn't show the alert, the second does because it gets rendered after the modal view is dismissed. After this commit, the alert always shows on top of every view properly. You can test by pointing the react native package to my branch by modifying the package json file like this
```
"react-native": "https://github.com/devon94/react-native.git#fix-ios-modal"
```
I was unable to reproduce the case where it causes the UI to be responsive in the test app but was able to reproduce it in our react native app at work. I can provide a video later if needed but the code is too complex to simplify into a test case.
Reviewed By: sammy-SC
Differential Revision: D22783371
Pulled By: PeteTheHeat
fbshipit-source-id: 3e359645c610074ea855ee5686c59bdb9d6b696b
Summary:
Changelog:
[Internal][Add] - Build the basic RCTLocalizationProvider
RCTLocalizationProvider is to enable the localization in fabric. But I'd start with internal apps now.
Reviewed By: PeteTheHeat
Differential Revision: D22704051
fbshipit-source-id: 845693a131c325f3c3d92b2ff491d5421966ad3e
Summary:
Use the latest published release of hermes-engine.
Changelog: [Android] [Changed] - Upgraded to Hermes 0.6.0
allow-large-files
Reviewed By: cpojer
Differential Revision: D22915617
fbshipit-source-id: a10d1db23e41084ce04ba94911ec28423ff5e230
Summary:
Changelog:
[Internal] - Add default value for accessibilityState "checked" and handle unhandled states.
It is also work for the case that accessibilityRole = "switch" and accessibilityState is set.
Reviewed By: sammy-SC
Differential Revision: D22914427
fbshipit-source-id: 4767a21f3bd109019b57bc09918758a38fbdea93
Summary:
New mechanism to soft-crash, or crash, and collect diagnostics in the mounting layer.
Changelog: [Internal]
Reviewed By: sammy-SC
Differential Revision: D22971260
fbshipit-source-id: 860cde3effa4a187f10f5dd1488dd41ace65e363
Summary:
Make react/core module to compile in OSS
This is necessary to make fabric compile in OSS
changelog: [internal] internal
Reviewed By: fkgozali
Differential Revision: D22908222
fbshipit-source-id: a37b87d02ecf77bb25693ce32cd0f3432be5daa7
Summary:
This diff creates the Android.mk file for the fabric graphics module
This is necessary to enable fabric in RN OSS
changelog: [internal] internal
Reviewed By: fkgozali
Differential Revision: D22908219
fbshipit-source-id: 70ef1d06053b0ca07a71c0a2d36e4edd617b2a25
Summary:
This diff creates the Android.mk file for the fabric debug module
This is necessary to enable fabric in RN OSS
changelog: [internal] internal
Reviewed By: fkgozali
Differential Revision: D22908220
fbshipit-source-id: f970fa1d8534a6043f60f362740bfc3e5199b511
Summary:
This diff creates the Android OSS build system for the module react/renderer/components/view
As part of this diff I had to remove inner folders of react/renderer/components/view
changelog: [internal] internal
Reviewed By: fkgozali
Differential Revision: D22881703
fbshipit-source-id: afb56b4f7660d000d2abb8ade0ccb60d1adfb371
Summary:
This diff creates the Android OSS build system for the module react/renderer/graphics
As part of this diff I also moved android specific files to the folder react/renderer/graphics/platform/cxx/react/renderer/graphics folder
changelog: [internal] internal
Reviewed By: fkgozali
Differential Revision: D22880975
fbshipit-source-id: 6899c3bb5ebce3a93d8487f49f1c253925a518e7
Summary:
Update FabricViewStateManager so that the caller can bail out of updates by returning null.
Changelog: [Internal]
Reviewed By: mdvacca
Differential Revision: D22966024
fbshipit-source-id: 31cd9ec8a9a9918fbb94844e30ed1a2fcc61997d
Summary:
This diff creates the Android OSS build system for the module react/utils
As part of this diff I also moved the module to react/utils folder
changelog: [internal] internal
Reviewed By: JoshuaGross
Differential Revision: D22877265
fbshipit-source-id: 717487aacb392d0f08530763a16a638b8021d501
Summary:
Migrate ScrollView component to use ES6 import
motivation: trying to slowly migrate each files to use es6 import/exports to make this discussion happen
https://github.com/react-native-community/discussions-and-proposals/issues/201#issuecomment-588454552
## Changelog
[General] [Changed] - Use es6 import/export syntax for ScrollView component
Pull Request resolved: https://github.com/facebook/react-native/pull/29184
Test Plan:
Test on RNTester for iOS
currently having trouble starting up RNTester on Android, but will update when I'm able to check on Android
Reviewed By: TheSavior
Differential Revision: D22959782
Pulled By: PeteTheHeat
fbshipit-source-id: c909bddda3b5b2edd26a526eedaa67fadd4c2b51
Summary:
I've used this while debugging LayoutAnimations a few times. It compiles out to nothing when the define is not set.
Changelog: [Internal]
Reviewed By: mdvacca
Differential Revision: D22962113
fbshipit-source-id: 88b7bb1c20a07a7d804e5c81d31cf871d58bee92
Summary:
Consolidated a few places where index adjustment was happening with nearly identical code. There was also one remaining case where index adjustment should be happening, but was not previously.
Changelog: [Internal]
Reviewed By: mdvacca
Differential Revision: D22962115
fbshipit-source-id: 732c026b5a3c60bb0eadb8d49826ffd6367f7f62
Summary:
Improve logging slightly.
One issue I ran into is that the "after" view hierarchy looks identical to "before" unless you schedule for the next UI tick.
Changelog: [Internal]
Reviewed By: mdvacca
Differential Revision: D22962116
fbshipit-source-id: c7a1e16e26d2aebefa3baf3acfef4e133b8fde70
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:
as title. The output of Buck suggested I add this, so I did and it let me build.
Changelog:
[Internal][Fixed] - Added iOS 10 method compatibility macro
Reviewed By: PeteTheHeat
Differential Revision: D22955013
fbshipit-source-id: 6aa03b164adca480e7c6f661b221c9bd3ee6c4f1
Samuel Susla
Joshua Gross
David Vacca
Peter Argany
Rick Hanlon
Marshall Roch
Oleg Lokhvitsky
Jiayan Zhuang
Devon Deonarine
Xuan Huang
Jesse Katsumata
Albert Sun
Nicholas Tinsley