Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50958
In rn-tester package there are many react-native deep imports which will be deprecated in the future. It is a starter for migrating rn-tester to using root imports instead. Only deep imports that are already root exported are changed. This diff avoids using `CodegenTypes` as it causes build errors and will be resolved in next stages.
Besides import changes, `PointerEvent` type is now also exported from the root.
Changelog:
[Internal]
Reviewed By: huntie
Differential Revision: D73656526
fbshipit-source-id: 5814a3d9c6a04b1236581dbbe291cd109e2c71c0
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50957
Changelog: [internal]
Now we can use the higher level API for event dispatching in this test.
Reviewed By: javache
Differential Revision: D73663626
fbshipit-source-id: 961af26f62128f093c71ad14f457ac8544348415
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50903
For now we do not change the way this module is exported to prevent breaking changes (due to high usage in external packages). It is a tentative mitigation - this case requires more discussion and what could be sufficient. The `no-deep-imports` rule and plugin shouldn't emit a warning when encountered.
Changelog:
[Internal]
Reviewed By: huntie
Differential Revision: D73590627
fbshipit-source-id: 6f85c52373ee6c7c538c632b55cd9e0b9357f2a3
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50932
Add a warning for LegacyArch users that are providing a ViewManager with a corresponding shadow node that implements the `YogaMeasureFunction`.
For those users, we know that the ViewManager is most likely not working on the NewArch (unless they have a backward compat ViewManager with a C++ shadow node implementation).
Changelog:
[Android] [Added] - Warn Legacy Arch users if they use a Component with a ShadowNode with `YogaMeasureFunction.measure()` function. That Component will stop working on NewArch.
Reviewed By: javache
Differential Revision: D73654273
fbshipit-source-id: 70d232434f94bc2a6970379d566b276f73850fce
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50939
Redesigns React Native's `NewAppScreen` component, and moves it into a new `react-native/new-app-screen` package with a single component export. Deletes the old New App Screen under `'react-native/Libraries/NewAppScreen/'`.
{F1977434404}
**Motivation**
- **Reduces our public API** (see https://github.com/react-native-community/discussions-and-proposals/pull/894)
- Separates this screen from the main `react-native` package, where it was a number of subpath exports.
- Reduces the size of the main `react-native` package, including image assets — which are redundant for consumers like Expo.
- **Updated visual treatment**
- Replace outdated logo, update to a responsive tablet/windowed layout.
- Removes outdated guidance (e.g. "use cmd+R to reload"), and generally simplifies the layout (with the aim of reducing future maintenance).
- **Simplifies template boilerplate**
- `NewAppScreen` is now a fully encapsulated screen layout, avoiding the cruft of the previous modular design.
**Integration plan**
When we cut the `0.80-stable` branch, we'll update [the template](https://github.com/react-native-community/template/blob/main/template/App.tsx) to import and use `<NewAppScreen />`.
- This will cause an extra runtime dependency in the template `package.json`, which will require user cleanup. We are happy with this tradeoff, given the self-evident package name, reduction of template boilerplate, and size reduction on the main `react-native` package.
Changelog:
[General][Breaking] - The `NewAppScreen` component is redesigned and moved to the `react-native/new-app-screen` package
Reviewed By: cipolleschi
Differential Revision: D73657878
fbshipit-source-id: 9ca07afa9fbdd6f32015eafa2f27d52ed182918e
Summary:
This PR makes sure that monitor-new-issues runs only in the main repo. It was failing on my fork and spamming notifications.
## Changelog:
[INTERNAL] [FIXED] - run monitor-new-issues only in the main repo
Pull Request resolved: https://github.com/facebook/react-native/pull/50951
Test Plan: CI Green
Reviewed By: cipolleschi
Differential Revision: D73763006
Pulled By: cortinico
fbshipit-source-id: cbb22f8804448b41de970d3d11930110b353994f
Summary:
For real this time, the change was lost due to some merge conflict
Changelog: [Internal]
Reviewed By: Abbondanzo
Differential Revision: D73726167
fbshipit-source-id: 1e0cef75f59a166d795922266365b2b7b060472e
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50872
NOTE: Resubmission of D71968187.
Define `"exports"` field on the main `react-native` package.
**Notes**
Module resolution should be equivalent to the previous implicit `"main"` field (backwards compatible).
- Exports all module subpaths to JavaScript (Flow) source files, with and without `.js` suffix (unchanged ✅)
- These are restricted to the `flow/` and `Libraries/` subdirectories (ℹ️ this should be unchanged, matching any JS imports apps may have today)
- Still includes 3P integration scripts such as `./jest-preset.js` and `./rn-get-polyfills.js` (unchanged ✅)
- Exports `./package.json` (unchanged ✅)
- TypeScript should:
- fall back to the `"types"` field (unchanged ✅)
- OR to `"."`,`"./*"` when Package Exports support is enabled via `compilerOptions`, and use the *adjacent `.d.ts` file* (unchanged ✅)
Changelog:
[General][Breaking] - The `react-native` package now defines package.json `"exports"`.
- While these expose existing JavaScript and TypeScript modules, this change may affect deep imports of non-JS files via Node in third party tools.
- Jest mocks to a `react-native` subpath will need to be updated to match the import path used in your code.
- Imports from `src/` and `src/private/` directories are disallowed.
Reviewed By: robhogan
Differential Revision: D72228547
fbshipit-source-id: d50d6e556d32a9cf2f90855a562e61549853acb9
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50855
This diff addresses a crash caused by view duplication in React Native Android. The issue occurred when a view was not already clipped and was laid out again, resulting in duplicated views.
This problem was particularly noticeable when using nested FlatLists, which triggered a custom focus search with an incomplete and buggy duplicated FlatList container view.
The fix involves preventing the duplication of views by checking if a view is clipped already before laying it out again. Additionally, this diff includes two other improvements:
- Preventing clipping issues: When a view is nested within a non-ReactClippingViewGroup ancestor, focus searching would fail due to the needUpdateClippingRecursive logic only running on instances of ReactClippingViewGroup. By excluding these ancestors, we ensure that the next focusable view can be properly excluded from being clipped.
- Minor fix: A minor fix was made to prevent potential issues in deeply nested cases.
- Add a Kill switch with a feature flag and mobile config combo.
Reviewed By: joevilches
Differential Revision: D73471780
fbshipit-source-id: efbb968600f21b24ab1fa32222d555f346fb336e
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50936
D63141469 introduced an option to use HSR Core's trace macros for profiling react. I believe this was to enable Tracy support. However, the consequence of this is that hsr core is statically linked twice into Worlds, once in libclient_server_android.so and once into libxplat_js_react-native-github_packages_react-native_ReactCxxPlatform_react_profiling_profiling.so.
It isn't obvious that this causes any problems, but it does result in some weirdness with regard to symbol interposition between the two shared libraries. Some tracing categories are registered twice in hz_tracing, for example.
Since the HSR Core macros call directly through to hz_tracing, this change simply replaces the HSR Core dependency with an equivalent hz_tracing dependency.
Reviewed By: javache
Differential Revision: D73532803
fbshipit-source-id: 56d4b62873aabcbf0a92cebd7a0f720fed616158
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50908
This diff removes the usages of ShadowNodes in the new architecture by fully releasing disableShadowNodeOnNewArchitectureAndroid() feature flag.
changelog: [internal] internal
Reviewed By: cortinico
Differential Revision: D73519567
fbshipit-source-id: e222e3b4fab371c8bc5480950da005d2a12a8619
Summary:
We landed a PR that was importing a file available only in the New Architecture also when the app was running in the old architecture.
This was creating a corrupted bundle for rntester.
This PR fixes the issue
bypass-github-export-checks
## Changelog:
[Internal] - Fix RNTester on Android
Pull Request resolved: https://github.com/facebook/react-native/pull/50940
Test Plan: Tested locally by setting `newArchEnabled` to false in the gradle.properties file
Reviewed By: javache, cortinico
Differential Revision: D73663049
Pulled By: cipolleschi
fbshipit-source-id: c8d6e4190adee7388e51901360a811b0007ee3a5
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50938
Changelog: [internal]
No more `maybeNode`s. Using ref objects makes the tests cleaner and the JSX easier to read than injecting lambdas.
This speaks for itself:
* 617 lines added
* 1393 lines removed
{F1977434870}
Reviewed By: lenaic
Differential Revision: D73659018
fbshipit-source-id: d1c23e6457bb1d351ce02b9f6fa8778b06ee0e55
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50935
Those classes are internal and deprecated since a while.
It should now be safe to fully remove them.
Changelog:
[Internal] [Changed] -
Reviewed By: cipolleschi
Differential Revision: D73655877
fbshipit-source-id: cdca8f032fe865f9a08c40e4a0145945c7e25a85
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50931
This removes all the `OSS_LEGACY_WARNINGS_ENABLED` infrastructure from LegacyArchitectureLogger. We'll instead pivot to use ad-hoc functions for scenarios that don't work in LegacyArch + Interop Layers (see D73654273).
Changelog:
[Internal] [Changed] -
Reviewed By: cipolleschi
Differential Revision: D73654272
fbshipit-source-id: d10eac2ded92f2c0191503e64f0c1d9db688d6e9
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50930
Due to D73591315, we don't need to specify the `legacyWarningsEnabled` for RNTester anymore as it's effectively ignored.
Changelog:
[Internal] [Changed] -
Reviewed By: rshest, cipolleschi
Differential Revision: D73654270
fbshipit-source-id: 9428634fb8374024940e4041de60d679b6f352a2
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50929
We decided to change the warning model for LegacyArch/NewArch.
I'm currently removing the infra to read the `legacyWarningsEnabled` Gradle property if provided.
Warnings will be enabled by default for all Legacy Arch users in the new model.
This change was never shipped in a numbered version, so that's not breaking.
Changelog:
[Internal] [Changed] -
Reviewed By: cipolleschi
Differential Revision: D73591315
fbshipit-source-id: a46fade91b46fcc9b81984577161c046dc0939b6
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50928
This broke in D72979663, since we relied on the object identify of `native` changing to correctly reset the native state back to the controlled JS state.
Changelog: [General][Fixed] Fixed switches correctly reverting to controlled state
Reviewed By: vzaidman
Differential Revision: D73653323
fbshipit-source-id: d6ca8a31d9f08a339c7acf6bba264137690dd794
Summary:
Rewrite of JSBundleLoader from Java to Kotlin in scope of https://github.com/facebook/react-native/issues/50513
## Changelog:
[ANDROID] [CHANGED] - Migrated JSBundleLoader to Kotlin
<!-- 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/50911
Test Plan: Tested using RNTester app, on both old and new arch, and tested by navigating to multiple pages
Reviewed By: cortinico
Differential Revision: D73649145
Pulled By: javache
fbshipit-source-id: 7ef1fc1ea1c53a8b914ae1aada1966e64b4c3d80
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50899
changelog: [internal]
making things clearer in the docs for Fantom.
Reviewed By: rubennorte
Differential Revision: D73580305
fbshipit-source-id: 0e5edaa3baf57fc54f7a0c454fe4d2fa81627f66
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50906
Annotation to mark classes or functions that are part of the interop APIs that provide support for legacy architecture APIs in the new architecture of React Native .
changelog: [internal] internal
Reviewed By: shwanton
Differential Revision: D73407613
fbshipit-source-id: 887a14ca4dea891b50e7df01e0ffff5064cd43ea
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50888
This is shared between platforms using a very strange pattern. Let's just extract this into its own function. Not considering breaking, since TextLayoutManager is internal interface.
Changelog: [internal]
Reviewed By: rshest
Differential Revision: D73555465
fbshipit-source-id: ea99fbebd9db44efd1dc56c2cad68b5b56e77ad1
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50890
With Facsimile, we are introducing some new concept of `PreparedText`, where platform TextLayoutManager which implement, can lead to additional optimizations.
`#ifdef ANDROID` is not a workable pattern for this. Apart from react-native-cxx getting hooked into it, and all of the existing bugs there, it is bad for editor environment, and hard to reason about.
This splits up `ParagraphState`, so that we can control platform specific bits more easily. We do not split `ParagraphShadowNode`, which will use concepts (e.g. `TextLayoutManagerWithPreparedText`) to control which paths it takes, based on platform capaibilities.
Changelog: [internal]
Reviewed By: rshest
Differential Revision: D73555441
fbshipit-source-id: fd585eb99d26b0b6966efb1867d03fbd5cc7e7e2
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50923
This implements the view manager for `PreparedLayoutTextView`, originating by taking the view managers composing `ReactTextView`, converting to Kotlin, and removing everything no longer needed.
In Facsimile, anything influencing text appearance is applied earlier, when creating the Fabric layout, so there are many less setters here. Most visual attributes are instead present in the state we are presenting.
We have tasks for some of these, that need to be reimplemented, as they do not currently influence the Spannable being measured. That includes e.g. `ReactTextViewManagerCallback`, used for injection, and `dataDetectorType` for linkifying Spannable.
Changelog: [Internal]
Reviewed By: rshest
Differential Revision: D73287706
fbshipit-source-id: 938b57d4e443f6b8bb127e17b47cc371f31a416d
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50922
This forms the basis for a replacement of `TextView`.
This started off with Litho's [`RCTextView`](https://github.com/facebook/litho/blob/master/litho-rendercore-text/src/main/java/com/facebook/rendercore/text/RCTextView.java), which is a simple view, for rendering a text layout, and providing some built-in keyboard navigation and a11y support. Many changes were made to it, including:
1. Removing many parts not relevant to RN, or which will be replaced by other RN infra. E.g. we will reuse existing a11y delegates, have existing ways of creating Spannables and text layouts, inline views, etc
2. Converting to Kotlin
3. Adding back in some changes required for RN's drawing, and expected view manager APIs (e.g. overflow/clipping customization)
4. Making it target a ViewGroup instead of a View, for correct inline view support down the line
Because we rely on drawing text layout, with the same Spannable as before, most things "just work", because they are part of the layout we are drawing, generated by TextLayoutManager on the Fabric side. We don't offer much customization to what can be drawn, forcing it to have happened in the layout we are showing already.
There are quite a few bits not implemented yet. Some of these are cases, like `textAlignVertical`, were previously incorrectly implemented just at the ReactTextView layer, so Fabric layout was unaware of them. Another similar class to this is any non-default fonts which we must load. `adjustsFontSizeToFit` (stubbed out in later diff) will also need some tweaking with the new assumption we don’t want to mutate Spans/layouts set in State.
Fine grained selection support is the largest tbd.
Changelog: [Internal]
Reviewed By: Abbondanzo
Differential Revision: D73282649
fbshipit-source-id: abe3a30461095d2d0ddbc6c939704f3982f44771
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50921
This adds the ability to represent Fabric State sent to Java View managers as a raw JNI reference. This is used by Facsimile to tell a component to mount a layout, previously generated during measurement.
This API is consciously well hidden (in comparison to MapBuffer which is fairly public). To use it:
1. The concrete state data representation must implement a method named `getJNIReference()` that returns an fbjni ref
2. The Java view manager must cast the `StateWrapper` to an internal `ReferenceStateWrapper` type, not exposed outside of React Native internals
Changelog: [Internal]
Reviewed By: alanleedev
Differential Revision: D73159146
fbshipit-source-id: b7602bf7717bff28d2f3b259073bc47606fd76e4
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50920
We construct this from JNI, which doesn't care about visibility, and then only want to expose `StateWrapper` as the public interface.
Changelog:
[Android][Removed] - Make StateWrapperImpl Internal
Reviewed By: Abbondanzo
Differential Revision: D73161592
fbshipit-source-id: b787e31e190dc52a02d73cadfa77b1c1defb9703
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50912
Changelog: [Internal] - Update IntersectionObserver Fantom tests to use the new `scrollTo` api which didn't exist when I first wrote these tests. As well, do clean up between tests
Reviewed By: rubennorte
Differential Revision: D73551695
fbshipit-source-id: 9625328879230d178f23a089436f2a3c7b8323bd
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50905
Subtle compiler differences cause this to fail, but we can just `Class<*>` here instead.
Changelog: [Internal]
Reviewed By: cortinico, rshest
Differential Revision: D73593304
fbshipit-source-id: ea3996fc0641ae5d12a6923bd78645e21232afe7
Summary:
Resolves https://github.com/facebook/react-native/issues/50778
### Problem Description
Implement the crossOrigin property for Image in RNW Fabric when only source.uri is passed and not src/ srcSet.
For reference, check the public API documentation: https://reactnative.dev/docs/image#crossorigin
Implement the referrerPolicy property for Image in RNW Fabric when only source.uri is passed and not src/ srcSet.
For reference, check the public API documentation: https://reactnative.dev/docs/image#referrerpolicy
Also refer docs for source, src, srcSet
https://reactnative.dev/docs/image#sourcehttps://reactnative.dev/docs/image#srchttps://reactnative.dev/docs/image#srcset
It's not mentioned in the doc that when src / srcSet is missing then crossOrigin / referralPolicy would be ignored when source uri is a remote URL that is passed.
Currently these were ignored if src / srcSet was not passed and not added to sources headers.
This change adds headers support even without passing src / srcSet and only sources uri that consists of remote URL.
crossOrigin and referrerPolicy are passed as source.headers here:
### Steps to reproduce
```
<Image
defaultSource={{uri: this.state.defaultImageUri}}
source={{uri: this.state.imageUri}}
crossOrigin="use-credentials"
referrerPolicy="no-referrer"
/>
```
Pass this in React Native and check source headers
## Changelog:
[GENERAL] [ADDED] - Support headers [crossOrigin and referralPolicy] in Image without src and srcSet and only remote source.uri
Pull Request resolved: https://github.com/facebook/react-native/pull/50799
Test Plan:
Refer this PR for testing; https://github.com/microsoft/react-native-windows/pull/14521
## Screenshots
_Add any relevant screen captures here from before or after your changes._
Before
After
<img width="790" alt="image" src="https://github.com/user-attachments/assets/8e0a2522-7009-430d-b848-da80896670f4" />
## Testing
_If you added tests that prove your changes are effective or that your feature works, add a few sentences here detailing the added test scenarios._
Tested in playground and RNW Tester and Visual Studio Debugger
_Optional_: Describe the tests that you ran locally to verify your changes.
1. Tested with only source remote uri passed
2. Tested with both source, src
3. Tested with source, src, srcSet
Reviewed By: javache
Differential Revision: D73427747
Pulled By: cipolleschi
fbshipit-source-id: f09174d1e4eaa2173b27970a6079eeb8ba6f3069
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50900
This bumps the minor of Android Gradle Plugin ahead of the branch cut for 0.80
Changelog:
[Android] [Changed] - AGP to 8.9.2
Reviewed By: rshest
Differential Revision: D73579447
fbshipit-source-id: f0d40ba3d160e332ee9ab2853a949ed6ec51a3fc
Summary:
Right now having a javascript error like an invalid import statement during first bundle load results in a disappearing redbox screen.
https://github.com/user-attachments/assets/ab9c64f5-6e32-481c-a58f-6d37bb920acb
The `invalidate` call removed in this PR cleans up all turbomodules, including the RedBox module, which in turns calls `dismiss` in `RCTRedBox`.
After removing this line the result is as following:
https://github.com/user-attachments/assets/6eeb4d43-f883-440f-ade3-5628f85f833a
I made sure that the `invalidate` function is still called when executing only two possible ways to reload the bundle:
- the Reload button
- Cmd+R
The HMR/hot reload is not connected if the bundle has an error on initial load, so we don't need to worry about it.
Longer term, it would be better to establish HMR and use a different redbox in this case:
Doing this requires larger changes to the bundle loading flow – happy to to try and land that change if there's any guidance you could give.
## 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] – Fix disappearing redbox on initial load of an invalid bundle.
Pull Request resolved: https://github.com/facebook/react-native/pull/50867
Test Plan: I have tested this change using RN from main and RNTester app (see videos).
Reviewed By: cortinico
Differential Revision: D73511154
Pulled By: cipolleschi
fbshipit-source-id: dfe149ebc15d845f07fd3926db2e063b468870af
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50802
The plugin analyses the source of all `import`, `require`, and `export` statements and injects the `console.warn` statement for each path targeting deep react-native source code. It runs only on a dev mode so there is no need to keep that in the `if (__DEV__) ` block. It is possible to disable this plugin by setting `disableDeepImportWarnings: true` and **resetting** the Metro cache:
```js
module.exports = {
presets: [['module:react-native/babel-preset', {
"disableDeepImportWarnings": true
}]],
};
```
Changelog:
[General][Internal] - Added plugin to react-native/babel-preset injecting `console.warn` for each react native deep import in dev mode.
For a given code:
```js
import { Image } from 'react-native';
import View from 'react-native/Libraries/Components/View/View';
const Text = require('react-native/Libraries/Text/Text');
export { PressabilityDebugView } from 'react-native/Libraries/Pressability/PressabilityDebug';
```
The transformed output should look like:
```js
import { Image } from 'react-native';
import View from 'react-native/Libraries/Components/View/View';
const Text = require('react-native/Libraries/Text/Text');
export { PressabilityDebugView } from 'react-native/Libraries/Pressability/PressabilityDebug';
console.warn("Deep imports from the 'react-native' package are deprecated ('react-native/Libraries/Components/View/View').");
console.warn("Deep imports from the 'react-native' package are deprecated ('react-native/Libraries/Text/Text').");
console.warn("Deep imports from the 'react-native' package are deprecated ('react-native/Libraries/Pressability/PressabilityDebug').");
```
For more information about why this plugin was needed, please check [RFC](https://github.com/react-native-community/discussions-and-proposals/pull/894).
Reviewed By: huntie
Differential Revision: D70783145
fbshipit-source-id: ae145db6471d861099566a8faf2fbd93bd136450
