Summary:
This removes the null-check on Yoga config added (we think we root-caused the issue), and adds an assertion to the public API accepting a config that it is non-null.
There are more changes to config setting that will come later.
Changelog:
[Internal]
Reviewed By: javache
Differential Revision: D43273456
fbshipit-source-id: cba498352d114a3fa2694f3a144f5f01a83d3190
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/36146
Changelog: [Internal]
- While working on 0.71.3, it was discovered that `react-native-codegen` package is being published almost empty (without `lib` folder)
- The reason for it is that `prepare` script is not being executed
- The main reason for it is npm v6, which requires adding `unsafe-perm` flag for it: https://www.vinayraghu.com/blog/npm-unsafe-perm
- Instead of using this flag, changing executor to `nodelts`, which has node v18 and npm v8
- Also adding `run_yarn` before running the script, because `react-native/codegen` uses external dependencies (such as rimraf) for its build scripts
Reviewed By: cipolleschi
Differential Revision: D43248175
fbshipit-source-id: d12b93decbf408713e309fe8be75d8d5ec994868
Summary:
When the node version could not be found there is an error message shown to help what can be done to fix this issue (for example in the error logs in xcode)
The problem was that the backtick symbol is interpreted as running commands in terminals so the parts that were in backticks were run and the error message was printed incompletely. Also there were other errors added (.xcode.env command not found, for example) which makes it harder to understand what is going on.
In bash / zsh single quotes does not expand commands and variables unlike double quotes which does this.
## Changelog
[IOS] [FIXED] - Fix missing node error message not printed correctly when deprecated `find-node-for-xcode.sh` is used.
Pull Request resolved: https://github.com/facebook/react-native/pull/36140
Test Plan:
I just ran the xcode build again after updating it manually in the node_modules folder.
The log output changed from this
```
[Warning] You need to configure your node path in the environment. You can set it up quickly by running: echo 'export NODE_BINARY=/Users/uloco/Library/Caches/fnm_multishells/78434_1676301546457/bin/node' > .xcode.env in the ios folder. This is needed by React Native to work correctly. We fallback to the DEPRECATED behavior of finding . This will be REMOVED in a future version. You can read more about this here: https://reactnative.dev/docs/environment-setup#optional-configuring-your-environment
```
to this
```
[Warning] You need to configure your node path in the `".xcode.env" file` environment. You can set it up quickly by running: `echo export NODE_BINARY=$(command -v node) > .xcode.env` in the ios folder. This is needed by React Native to work correctly. We fallback to the DEPRECATED behavior of finding `node`. This will be REMOVED in a future version. You can read more about this here: https://reactnative.dev/docs/environment-setup#optional-configuring-your-environment
```
Reviewed By: cortinico, cipolleschi
Differential Revision: D43258623
Pulled By: rshest
fbshipit-source-id: 7db0d983b204e59504666686be78311c4c2fb993
Summary:
Adds changelog for new patch.
## Changelog
<!-- Help reviewers and the release process by writing your own changelog entry. For an example, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests
-->
[Internal] [Changed] - add changelog entry for 0.71.3
Pull Request resolved: https://github.com/facebook/react-native/pull/36149
Test Plan: N/A
Reviewed By: dmytrorykun
Differential Revision: D43272716
Pulled By: cipolleschi
fbshipit-source-id: 58ca3f598aa6a23092902ab6317b01d6915e74e9
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/36143
Changelog: [Internal]
Currently, some `__tests__` are included in `react-native/virtualized-lists`, added them to ignore list, so that we will remove it in the next publish
Reviewed By: christophpurrer
Differential Revision: D43159337
fbshipit-source-id: 27ed0adf85387a2e8ac902da57888f0b188b0b91
Summary:
This diff adds `TraceUpdateOverlay` native component to render highlights when trace update is detected from React JS. This allows a highlight border to be rendered outside of the component with re-renders.
- Created `TraceUpdateOverlay` native component and added to the `DebugCorePackage`
- Added to C++ registry so it's compatible with Fabric
- Added to `AppContainer` for all RN apps when global devtools hook is available
Changelog:
[Android][Internal] - Add trace update overlay to show re-render highlights
Reviewed By: javache
Differential Revision: D42831719
fbshipit-source-id: 30c2e24859a316c27700270087a0d7779d7ad8ed
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/36030
Generate enum types in c++ turbo modules.
For enums in the ts schema file such as:
```
export enum NumEnum {
ONE = 1,
TWO = 2,
}
```
This would export enums and the relevant Bridging to js and from js code to the spec H files such as:
```
#pragma mark - SampleTurboModuleCxxNumEnum
enum SampleTurboModuleCxxNumEnum { ONE, TWO };
template <>
struct Bridging<SampleTurboModuleCxxNumEnum> {
static SampleTurboModuleCxxNumEnum fromJs(jsi::Runtime &rt, int32_t value) {
if (value == 1) {
return SampleTurboModuleCxxNumEnum::ONE;
} else if (value == 2) {
return SampleTurboModuleCxxNumEnum::TWO;
} else {
throw jsi::JSError(rt, "No appropriate enum member found for value");
}
}
static jsi::Value toJs(jsi::Runtime &rt, SampleTurboModuleCxxNumEnum value) {
if (value == SampleTurboModuleCxxNumEnum::ONE) {
return bridging::toJs(rt, 1);
} else if (value == SampleTurboModuleCxxNumEnum::TWO) {
return bridging::toJs(rt, 2);
} else {
throw jsi::JSError(rt, "No appropriate enum member found for enum value");
}
}
};
```
That code would allow us to use these enums in the cxx files like this:
```
NativeCxxModuleExampleCxxEnumInt getNumEnum(
jsi::Runtime &rt,
NativeCxxModuleExampleCxxEnumInt arg);
```
Changelog: [General] [Added] Generate enum types that would be allowed to be used as well as string/number in c++ turbo modules generators
Reviewed By: christophpurrer
Differential Revision: D42884147
fbshipit-source-id: d34d1fc7ba268b570821dc108444196f69a431b2
Summary: Changelog: [Internal] - Ensure pointer move tracking is applied to movement while the pointer is pressed
Reviewed By: javache
Differential Revision: D42977052
fbshipit-source-id: 2d48c35a908449d0b2338c33273fb75a430bc393
Summary:
Hi 👋
I'm one of the Expo contributors. When upgrading the Stripe dependency in Expo for SDK48 release on Android, we noticed the following error:
```java.lang.ClassCastException: android.view.ContextThemeWrapper cannot be cast to android.app.Activity```
With Kudo we narrowed it down to an underlying issue in the following cast in `ReactRootView` done during checking for keyboard events:
```((Activity) getContext())```
The `getContext()` is actually a `ContextThemeWrapper` for `ExperienceActivity`, so we should not cast it to an `Activity` directly - instead, we unwrap it using `getBaseContext()`.
Implementing the following fix into the Expo fork fixed the crash for us:
https://github.com/expo/react-native/commit/0e2c9cada120a3709e8285ab4bcdaa1c5c446732
## Changelog
[ANDROID] [FIXED] - Fixed crash occurring in certain native views when handling keyboard events.
<!-- Help reviewers and the release process by writing your own changelog entry.
Pick one each for the category and type tags:
[ANDROID|GENERAL|IOS|INTERNAL] [BREAKING|ADDED|CHANGED|DEPRECATED|REMOVED|FIXED|SECURITY] - Message
For more details, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests
-->
Pull Request resolved: https://github.com/facebook/react-native/pull/36121
Test Plan:
Tested manually by comparing two builds before and after this change. The main branch build crashes when the [Stripe 0.23.1](https://github.com/stripe/stripe-react-native) Card Element from the example app is mounted on screen. Applying the change fixed the issue.
Happy to make a more isolated reproduction if necessary.
---
Full stack trace:
```
AndroidRuntime D Shutting down VM
E FATAL EXCEPTION: main
E Process: host.exp.exponent, PID: 8849
E java.lang.ClassCastException: android.view.ContextThemeWrapper cannot be cast to android.app.Activity
E at com.facebook.react.ReactRootView$CustomGlobalLayoutListener.checkForKeyboardEvents(ReactRootView.java:937)
E at com.facebook.react.ReactRootView$CustomGlobalLayoutListener.onGlobalLayout(ReactRootView.java:913)
E at android.view.ViewTreeObserver.dispatchOnGlobalLayout(ViewTreeObserver.java:1061)
E at android.view.ViewRootImpl.performTraversals(ViewRootImpl.java:3352)
E at android.view.ViewRootImpl.doTraversal(ViewRootImpl.java:2286)
E at android.view.ViewRootImpl$TraversalRunnable.run(ViewRootImpl.java:8948)
E at android.view.Choreographer$CallbackRecord.run(Choreographer.java:1231)
E at android.view.Choreographer$CallbackRecord.run(Choreographer.java:1239)
E at android.view.Choreographer.doCallbacks(Choreographer.java:899)
E at android.view.Choreographer.doFrame(Choreographer.java:832)
E at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:1214)
E at android.os.Handler.handleCallback(Handler.java:942)
E at android.os.Handler.dispatchMessage(Handler.java:99)
E at android.os.Looper.loopOnce(Looper.java:201)
E at android.os.Looper.loop(Looper.java:288)
E at android.app.ActivityThread.main(ActivityThread.java:7898)
E at java.lang.reflect.Method.invoke(Native Method)
E at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:548)
E at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:936)
```
Reviewed By: cortinico
Differential Revision: D43186530
Pulled By: javache
fbshipit-source-id: 2143495f6b0c71f342eba6d5abb2bfa4a529fbdd
Summary:
This diff upgrade dependencies to `react-devtools-core` to 4.27.2, which includes changes I need to unblock trace update highlights.
- Update package.json file for dependencies in all existing deps with latest version (4.26.1): https://fburl.com/code/litgze0m
- Run `yarn` under `xplat/js` and `xplat/js/public`
Changelog:
[General][Internal] - Upgrade react-devtools-core to 4.27.2
Reviewed By: javache
Differential Revision: D43176345
fbshipit-source-id: 8bd5a9eca286bbfbb1630cb92c15f9653fa3534a
Summary:
[Changelog][Internal]
`NativePerformanceObserver` TurboModule API would get the type for performance entries as strings in one direction (`start/stopReporting`) and as integers in another direction (inside `RawPerformanceEntry`, for optimization on the native side).
This makes is symmetrical and consistent, all the conversions are now handled on the JS side.
Reviewed By: christophpurrer
Differential Revision: D43236466
fbshipit-source-id: 08e1b62df90e6d26a11577d6b6b1d91a6bce8339
Summary:
This annotation is missing it's retention policy which should be `SOURCE` as it's an IntDef and not used at runtime.
Changelog:
[Internal] [Changed] - Add missing retention policy on EventCategoryDef annotation
Created from CodeHub with https://fburl.com/edit-in-codehub
Reviewed By: cipolleschi
Differential Revision: D43187398
fbshipit-source-id: d00bc3a5cf74d2eb983fa7369905e2260db80142
Summary:
Our stale bot is at capacity and reaches quota, resulting in marking as stale 2/3 issues a day.
I'm increasing the frequency of the bot to 4 times a day.
## Changelog
Changelog:
[Internal] [Changed] - Stale issues more frequently (4 times a day)
Pull Request resolved: https://github.com/facebook/react-native/pull/36130
Test Plan: nothing to test
Reviewed By: cipolleschi
Differential Revision: D43207979
Pulled By: cortinico
fbshipit-source-id: 1de45315e724ddf9afdb9426eddc639875ba0b24
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/36137
This change stabilize the build for Hermes in CI, making it more robust in case the rename step fails or the wrong params are passed to hermes.
## Changelog:
[internal] - Update Hermes build logic
Reviewed By: cortinico
Differential Revision: D43232941
fbshipit-source-id: 1121716c69dd3ca247ffeaed57e0d4dfd5daca84
Summary:
Our first party modules are still using `namespace`. This cleans this up.
The Manifest file for ReactAndroid is also not needed anymore. The one
from hermes-engine can also be removed from facebook/hermes in a separate diff.
Changelog:
[Internal] [Changed] - Use namespace for ReactAndroid and hermes-engine
Reviewed By: cipolleschi
Differential Revision: D43198514
fbshipit-source-id: d988cfa81ecc4484b6b2add4ae2c1d9376febc3e
Summary:
Add minimum necessary .d.ts files to react-native-codegen.
I found .d.ts files will be copied to `lib` so I guess no additional script is needed.
## Changelog
[GENERAL] [CHANGED] - Add minimum necessary .d.ts files to react-native-codegen
Pull Request resolved: https://github.com/facebook/react-native/pull/36102
Test Plan: `npm run build` in `packages/react-native-codegen` and see all .d.ts files appear in `lib`.
Reviewed By: cortinico
Differential Revision: D43157233
Pulled By: cipolleschi
fbshipit-source-id: 6f122f0f4cda693ba22af6dd534e9d34d069ecac
Summary:
See code comment. D42282358 (https://github.com/facebook/react-native/commit/e55277c3310d8f6b712a57f80589cfe91ed35553) added usage of `YGConfigIsExperimentalFeatureEnabled` during layout, in a place where we sometimes encounter a Yoga node from RN which has an unexpectedly null config.
This is a hack to stop the bleed while we add logging to figure out where the null config is coming from in RN.
Changelog: [Internal]
Reviewed By: rozele
Differential Revision: D43203521
fbshipit-source-id: 2a21143a45c712ca00d16172f734fb116d165926
Summary:
After a [change](https://github.com/facebook/hermes/commit/4ff7c31fb43f534947cca591e1f156d8c45aef9c) that landed on Hermes, the build script for Hermes generated an invalid dSYM name for Catalyst builds, which make our CI fail.
This PR aims to patch it while the Hermes team works on a long term fix for it.
The CI will go back to red as soon as that happen, but in that case, we will just need to revert this change. But, at least, we can go back to a green state for CircleCI.
## Changelog
[Internal] - update Hermes build script to be more resilient from dSYM names
Pull Request resolved: https://github.com/facebook/react-native/pull/36126
Test Plan: CircleCI is green
Reviewed By: cortinico
Differential Revision: D43193705
Pulled By: cipolleschi
fbshipit-source-id: a349dde8556564dacf4852f050610ae59139ffd8
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/36128
This commit fixes a problem which is making harder to use the New Architecture in monorepos.
Specifically if a user specifies a `codegenDir` in their app, libraries should honor it.
This is not the case today.
The fix is to register an extension on the root project which will "pass" values from app
to libraries.
I've also cleaned up some of the logic in `readPackageJsonFile` function restricting
the access to those functions only to `.root` which is the only field they're accessing.
Fixes#35495
Changelog:
[Android] [Fixed] - Better Monorepo support for New Architecture
Reviewed By: cipolleschi
Differential Revision: D43186767
fbshipit-source-id: 5c5ca39397306120b6b6622cb728633bd331e021
Summary:
In our build logic we're mixing `plugins{}` and `buildscript{}`
which have unpredictable side-effect on the build classpath.
I'm moving over everything to use `plugins{}`. This is possible now
that we don't use build from source for New Architecture anymore.
Changelog:
[Internal] [Changed] - Do not use a mixture of plugins{} and buildscript{}
allow-large-files
Reviewed By: cipolleschi
Differential Revision: D43186768
fbshipit-source-id: dcd115bd9d7aadf5cb837b3a28598e274a092873
Summary:
changelog: [internal]
There was a bug in prop parsing where `accessibilityRole` and `accessibilityTraits` had wrong default value. Instead of falling back to sourceProps, they would set role to empty and trait to none. The fix is to fall back to sourceProps.
The issue surfaces with Animated, which clones props.
Reviewed By: cipolleschi
Differential Revision: D43190775
fbshipit-source-id: ec6b48c082c1dcc5b6e81dbff4f92b3a58a41da2
Summary:
Changelog:
[Internal] [Changed] - Remove unused variable in a test in RNGP
Created from CodeHub with https://fburl.com/edit-in-codehub
Reviewed By: cipolleschi
Differential Revision: D43185910
fbshipit-source-id: b1f328592e0b38654fd2e0a36304ce8f1d433b44
Summary:
When working on Dynamic Type, I accidentally referred to it as "Dynamic Text" in some of the documentation. This is just a minor cleanup bit.
## Changelog
[IOS] [FIXED] - Fix typo in documentation
Pull Request resolved: https://github.com/facebook/react-native/pull/36113
Test Plan: Non-functional change, no testing should be needed :-)
Reviewed By: javache
Differential Revision: D43184999
Pulled By: cortinico
fbshipit-source-id: ed057e48289ae6037637bacecb20b8dd58c1d8b5
Summary:
Fix typo in the initialNumToRenderOrDefault description's comment : function's parameter should be this.props.initialNumToRender instead of this.props.initialNumToRenderOrDefault
## Changelog
[GENERAL] [FIXED] - Fixed typo in the initialNumToRenderOrDefault description's comment
Pull Request resolved: https://github.com/facebook/react-native/pull/36110
Test Plan: Typo in a comment - no testing required
Reviewed By: christophpurrer
Differential Revision: D43160548
Pulled By: cortinico
fbshipit-source-id: 0555c7752102f431fb327b920434faaf4de4ff81
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/36107
Having concurrentRoot disabled when Fabric is enabled is not recommended.
This simplifies the setup and makes sure that both are either enabled or disabled.
Changelog:
[Android] [Breaking] - Hardcode concurrentRootEnabled to true when Fabric is enabled
Reviewed By: cipolleschi
Differential Revision: D43127625
fbshipit-source-id: 88e5e800b55d5df228fb072bedf8533b0ab6c20d
Summary:
Changelog: [Internal] Replace assert calls with RCTAssert in RCTSurfaceTouchHandler
We've been recieving crash report tasks related to these calls but it appears (based on D19221204 (https://github.com/facebook/react-native/commit/23d2a6248c9ce1e3b969e3b8fae0ae43c549db93)) that the expectation was that these should be stripped in production and don't cause real problems. RCTAssert does not have that same issue.
Reviewed By: fkgozali
Differential Revision: D43167817
fbshipit-source-id: 45b1b4a3060cfd1e01356c003d63fa4b91c4222a
Summary:
I encountered build error when using performance API in catalyst android mobile app. The error message P617433618 points at using non-const `std::strlen` API in a `constexpr`.
```
$ buck install catalyst-android
...
stderr: xplat/js/react-native-github/Libraries/WebPerformance/PerformanceEntryReporter.cpp:208:13: error: constexpr constructor never produces a constant expression [-Winvalid-constexpr]
constexpr StrKey(const char *s)
^
xplat/js/react-native-github/Libraries/WebPerformance/PerformanceEntryReporter.cpp:209:39: note: non-constexpr function 'strlen' cannot be used in a constant expression
: key(folly::hash::fnv32_buf(s, std::strlen(s))) {}
```
Changelog:
[General][Fixed] - Fixed string key calculation in constexpr from Performance C++ native module.
Reviewed By: javache
Differential Revision: D43136624
fbshipit-source-id: c691671b157b507745c67a505c91f75cf6b878d1
Summary:
Changelog:
[iOS][Fixed] - Unrecognized fontFamily values no longer trigger a redbox
## Context
We are starting to roll out a new consistent approach to style errors in React Native, where malformed or semantically invalid style values will never be treated as runtime errors. Instead, bad style values will consistently fall back to known defaults; the incorrect visual rendering will serve as the main runtime diagnostic for developers. We will advise developers to rely on static types for additional diagnostics.
This work will take place over multiple commits and possibly multiple releases of React Native.
## This diff
Here we fix this issue as it applies to the `fontFamily` style prop. The legacy (Paper) renderer on iOS is the only concrete implementation that had to change. Fabric and Android already implement the correct behaviour.
h/t EvanBacon for the report: https://twitter.com/Baconbrix/status/1623039650775371792
Reviewed By: huntie
Differential Revision: D43159284
fbshipit-source-id: 6afeef3abc5781e18671708f642073d25f2347e9
Summary:
D42721684 (https://github.com/facebook/react-native/commit/be69c8b5a77ae60cced1b2af64e48b90d9955be5) left a pretty bad bug when using Fabric for Android. I missed that in Fabric specifically, on edit we will cache the Spannable backing the EditText for use in future measurement.
Because we've stripped the sizing spans, Spannable measurement has incorrect font size, and the TextInput size will change (collapsing) after the first edit. This effectively breaks any uncontrolled TextInput which does not have explicit dimensions set.
Changelog:
[Android][Fixed] - Fix measurement of uncontrolled TextInput after edit
Reviewed By: sammy-SC
Differential Revision: D43158407
fbshipit-source-id: 51602eab06c9a50e2b60ef0ed87bdb4df025e51e
Summary:
This adds the `DOMRect` and `DOMRectReadOnly` classes to React Native, mostly following the Web spec.
This is a requirement for `node.getBoundingClientRect()`, which we'll implement in React (in https://github.com/facebook/react/blob/main/packages/react-native-renderer/src/ReactFabricHostConfig.js#L134-L323).
Changelog: [General][Added] - Added Web-compatible `DOMRect` and `DOMRectReadOnly` classes to the global scope.
Reviewed By: ryancat
Differential Revision: D42963222
fbshipit-source-id: bf2ed15bfbfd71822cb6f969f8cc0a67c7834333
Summary:
This declares a few globals that were missing in our `global.js` Flow declaration file:
* `process`
* `performance` with its current definition. We'll replace it with the new API when we replace `setupPerformance` with `setupWebPerformance`.
* `navigator`
* `setImmediate`
* `clearImmediate`
Eventually we should stop including all DOM definitions that Flow provides out of the box and define only what we provide (which is pretty much this file).
Changelog: [Internal]
Reviewed By: christophpurrer
Differential Revision: D42964772
fbshipit-source-id: 6156968e8a9d193e7068d8a5043aa682ad45bba1
Summary:
This test is flaky on Windows only on CI, so I'm disabling it as we cover this
test already on other platforms.
Changelog:
[Internal] [Changed] - Disable a /Libraries/Pressability test on Windows only
Reviewed By: yungsters
Differential Revision: D43153475
fbshipit-source-id: 861a31fbbf3c14f2af95ca3ffd40737ef975048b
Summary:
This mitigates some of the failures we're seeing inside the docker containers
where we're receiving 50x when trying to download native sources.
Changelog:
[Internal] [Changed] - Setup retries on Gradle donwload tasks
Reviewed By: cipolleschi
Differential Revision: D43155926
fbshipit-source-id: fa2266b3f5de48faefad37d6239f54f13481cd5f
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/36106
Having `concurrentRoot` disabled when Fabric is enabled is not recommended.
This simplifies the setup and makes sure that both are either enabled or disabled.
## Changelog:
[iOS] [Breaking] - Hardcode concurrentRootEnabled to `true` when Fabric is enabled
Reviewed By: cortinico
Differential Revision: D43153402
fbshipit-source-id: d67aeb3413dbdf2430381aa44ede47ed00db32c6
Summary:
Fixes https://github.com/facebook/react-native/issues/36097
When building RNTester with the old architecture, we skip a call to `build_codegen`, which will build the JS package at `packages/react-native-codegen`. This is needed for the Xcode Script phase `Generate Specs`. This causes a build with fabric disabled to fail. We can fix this by ensuring we call `build_codegen` in both paper and fabric.
We've had this change in React Native macOS already since 0.68: https://github.com/microsoft/react-native-macos/commit/1175372ffecf6b4e18fa27b75b68f3ec7967a384
## Changelog
[IOS] [FIXED] - Build codegen package while using old architecture
Pull Request resolved: https://github.com/facebook/react-native/pull/36098
Test Plan:
CI should suffice. Locally built RN-Tester without fabric with and without my change to show that disabling fabric will only succeed with this change included.
While running `pod install`, you should now see this extra line with the old architecture:
> [Codegen] building ./../../packages/react-native-codegen.
Reviewed By: cortinico
Differential Revision: D43152692
Pulled By: cipolleschi
fbshipit-source-id: 2cf3002f07eaad442ccb0272831fe2de58ec9c1a
Summary:
changelog: [internal]
`useLayoutEffect` has two guarantees which React Native breaks:
- Layout metrics are ready.
- Updates triggered inside `useLayoutEffect` are applied before paint. State between first commit and update is not shown on the screen.
React Native breaks the first guarantee because it uses Background Executor. Background executor moves Yoga layout to another thread. If user core reads layout metrics in `useLayoutEffect` hook, it is a race. The information might be there, or it might not. They can even read partially update information. This diff does not affect this. We already have a way to turn off Background Executor. We haven't done this because it introduces regressions on one screen but we have a solution for that.
React Native breaks the second guarantee. After Fabric's commit phase, Fabric moves to mounting the changes right away. In this diff, we queue the mounting phase and give React a chance to change what is committed to the screen. To do that, we schedule a task with user blocking priority in `RuntimeScheduler`. React, if there is an update in `useLayoutEffect`, schedules a task in the scheduler with higher priority and stops the mounting phase.
We are not delaying mounting, this just gives React a chance to interrupt it.
Fabric commit phase may be triggered by different mechanisms. C++ state update, surface tear down, template update (not used atm), setNativeProps, to name a few. Fabric only needs to block paint if commit originates from React. Otherwise the scheduling is wrong and we will get into undefined behaviour land.
Rollout:
This change is gated behind `react_fabric:block_paint_for_use_layout_effect` and will be rolled out incrementally.
Reviewed By: javache
Differential Revision: D43083051
fbshipit-source-id: bb494cf56a11763e38dce7ba0093c4dafdd8bf43
Nick Gerleman
Ruslan Lesiutin
Umut Topuzoğlu
Lorenzo Sciandra
szymonrybczak
Xin Chen
Vitali Zaidman
Vincent Riemer
aleqsio
Christoph Purrer
Ruslan Shestopalyuk
Nicola Corti
Nicola Corti
Riccardo Cipolleschi
Zihan Chen (MSFT)
Riccardo Cipolleschi
Samuel Susla
Adam Gleitman
Skander Ellouze
Tomek Zawadzki
Moti Zilberman
Rubén Norte
Saad Najmi
Pieter De Baets