Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46103
Reducing the boundary of rerender of virtual lists. Previously with prop: "strictMode={true}" the VirtualizedList still re rendered each CellRenderer component. Because method getDerivedStateFromProps generated every time a new uniq state and the cells didn’t have a PureComponent. It helps to improve react performance for lists which have 5+ elements.
I reused recomended approach from react doc https://legacy.reactjs.org/blog/2018/06/07/you-probably-dont-need-derived-state.html#what-about-memoization
changelog: [internal]
Optimizing CellRenderer of VirtualizedList
Reviewed By: NickGerleman, sammy-SC
Differential Revision: D61493434
fbshipit-source-id: 917a33e48bd2f18e8ac150e5701d2e7c45dbe879
Summary:
Clean up some dead code after some refactoring of RCTParagraphComponentView. cc cipolleschi
## Changelog:
[IOS] [FIXED] - Clean up RCTParagraphComponentView & RCTParagraphTextView
Pull Request resolved: https://github.com/facebook/react-native/pull/46125
Test Plan: CI green.
Reviewed By: christophpurrer
Differential Revision: D61603193
Pulled By: cipolleschi
fbshipit-source-id: a357e8c5355707b2296462de513010acda4ee6ea
Summary:
In the recent 0.75 release I've noticed new `CONFIG_CMD` option in `react-native-xcode.sh`. But this option was not used. Insted when set `CONFIG_APP` was used.
This seems like a bug. As the usage before this PR would be as follow:
```bash
export CONFIG_CMD=true
export CONFIG_APP="/path/to/node /path/to/node_modules/react-native/cli.js config"
```
After this PR
```
export CONFIG_CMD="/path/to/node /path/to/node_modules/react-native/cli.js config"
```
This PR also removed unused explicite `--config-cmd "$CONFIG"` flag, as this is always overwriten by the code above, by default to `--config-cmd" "$NODE_BINARY $NODE_ARGS $REACT_NATIVE_DIR/cli.js config`.
## Changelog:
<!-- 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
-->
[iOS][Fixed] - Use CONFIG_CMD if set
Pull Request resolved: https://github.com/facebook/react-native/pull/46112
Test Plan: I've set `CONFIG_CMD` and run Xcode Release build to check that the set command is executed.
Reviewed By: christophpurrer
Differential Revision: D61545010
Pulled By: blakef
fbshipit-source-id: ebbf8ebc08404bc6816277518a3b86c6f7e41e6e
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46131
React native 0.75.0, 0.75.1 and 0.75.2 has been published to NPM without the latest tag, despite the tag being on the commit.
When debugging why that's happened, I realized that we were not downloading the tags when checking out the repo.
This change fixes that.
{F1816667285}
## Changelog:
[Internal] - Publish React native as latest when the latest tag is specified on git
Reviewed By: cortinico
Differential Revision: D61593398
fbshipit-source-id: 96bf8346207f0bd0b01f60ee09879210d12d30af
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46132
Temporaily disable the `nativeSourceCodeFetching` capability — which reverts this to the legacy handling in the Inspector Proxy.
This is because we've noticed performance issues when loading large bundle source maps, particularly on Android, with a nontrivial path to optimising this ([raising the frontend `IO.read` size](https://github.com/facebookexperimental/rn-chrome-devtools-frontend/pull/97) further is leading to WebSocket disconnections on Android 😐).
Changelog: [Internal]
Reviewed By: robhogan
Differential Revision: D61543480
fbshipit-source-id: ee66b4cebd40f8cc6466270c5875df744d2b588a
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46113
changelog: [internal]
This showed promised in local tracing but that failed to translate to real perf improvement. Unshipping.
Reviewed By: christophpurrer
Differential Revision: D61537744
fbshipit-source-id: 03a2a69a6fed32a6b493bc17372e3783b9db2d1e
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46122
Implements a JavaScript cache for `colorScheme` in the `Appearance` module, so that we avoid potentially expensive and unnecessary native property accesses.
Changelog:
[General][Changed] - Improved `Appearance.getColorScheme` performance
Reviewed By: rickhanlonii
Differential Revision: D61567880
fbshipit-source-id: ca316946d68114b05239daa17105c85e637efe07
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46120
Currently, the implementation of `Appearance` duplicates the validation logic of string `colorScheme` values multiple times.
This leads to more complicated code and also unnecessary work in certain edge cases (e.g. when `NativeAppearance` is not registered).
This refactors `Appearance` to be simpler and to do less work. I've also configured `NativeAppearance.setColorScheme` to be non-nullable because it has existed since 2023.
Changelog:
[Internal]
Reviewed By: TheSavior
Differential Revision: D61567881
fbshipit-source-id: 61cb51709dc716ad97ae1397105414e74fe57a28
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46121
Updates `Appearance` on Android to supply the native module to `NativeEventEmitter` so that the native listener count can be managed like it is on iOS.
This was previously required by macOS and iOS. Android and Windows also already implement:
```
interface NativeModule {
addListener(eventType: string): void;
removeListeners(count: number): void;
}
```
So we should start passing `NativeAppearance` into the `NativeEventEmitter` constructor across all platforms.
Changelog:
[Internal]
Reviewed By: TheSavior
Differential Revision: D61567883
fbshipit-source-id: 1b3b76de9be3f35cacba1acbc43f6dcc0b41fde5
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45859
"Fabric without SVCs" configuration is nearly gone, and so it doesn't make sense to need to add no-op methods, on normally Paper only code, etc to satisfy native viewconfig. These particular warnings are then more often noise, than things we need to action on.
Checking for native code to be present can also break development where users are using distributed native app, slightly older than JS.
This keeps the warning, only if static viewconfigs are missing native view config attributes (i.e. new prop would only be exposed to Paper, instead of only exposed to Fabric)
Changelog: [Internal]
Reviewed By: javache
Differential Revision: D60575253
fbshipit-source-id: 1c118274b92eb7922c0dd92df060b24e44fceb3d
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46116
If your app raises an early js exception, and you cold start it, often you'll see this error:
```
SurfaceRegistryBinding::startSurface failed. Global was not installed.
```
{F1807125099}
The reason why is because two different threads race to redbox:
* The nativemodule thread: the early js error (reported [here](https://fburl.com/code/vcrqzsdp))
* The javascript thread: the SurfaceRegistryBinding error (a subsequent native -> js call)
After this diff, the early js error will **not jump onto the nativemodule thread** to report this error.
This ensures that we "always" (to the best of my knowledge) see the early js error first.
Changelog: [Internal]
Reviewed By: mdvacca
Differential Revision: D61339213
fbshipit-source-id: f1b9ab30150b87377817c2fd93ca349c406db48b
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46104
We want to use `PrecomputedText` to store glyph-level measurements on underlying Android Spannable. This means we need to consistently reuse the same Spannable, instead of recreating them on measurement.
We have an opaque cache ID used by Android, for spannables originating from uncontrolled TextInput on UI-thread side. We also have `AttributedStringBox`, for a kind of similar purpose on iOS, which allows passing opaque pointer to the `TextLayoutManager`. This is only used for the `measure` function.
This change makes us consistently use `AttributedStringBox` at the TextLayoutManager boundary, to let us migrate calls across TextLayoutManager to all pass opaque handle to underlying Spannable we will store, instead of passing the AttributedString each time. For now, every place previously passing an AttributedString value still passes one.
There were also some egregious cases of accepting very large structures by value, causing unneeded copies. I changed the APIs to accept anything potentially larger than two pointers to pass by reference instead.
This change is technically breaking, to any 3p code calling into TextLayoutManager (IIRC live-markdown exposed prefabs for this, but should be able to adapt fairly easily).
Changelog:
[General][Breaking] - Always use AttributedStringBox instead of AttributedString in TextLayoutManager
Reviewed By: joevilches
Differential Revision: D61484999
fbshipit-source-id: 07c5600cd917f2dab3d24559a25f27e0872ebddc
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46080
1. Force the examples to be alphabetized, where the hand-maintained list has some examples that are not
2. Remove reundant/not useful UI
Changelog: [Internal]
Reviewed By: cortinico
Differential Revision: D61430910
fbshipit-source-id: 1f3e116fe81502faa7a72f2720912e26c9f04bb2
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46076
This will add the shadows to iOS as well. let's see if anyone notices 🙂. I also removed dead styles, and removed some of the extra (excessive) padding specific to Android where the previous shadows would overlap.
Changelog: [Internal]
Reviewed By: rshest
Differential Revision: D61421903
fbshipit-source-id: 887fa5aa96e3b0b4f81114ee814897c218db2b76
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46117
Currently in large cursive blocks like layout effect we can't tell what the slow leaf function is. With this fixed I'm able to root cause more complex issues in layout effects.
Reviewed By: NickGerleman
Differential Revision: D61486415
fbshipit-source-id: 5a4043b35eedcabcbea86953aac2173f66d7257b
Summary:
Fixes these issues:
- https://github.com/facebook/react-native/issues/46070
- https://github.com/facebook/react-native/issues/39362
## Changelog:
<!-- Help reviewers and the release process by writing your own changelog entry.
Pick one each for the category and type tags:
For more details, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests
-->
[ANDROID] [FIXED] - Fixed black strip coming when hiding status bar
`setHidden` function is responsible for hiding status bar
https://github.com/facebook/react-native/blob/25d6a152cc720e0d5f860dab228ac2e43321d9e4/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/modules/statusbar/StatusBarModule.kt#L122
**What real issue is?** **_For android devices with camera area on top a black strip is coming after hidding status bar._**
Previous Implementation:
```
override fun setHidden(hidden: Boolean) {
val activity = currentActivity
if (activity == null) {
Log.w(
ReactConstants.TAG,
"StatusBarModule: Ignored status bar change, current activity is null.")
return
}
UiThreadUtil.runOnUiThread(
Runnable {
val window = activity.window ?: return@Runnable
if (hidden) {
window.addFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN)
window.clearFlags(WindowManager.LayoutParams.FLAG_FORCE_NOT_FULLSCREEN)
} else {
window.addFlags(WindowManager.LayoutParams.FLAG_FORCE_NOT_FULLSCREEN)
window.clearFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN)
}
})
}
```
It seems that FLAG_FULLSCREEN flag are not enough to draw content in camera area.
**Solution:**
In order to tackle this, android exposes 2 flags:
- [layoutInDisplayCutOutMode](https://developer.android.com/reference/android/view/WindowManager.LayoutParams#layoutInDisplayCutoutMode): The window is always allowed to extend into the [DisplayCutout](https://developer.android.com/reference/android/view/DisplayCutout) areas on the short edges of the screen. [Android 9.0 and above]
- [setDecorFitsSystemWindows](https://developer.android.com/reference/android/view/Window#setDecorFitsSystemWindows(boolean)): allows content to be able to extend into the cutout area. [Android 10.0 and above]
By adding this flag we are now able to hide status bar properly.
```
override fun setHidden(hidden: Boolean) {
val activity = currentActivity
if (activity == null) {
FLog.w(
ReactConstants.TAG,
"StatusBarModule: Ignored status bar change, current activity is null.")
return
}
UiThreadUtil.runOnUiThread(
Runnable {
val window = activity.window ?: return@Runnable
if (hidden) {
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.R) {
// Ensure the content extends into the cutout area
window.attributes.layoutInDisplayCutoutMode =
WindowManager.LayoutParams.LAYOUT_IN_DISPLAY_CUTOUT_MODE_SHORT_EDGES
window.setDecorFitsSystemWindows(false)
}
window.addFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN)
window.clearFlags(WindowManager.LayoutParams.FLAG_FORCE_NOT_FULLSCREEN)
} else {
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.R) {
window.attributes.layoutInDisplayCutoutMode =
WindowManager.LayoutParams.LAYOUT_IN_DISPLAY_CUTOUT_MODE_DEFAULT
window.setDecorFitsSystemWindows(true)
}
window.addFlags(WindowManager.LayoutParams.FLAG_FORCE_NOT_FULLSCREEN)
window.clearFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN)
}
})
}
```
**_Note: This will work above Android 11 and above_**
Pull Request resolved: https://github.com/facebook/react-native/pull/46086
Test Plan:
- Tested by author of this issue
- Sharing here the videos of before and after fix
Device Detail:
Oneplus9 5G OS 11
**Before fix:**
https://github.com/user-attachments/assets/589098ff-a3fa-4962-a15b-ceacbfd03d2d
**After fix:**
https://github.com/user-attachments/assets/a87dd8e4-3624-4e09-99da-a14f9e19fcc6
Reviewed By: cipolleschi
Differential Revision: D61509889
Pulled By: alanleedev
fbshipit-source-id: 733962a3bed2efba71588a4d2fdf7c9c386bc3b4
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46101
Remove overriding thread priority for RN Main Thread as it is not possible to update main thread.
changelog: [internal] internal
Reviewed By: javache
Differential Revision: D61448536
fbshipit-source-id: 44ec28a875e3208df042ac11bdd17a7287836ebb
Summary:
Our app is using the react-native v0.74.2 with the `react-navigation` lib for screen navigation, we're facing an issue in the built iOS app that when we try to navigate to a new app screen with the `react-navigation`'s `reset` or `replace` method and meanwhile there's a react native modal displaying, then the iOS app always crashes.
I saw there is already a relevant [PR](https://github.com/facebook/react-native/pull/38491) and discussion targeting this issue, but I still think it would be better if this kind of crash can be suppressed in the framework level, currently I guess it's common in the iOS apps based on react native.
## Changelog:
[IOS] [FIXED] - app crash happening when navigate to a new app screen with a displaying modal
Pull Request resolved: https://github.com/facebook/react-native/pull/45313
Test Plan: More issue details and the reproduction steps can be found in this [PR](https://github.com/facebook/react-native/pull/38491) :)
Reviewed By: christophpurrer
Differential Revision: D61537167
Pulled By: cipolleschi
fbshipit-source-id: 3c0474d794b4216ebc073dd6558d2b6ae27492d2
Summary:
Setting a variable called `REACTNATIVE_MERGED_SO` so libraries/apps can selectively decide to depend on either libreactnative.so or link against a old prefab target (this is needed for React Native 0.76 on).
## Changelog:
[INTERNAL] - Set REACTNATIVE_MERGED_SO for React Native 0.76
Pull Request resolved: https://github.com/facebook/react-native/pull/46114
Test Plan: CI
Reviewed By: hezi
Differential Revision: D61541372
Pulled By: cortinico
fbshipit-source-id: b16fa29ce6dd1670b452848e37cfcd7be15861e6
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46068
This change adds some internal E2E tests to verify that the text is rendered properly on top of a solid background color when borderWidth is set
## Changelog
[Internal] - Add E2E tests
Reviewed By: cortinico
Differential Revision: D61392253
fbshipit-source-id: 76e11821eba96ac75b055c5fe94365197c0f9be2
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46081
This change fixes an issue that has been reported by OSS where a Text with both background color and borderWidth is not rendered properly.
The reason is that `RCTParagraphComponentView` uses the `drawRect` method which draws the text in the main view layer, while the parent `RCTViewComponentView` can apply an extraLayer on top of the base layer, drawing on top of the text.
This change moves the drawing of the text to an auxiliary view, `RCTParagraphTextView`, that is set as contentView of the `RCTParagraphView`. In this way, the text is drawn in a different view and can't be covered by the `_borderLayer`
## Changelog:
[Internal] - Introduce a RCTParagraphTextView to draw the text
Reviewed By: joevilches
Differential Revision: D61431369
fbshipit-source-id: 05467167186411fe42312f2ed956f5b5336de019
Summary:
This diff adds an example in RNTester to verify that we can draw text on top of a colored background and non uniform border radius.
As you can see from the test plan, the current code works well when:
* There is only the background color
* There is a background color and uniform cornerRadius
* There are non uniform border radius but the background is transparent.
The current code **does not** work when:
* there is a background and non-uniform border radius
* there is a background, uniform border radius and borderwidth
The reason why this happens is because:
* `RCTParagraphComponentView` draws the text in the View's main layer in the `drawRect` method
* `RCTViewComponentView` has a method `invalidateLayer` that, when there are non-uniform border radii o there is a borderWidth, it creates an extra `CALayer` with an image as content and that layer is put on top of the base layer, covering the text.
## Changelog
[Internal] - Add example to RNTester
Reviewed By: cortinico
Differential Revision: D61389317
fbshipit-source-id: 3e0a9e6c611190f90198a1b0b5855431b9f6ed12
Summary:
bypass-github-export-checks
Covers the case of an immediately-resolved breakpoint in `JsiIntegrationTest`, complementing the existing `ResolveBreakpointAfterReload` case.
Changelog: [Internal]
Reviewed By: robhogan
Differential Revision: D61468055
fbshipit-source-id: 0f68656a2558166f1302163d14722c17c590044b
Summary:
- Color stops needs to follow [fix up spec](https://drafts.csswg.org/css-images-4/#color-stop-fixup)
- Adds multiple stops syntax support. e.g. linear-gradient(red 30% 50%, green).
- Rename `position` to `positions` in object style API. Optional string array here makes more sense. We'll add number array support once `px` support is added. Will do it as a follow up to this PR.
TODOs: transition hint syntax support `linear-gradient(red, 50%, green)` (Done locally, dependent on this PR). `px` support.
## Changelog:
[GENERAL] [FIXED] - Linear gradient color stop spec.
<!-- Help reviewers and the release process by writing your own changelog entry.
Pick one each for the category and type tags:
For more details, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests
Pull Request resolved: https://github.com/facebook/react-native/pull/45969
Test Plan: - Added testcases in processBackgroundImage-test.js
Reviewed By: javache
Differential Revision: D61309203
Pulled By: NickGerleman
fbshipit-source-id: 884052c6841320048933361f38e6478ff4192736
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45965
X-link: https://github.com/facebook/yoga/pull/1687
We are seeing some crashes that are hard to wrap our head around. Lets add more logs. I chose these values based on what could make the height/width undefined from looking at the code. We might need more but this should give us some more direction.
Changelog: [Internal]
Reviewed By: NickGerleman
Differential Revision: D61054392
fbshipit-source-id: 654ff96f94aa89605a603e2e36335bb48b61f4a2
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46006
Adding some extra examples for mix-blend-mode
And added E2E tests for each mix-blend-mode example
Changelog: [Internal]
Reviewed By: NickGerleman
Differential Revision: D60605636
fbshipit-source-id: 553f3a2c3b971c918530bdee5a73108c22bd936e
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46097
I've noticed we still have some tests here and there that were not migrated to AssertJ. This finishes them all.
Changelog:
[Internal] [Changed] - Finalize AssertJ migration
Reviewed By: javache
Differential Revision: D61473682
fbshipit-source-id: 3d51bfeb0e5ba3fd8cd4f3667dc88de3d88a3dbc
Summary:
## Summary
There are old references to the react-native/template. This code has
moved to react-native-community/template.
Changelog: [Internal]
Pull Request resolved: https://github.com/facebook/react-native/pull/46082
Test Plan:
CI
closesfacebook/metro#1324
Reviewed By: cipolleschi
Differential Revision: D61472439
Pulled By: blakef
fbshipit-source-id: fc40145c03002a7c3117b72d07981a96aa3d8760
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46074
This brings over the changes made to OutsetBoxShadowDrawable. Namely
1. Removing reliance on CSSBackgroundDrawable for drawing paths
2. Using BlurMaskFilter instead of RenderEffect
3. Removing RenderNode usage
This should make the implementation, more reliable less memory intensive for large boxes, and compatible down to Android API 29. I changed previous gating to allow outset shadows for 28+, and inset for 29+.
Changelog:
[Android][Changed] - Revamp InsetBoxShadowDrawable
Reviewed By: joevilches
Differential Revision: D61348615
fbshipit-source-id: 97b63b5dce65224ca54b76c5318c219973fc09fa
David Vacca
Andrei Marchenko
zhongwuzw
Soe Lynn
Krystof Woldrich
Riccardo Cipolleschi
Alex Hunt
Samuel Susla
Tim Yung
Nick Gerleman
Ramanpreet Nara
generatedunixname89002005232357
Benoit Girard
Alan Lee
shubhamguptadream11
Zhi Zhou
Ingrid Wang
Nicola Corti
Blake Friedman
Moti Zilberman
Raman Gupta
Phillip Pan
Nishan
Joe Vilches
Jorge Cabiedes Acosta
Christoph Purrer
Sam Zhou