Summary:
This PR solves [this issue](https://github.com/facebook/react-native/issues/44151).
Inverted FlatList doesn't work (elements cannot be clicked) when the list is scrolled.
## 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
-->
[GENERAL] [FIXED] - Fix clicking items on the inverted FlatList on the new architecture
Pull Request resolved: https://github.com/facebook/react-native/pull/44168
Test Plan:
# Steps
1. `buck2 install catalyst-ios` or `buck2 install catalyst-android`
2. Go to `RNTester Browser - Fabric` -> `FlatList` -> `Inverted`
3. Toggle inverted to `true`
4. Scroll to the top
5. Tap down and drag to either left or right
6. Expected is to have Red highlighted (which indicate Press Down) when dragged.
## iOS
| Before | After |
|-----------------------|----------------------|
| https://pxl.cl/53vCW | https://pxl.cl/53vDq |
## Android
| Before | After |
|-----------------------|----------------------|
| https://pxl.cl/53vFp | https://pxl.cl/53vFG |
## Reproducing steps from OSS
1. Use this reproducer: https://github.com/WoLewicki/reproducer-react-native/tree/%40wolewicki/flatlist-inverted
2. Apply changes from this PR & build the app.
3. Scroll a bit the list, so it changes the position.
4. The `onPress` should be fired when the button is clicked.
5. Do the following tests:
1. Add a `horizontal` prop to the FlatList - verify everything works.
2. Remove a `inverted` prop - verify everything works.
3. Remove a `inverted` prop and add a `horizontal` prop - verify everything works.
6. Test different combinations of transforms of the FlatList, example:
```javascript
<FlatList
inverted
horizontal
style={{
transform: [
{scaleY: -1},
{scaleY: -2},
{scaleY: -0.5},
{translateY: 20},
{translateY: -10},
{skewX: '10deg'},
{rotateX: '10deg'},
],
}}
/>
```
<details>
<summary>Reproducrer</summary>
https://github.com/facebook/react-native/assets/104823336/28cfe607-43e8-4f80-bbfb-59085ae0f986
</details>
<details>
<summary>RN tester</summary>
https://github.com/facebook/react-native/assets/104823336/e00cd488-d98f-4ece-9cab-b8a7212acb04
</details>
Reviewed By: arushikesarwani94
Differential Revision: D56441112
Pulled By: realsoelynn
fbshipit-source-id: 82c47f6bcc1f25cfbbd55aedf9652052bb86cf47
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44912
While moving from CircleCI → GHA, we're removing this blocking folks landing PRs and just running on main. We will re-enable once GHA is stable.
Changelog: [General][Changed] Disable GHA on PRs until it's stable
Reviewed By: NickGerleman
Differential Revision: D58478000
fbshipit-source-id: 053ee53455956bf19b6f9113cb796346359ad4ef
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44803
This change introduces a new prop to the Android `Image` component: `resizeMultiplier`. This prop can be used when the `resizeMethod` is set to `resize`, and it directly modifies the resultant bitmap generated in memory from Fresco to be larger (or smaller) depending on the multiplier. A default of 1.0 means the bitmap size is designed to fit the destination dimensions. A multiplier greater than 1.0 will set the `ResizeOptions` provided to Fresco to be larger that the destination dimensions, and the resulting bitmap will be scaled from the hardware size.
This new prop is most useful in cases where the destination dimensions are quite small and the source image is significantly larger. The `resize` resize method performs downsampling and significant image quality is lost between the source and destination image sizes, often resulting in a blurry image. By using a multiplier, the decoded image is slightly larger than the target size but smaller than the source image (if the source image is large enough).
It's important to note that Fresco still chooses the closest power of 2 and will not scale the image larger than its source dimensions. If the multiplier yields `ResizeOptions` greater than the source dimensions, no downsampling occurs.
Here's an example:
If you have a source image with dimensions 200x200 and destination dimensions of 24x24, a `resizeMultiplier` of `2.0` will tell Fresco to downsample the image to 48x48. Fresco picks the closest power of 2 (so, 50x50) and decodes the image into a bitmap of that size. Without the multiplier, the closest power of 2 would be 25x25, which is half the quality.
## Changelog
[Android][Added] - Adds a new `Image` prop `resizeMultiplier` to help increase quality of small images on low DPI devices
Reviewed By: javache
Differential Revision: D58120352
fbshipit-source-id: e0ebf4bd899170134825a29f72a68621447106c0
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44885
Cleanup accessibility related props checks to ensure we are doing the minimal amount of work. e.g. reduce duplicate `null` checks and shift checks to conditional branches that use them.
Changelog: [Internal]
Reviewed By: javache
Differential Revision: D58390430
fbshipit-source-id: f2c8989b6520cda9f14f9a04cd4fd6e126c501fd
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44877
Changelog: [Internal]
We're seeing a sporadic iOS crash that suggests `[RCTBridge dealloc]` is being called off the main queue (despite a comment suggesting it shouldn't be). This exposes a race condition between destroying the `HostTarget` and attempting to unregister the instance+runtime from it . Here we use `RCTExecuteOnMainQueue` to make sure the `HostTarget` destruction is always sequenced after the `unregisterFromInspector()` call.
Reviewed By: huntie
Differential Revision: D58415684
fbshipit-source-id: a22e239c80c3204fe32b9e73719ffaa131feaffb
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44911
This diff reverts D58288489
D58288489: [RN][Fusebox][iOS] Implement new HostTargetMetadata fields (iOS) by huntie causes the following test failure:
Tests affected:
- [fbsource//xplat/js/react-native-github/packages/react-native/ReactCommon/jsinspector-modern:testsAndroid - main](https://www.internalfb.com/intern/test/844425054538351/)
Here's the Multisect link:
https://www.internalfb.com/multisect/5466028
Here are the tasks that are relevant to this breakage:
T191385299: 50+ tests unhealthy for react_native
The backout may land if someone accepts it.
If this diff has been generated in error, you can Commandeer and Abandon it.
Changelog: [Internal]
Reviewed By: NickGerleman
Differential Revision: D58475289
fbshipit-source-id: 3a4476d1350c4986cdb673bdb4ac52af353a00ea
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44495
## Summary
Migrates the `AlertFragment` from `android.app.AlertDialog` to `androidx.appcompat.app.AlertDialog`. This backports tons of fixes that have gone into the AlertDialog component over the years, including proper line wrapping of button text, dark mode support, alignment of buttons, etc.
This change provides a fallback to the original `android.app.AlertDialog` if the current activity is not an AppCompat descendant.
## For consideration
- Alert dialog themes may no longer need the `android` namespace, meaning themes can now be specified as `alertDialogTheme` rather than `android:alertDialogTheme`.
## Changelog:
[Android] [Changed] - Migrated `AlertFragment` dialog builder to use `androidx.appcompat`
Reviewed By: zeyap
Differential Revision: D57113950
fbshipit-source-id: ba5109c9d79b6ceb042ff93eebe796a2d14ebd63
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44494
Pull Request resolved: https://github.com/facebook/react-native/pull/44880
Migrates the `AlertFragment` from `android.app.AlertDialog` to `androidx.appcompat.app.AlertDialog`. This backports tons of fixes that have gone into the AlertDialog component over the years, including proper line wrapping of button text, alignment of buttons, etc.
## For consideration
- Alert dialog themes may no longer need the `android` namespace, meaning themes can now be specified as `alertDialogTheme` rather than `android:alertDialogTheme`.
- This change requires all implementing activities to have a theme that inherits from `Theme.AppCompat`. Creation of any activities which do not have a descendant of this style will result in an `IllegalStateException`: https://www.internalfb.com/intern/signalinfra/exception_owners/?mid=5ee93f6ecd59f3d8ad82a78c213ea016&result_id=16044073705339118.281475102518721.1715097866
## Changelog:
[Android] [Changed] - Migrated `AlertFragment` dialog builder to use `androidx.appcompat`
Reviewed By: zeyap
Differential Revision: D57019423
fbshipit-source-id: 84d8f69d896d32e72434149c0e31735d358370a9
Summary:
This change migrates the GHA template jobs to the HelloWorld package for iOS.
## Changelog:
[Internal] - Move iOS template jobs to HelloWorld
Pull Request resolved: https://github.com/facebook/react-native/pull/44875
Test Plan: GHA are green
Reviewed By: cortinico
Differential Revision: D58459398
Pulled By: cipolleschi
fbshipit-source-id: 95404445d7375186860af5835b750b4735795434
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44811
Changelog:
[General][Fixed] - Debugger frontend socket-termination countdown now begins after the ping message is actually sent
The debugger is currently disconnected if a ping-pong message is missed.
This causes the debugger to be unusable if it happens to be lagging, e.g. when the initialisation is competing with the flood of log spam T191394188
There are a few ways to fix this as discused with motiz88 and robhogan:
1. Ensure the websocket has a chance to respond, e.g. in via web worker
1. Lengthen the time allowed for the pong resopnse
I've done some digging to find the root cause of the UI being blocked in CDT, However, profiling shows that most of the work is not simple to break up, i.e. the number of expensive re-layout calls. Diving into that rabbit hole could mean accidentally writing React.
Because we ping every 10 seconds, we could get un/lucky where CDT happens to be busy _at that exact moment_, making this a flaky symptom to fix, even if we lengthen the allowed time-to-respond.
# V2+
So upon further investigation, CDT websocket is actually responding to the pings in due time:
{F1679132204}
(CDT doesn't show the ping/pong API as frames, so a custom tick/tock message was used to visualise the timing)
Over here in dev-middleware, we currently start a timeout to terminate the socket after sending the ping:
https://www.internalfb.com/code/fbsource/[813870db697a8701f2512d25a7fed730f0ec6ed9]/xplat/js/react-native-github/packages/dev-middleware/src/inspector-proxy/InspectorProxy.js?lines=306-307
If CDT doesn't respond in time, websocket would be terminated.
But we saw CDT respond immediately above, even during the log spam, so the delay must be coming from somewhere else.
The intuition is that during the log-spam, the middleware takes a perf hit too when it's processing the spam from the device and forwarding it to the CDT websocket.
We can confirm this by passing a "sent" callback via `socket.ping(cb)`:
https://github.com/websockets/ws/blob/9bdb58070d64c33a9beeac7c732aac0f4e7e18b7/lib/websocket.js#L246-L254
This gives us the timing between calling `socket.ping()` and when the ping is actually sent.
Regular, stress-free operation without log-spam shows most pings are sent within the same millisecond:
{F1679223326}
With the pong response grace period at 5 seconds, there's plenty of time for CDT to `pong` back. That's why it has been working in most cases.
However, during the log-spam, we easily see this send-sent delay over 5 seconds. In extreme cases, almost 30 seconds would have passed before middleware sent a message to CDT, which then responded under 2 seconds:
{F1679163335}
This means while CDT is getting flooded and has observable lag in the UI, the smoking gun is actually the middleware.
Digging a little deeper, we know that incoming messages from the target goes into a Promise queue, including the console logs:
https://www.internalfb.com/code/fbsource/[d5d312082e9c]/xplat/js/react-native-github/packages/dev-middleware/src/inspector-proxy/Device.js?lines=155-157
This means during the flood of logs from the target, the Promise queue keeps getting chained rapidly for each message.
Meanhile, the `ws` lib uses the underlying NodeJS `Socket.write` method for `ping(…)` and `send(…)`:
https://github.com/websockets/ws/blob/9bdb58070d64c33a9beeac7c732aac0f4e7e18b7/lib/sender.js#L349
…which is guaranteed to fire the callback asynchronously:
https://github.com/nodejs/help/issues/1504#issuecomment-422879594
Promise queue is in the macro task queue, which gets priority before the micro task queue. So if the Promise queue is not cleared yet, the websocket queue will have a hard time getting executed in time – explaining the extreme send-sent durations during a log spam.
The fix is simple:
1. Start the terminate-socket-timer until the `ping` is actually sent
1. Treat any incoming message (along with `pong`s) as a terminate-socket-timer reset
1. This also applies if `pong` comes in between `send` and `sent`, which can happen sometimes due to the async nature of the callback:
{F1679288626}
# V1
~~In this diff, a more forgiving mechanism is introduced, i.e. CDT is allowed to miss a ping-pong roundtrip 3 times before the websocket connection is terminated.~~
~~This allows a bit more breathing room for CDT's initialisation during log spam while maintaining the same ping-pong interval for VS Code to keep the auto SSH tunnel alive.~~
Reviewed By: huntie
Differential Revision: D58220230
fbshipit-source-id: 7111c9878492d8755a6110a5cdf4ef622265001d
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44894
Adds the new CDP domain `ReactNativeApplication`, with the following messages:
- `ReactNativeApplication.enable` (method) — Sent by the connected frontend to enable features under this domain.
- `ReactNativeApplication.metadataUpdated` (event) — Sent by the backend containing a metadata object about the host.
We intend to use this for displaying richer information in the debugger frontend, such as device information and React Native version.
Changelog:
[General][Added] - Add `ReactNativeApplication.[enable,metadataUpdated]` CDP messages for reading host metadata
Reviewed By: motiz88
Differential Revision: D58288490
fbshipit-source-id: 02384f0cdfaa35f1c5de9fad7ddd5aab483b2768
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44878
A refactor moving `SessionMetadata` (now renamed as `HostTargetMetadata`) out of `inspectorTarget->connect()` calls into a `HostTargetDelegate::getMetadata` method. This provides a cleaner interface and location for extending metadata fields in future.
Changelog: [Internal]
Reviewed By: robhogan
Differential Revision: D58288491
fbshipit-source-id: 67e8b9a3fb6d0b7966187fa98d9852222f242b9d
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44897
changelog: [internal]
To get better understanding of where the time is spent, let's split IntBufferBatchMountItem systrace section into individual types.
Reviewed By: javache
Differential Revision: D58080444
fbshipit-source-id: d71dcc74a042c6c40270ca6f1dc7a8735c0471b8
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44895
Enables the new debugger stack (codename Fusebox) in RNTester.
This feature is experimental and is enabled for testing purposes only. This change **should not** be adopted as the default by React Native frameworks.
Changelog: [Internal]
Reviewed By: cortinico, rubennorte, NickGerleman
Differential Revision: D58366246
fbshipit-source-id: 809a1edb79ced4a7920457ed661cc3d863b35c7b
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44879
This sets up publishing of Gradle scans for every build on GHA.
Changelog:
[Internal] [Changed] - Setup publishing of Gradle Scans on GHA
Reviewed By: blakef
Differential Revision: D58419361
fbshipit-source-id: f54365ad259324747248ef0bb726dc64964507f8
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44810
Adds an example how to use the `EventEmitter` on a (C++) Turbo Module
## Changelog:
[General] [Added] - Add C++ Turbo Module Event Emitter example
Reviewed By: javache
Differential Revision: D57473949
fbshipit-source-id: 1a8d17fb83af4220ef12379e0102b5b2e233ed45
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44864
Switch the style normalizer checks to only do a single top level `null` check and remove unneeded flow suppression comments.
Changelog: [Internal]
Reviewed By: javache
Differential Revision: D58386781
fbshipit-source-id: e4df6fdadb5bfab4c8ae674a420ac453ba262f78
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44822
Changelog: [Breaking]
This is to make `getContentOriginOffset` to have `includeTransform` information passed during Layout computation.
Reviewed By: NickGerleman
Differential Revision: D58223380
fbshipit-source-id: 4faa1409d9c87e2c92118941aa193ba0a0f34367
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44809
Adding react-native-codegen parser support for a new `EventEmitter` property type on C++ Turbo Modules.
It is possible to later expand this feature to other languages (Java, ObjC).
## Characteristics
An `EventEmitter` must:
- be non null:
`EventEmitter<string>` works, `?EventEmitter<string>` does NOT
- have a non null eventType:
`EventEmitter<number>` works, `EventEmitter<?number>` does NOT
- have at most 1 eventType, `void` is possible as well:
`EventEmitter<>` or `EventEmitter<MyObject>` work - `EventEmitter<number, string>` do NOT
- have a concrete eventType, `{}` is not allowed
`EventEmitter<{}>` does NOT work
- be used in `Cxx` Turbo Modules only at this time
## Example
For these 4 eventEmitters in on an RN JS TM spec
```
+onPress: EventEmitter<void>;
+onClick: EventEmitter<string>;
+onChange: EventEmitter<ObjectStruct>;
+onSubmit: EventEmitter<ObjectStruct[]>;
```
We now generate this code:
1.) in the spec based header `{MyModuleName}CxxSpec` in the constructor:
```
... // existing code
eventEmitterMap_["onPress"] = std::make_shared<AsyncEventEmitter<>>();
eventEmitterMap_["onClick"] = std::make_shared<AsyncEventEmitter<OnClickType>>();
eventEmitterMap_["onChange"] = std::make_shared<AsyncEventEmitter<OnChangeType>>();
eventEmitterMap_["onSubmit"] = std::make_shared<AsyncEventEmitter<OnSubmitType>>();
```
2.) as `protected` functions
```
void emitOnPress() {
std::static_pointer_cast<AsyncEventEmitter<>>(delegate_.eventEmitterMap_["onPress"])->emit();
}
void emitOnClick(const OnClickType& value) {
std::static_pointer_cast<AsyncEventEmitter<OnClickType>>(delegate_.eventEmitterMap_["onClick"])->emit(value);
}
void emitOnChange(const OnChangeType& value) {
std::static_pointer_cast<AsyncEventEmitter<OnChangeType>>(delegate_.eventEmitterMap_["onChange"])->emit(value);
}
void emitOnSubmit(const OnSubmitType& value) {
std::static_pointer_cast<AsyncEventEmitter<OnSubmitType>>(delegate_.eventEmitterMap_["onSubmit"])->emit(value);
}
```
## Changelog:
[General] [Added] - Add EventEmitter code-gen support for C++ Turbo Modules
Reviewed By: javache
Differential Revision: D57407871
fbshipit-source-id: 2345cc6dacf0cb0d45f8a374ad9d4cbf8082f9d6
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44734
Fixes https://github.com/facebook/react-native/issues/44671
This integrates functionality for clipping content to padding box into `ReactViewBackgroundManager`, to be shared between several ViewManagers. In practice, this means:
1. `overflow: hidden` now works on `Text` and `TextInput`
2. ScrollView children are now clipped to the interior of borders, included curved ones via borderRadius
This will be made more generic, then start being used in ReactViewGroup, and eventually ReactImage. That abstraction will then hide away extra background management we will use for shadows.
Different places in code currently do clipping in any of `draw()`, `onDraw()`, or `dispatchDraw()`. The distinction between these, is that `draw()` allows code to run before drawing background even, `onDraw()` is invoked before drawing foreground, and `dispatchDraw()` is before drawing children. We don't want to clip out borders/shadows, but do want to clip foreground content like text, so I used `onDraw()` here.
Changelog:
[Android][Fixed] - Better overflow support for ScrollView, Text, TextInput
Reviewed By: rozele
Differential Revision: D57953429
fbshipit-source-id: ca3b788deb4b32706df7db958877d18f525c039c
Summary:
Before all React errors showed junk like this:
This is because `isComponentStack` detected a component stack but `parseComponentStack` couldn't actually parse it (it doesn't deal with React's current format like `in Foo (created by FeedItemInner)`) so `componentStack` was an empty array, resulting in the next block of code pushing stuff into `argsWithoutComponentStack` _again_, thus repeating its args.
The fix is not to do that. Result on my local copy:
Ofc this doesn't actually show the component stack but that was broken before too.
I edited in-place in my `node_modules` so I haven't verified this 100% works on main.
Hope this is useful!
## Changelog:
[General] [Fixed] - Remove accidental duplication in React warnings in Logbox
Pull Request resolved: https://github.com/facebook/react-native/pull/44812
Reviewed By: cortinico
Differential Revision: D58240357
Pulled By: rickhanlonii
fbshipit-source-id: b6ecb659d3b393e497caf5e7b2087a8e529f1b28
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44808
Adds an `AsyncEventEmitter` class which can be used as a property of currently C++ only Turbo Modules to send type safe data back to JavaScript.
Adding support for ObjC / Java Turbo Modules is possible, straight forward and can be added as an afterthought.
It implements this interface
```
export type EventEmitter<T> = {
addListener(handler: (T) => mixed): EventSubscription,
};
```
## Hybrid
It is a 'hybrid' object.
1.) You `addListener(handler: (T) => mixed)` in JavaScript for emitted events (coming from C++, native code)
2.) You `emit(...Arg)` events in C++, native code (getting sent to JavaScript)
## Changelog:
[General] [Added] - Add EventEmitter C++ bridging type
## Facebook:
Apps usually create custom functionality to achieve this kind of behavior - e.g. https://www.internalfb.com/code/fbsource/[e72bd42a028a]/arvr/js/apps/RemoteDesktopCompanion/shared/turbo_modules/TMSubscription.h
Reviewed By: javache
Differential Revision: D57424391
fbshipit-source-id: 4999cafe9daeac125712a4bb7679d7acb9a6c389
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44841
This change adds native support in Fabric for the remaining CSS cursor style values as defined here: https://developer.mozilla.org/en-US/docs/Web/CSS/cursor. Please note, this functionality is simply for prop parsing capabilities in Fabric, which are shared across all platforms. This does not add any additional cursor behavior support to iOS or Android, and the Flow and TypeScript types for cursor style values are still limited to `auto` and `pointer`.
## Changelog
[General][Added] Fabric prop parsing capabilities for all CSS cursor style values
Reviewed By: NickGerleman
Differential Revision: D58301970
fbshipit-source-id: 37ef8fcb4f62ac8c7613c7f6abcc48303953b71b
Summary:
Sometimes the events map can be a of type `SingletonMap` which will cause this code to throw exception when adding keys to it, so we change it to normal `HashMap`. Creating `SingletonMap` can especially happen in Kotlin when there is only one event added to a map, see:
https://github.com/plaid/react-native-plaid-link-sdk/blob/5ffab5eef576163528f0da504181162da3bef08b/android/src/main/java/com/plaid/PLKEmbeddedViewManager.kt#L21
## Changelog:
[ANDROID] [FIXED] - Cover SingletonMap when parsing events exported by module
Pull Request resolved: https://github.com/facebook/react-native/pull/42354
Test Plan: Create `getExportedCustomBubblingEventTypeConstants` as `SingletonMap` in some example module and see that the code does not throw.
Reviewed By: cipolleschi
Differential Revision: D58417266
Pulled By: cortinico
fbshipit-source-id: 6c46398ddf4d044386a36d0c1663bd071d642fb6
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44874
While reviewing https://github.com/facebook/react/pull/29830, I noticed this file was committed with tab indentation in React Native. I have also used the `.gitignore` entry to clarify how `react-native.code-workspace` interacts with an optional user `.vscode/` config directory.
Note: The `json-stringify` parser can be used with Prettier 3+ only, so we use `json` instead.
Changelog: [Internal]
Reviewed By: vzaidman
Differential Revision: D58413581
fbshipit-source-id: 58c14db6648fed10736062b1f055475154aa74a4
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44835
As titled. The `vm` field is not part of the CDP spec and will not be used by the modern debugger frontend or proxy.
This change affects modern CDP targets only (using `InspectorPackagerConnection`). We aim to enable sharing of more detailed metadata over 1/ a new, dedicated CDP domain, and 2/ namespaced under the existing `reactNative` field (for the latter, strictly limited to metadata necessary for dev server functionality).
Changelog: [Internal]
(Note: `/json` endpoint behaviour is unchanged for legacy CDP targets)
Reviewed By: robhogan
Differential Revision: D58285587
fbshipit-source-id: dfef3a56b20486ba11891df9940f6c7bef59528e
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44858
- Enables an opt-in to the Fusebox stack on Android for both architectures in open source.
- Templates use of this opt-in in RNTester.
Changelog: [Internal]
Reviewed By: rubennorte
Differential Revision: D58359907
fbshipit-source-id: d565dc8e00747dff56d3060e36e7f59e7dd2aec5
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44871
This re-enables and fix `test_android_template`.
The problem was that we were invoking `yarn install` inside the template after we already installed with `npm install --registry`.
So this was invalidating the Verdaccio setup and effectively fetching packages from NPM
Changelog:
[Internal] [Changed] - Fix test_android_template
Reviewed By: cipolleschi
Differential Revision: D58407941
fbshipit-source-id: 9b7b877cfc994eb8db1b5bf71dd35289c3937f5c
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44860
- Enables an opt-in to the Fusebox stack on iOS for both architectures in open source.
- Templates use of this opt-in in RNTester.
Changelog: [Internal]
Reviewed By: rubennorte
Differential Revision: D58364053
fbshipit-source-id: c604b1589174bf7cfd0fe1bfb5624c4edd0a125d
Summary:
Seems like hermesc produced by GitHub Actions is not executable. This fixes it.
Changelog:
[Internal] [Changed] - Make hermesc executable
Reviewed By: cipolleschi
Differential Revision: D58407086
fbshipit-source-id: 84d7ba950b99214dfaed09a6aa499835fd01ede0
Summary:
Just doing some cleanup of the `.github/workflows` folder:
* apply-version-label-issue.yml hasn't been working since 0.72
* ios-tests is unnecessary as it's now covered by test-all
* nightlies-feedback.yml was experimental and last execution was ~5 months ago.
We can still recover them from the Git history if necessary.
## Changelog:
[INTERNAL] - Cleanup the .github/workflows folder
Pull Request resolved: https://github.com/facebook/react-native/pull/44857
Test Plan: Will wait for CI result
Reviewed By: NickGerleman
Differential Revision: D58362912
Pulled By: cortinico
fbshipit-source-id: d886e4f077eebfdf906169f09f96a950a361cab7
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44865
This has not yet passed on main since we started testing on main two weeks ago: https://github.com/facebook/react-native/actions/runs/9316380994/job/25688028045
This change disables the GitHub Actions version `test_android_template` as a signal for PRs or diffs, since it isn't stable yet (but we still run it on main, and can manually dispatch it on any branch). This coverage is still enabled in CircleCI.
Changelog: [Internal]
Reviewed By: cortinico, alanleedev
Differential Revision: D58394745
fbshipit-source-id: 3227328b150a89b450d48784190f5d08d510cd1b
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44821
Changelog: [Internal]
- Originally D37994809 was attempted to fix `Inverted FlatList` but was put behind Feature Toggle because it was causing problems in other scenarios.
- Later, D45866231 which was trying to fix scaling transform issue helped solve the issue attempted by the original diff.
- But after that points, Unit test around `computeRelativeLayoutMetrics` was having two variants where Feature Toggle for D37994809 was checked in with a wrong expected value.
- This diff revert D37994809 changes and clean up the unit test.
Reviewed By: NickGerleman
Differential Revision: D58197918
fbshipit-source-id: d8ae552018617e785e4010bc5805c53a875e02a3
Summary:
## Changelog
make RNTesterApp take a `customBackButton` prop to enable overriding whether to display back button and the look
by default, only ios platform has a back button, and android app relies on back button on navigation bar that comes with platform
[Internal]
Reviewed By: christophpurrer
Differential Revision: D58218208
fbshipit-source-id: 63a47390cc6d3de057b92a3c522c1b00d942c69d
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44792
X-link: https://github.com/facebook/yoga/pull/1663
Fixing https://github.com/facebook/yoga/issues/1658. We had a problem where if a child had a different flex direction than its parent, and it also set a position as a percent, it would look at the wrong axis to evaluate the percent. What was happening was we were passing in the container's mainAxis size and crossAxis size to use to evaluate the position size if it was a percent. However, we matched these sizes with the main/cross axis of the child - which is wrong if the flex direction is different.
I changed it so that the function just takes in ownerWidth and ownerHeight then calls isRow to determine which one to use for the main/cross axis position. This reduces the ambiguity quite a bit imo.
Changelog: [Internal]
Reviewed By: NickGerleman
Differential Revision: D58172416
fbshipit-source-id: eafd8069e03493fc56c41a76879d1ad9b7e9236d
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44791
X-link: https://github.com/facebook/yoga/pull/1662
This should fix https://github.com/facebook/yoga/issues/1657. Rather insidious bug but we had code like
```
// The total padding/border for a given axis does not depend on the direction
// so hardcoding LTR here to avoid piping direction to this function
return node->style().computeInlineStartPaddingAndBorder(
axis, Direction::LTR, widthSize) +
node->style().computeInlineEndPaddingAndBorder(
axis, Direction::LTR, widthSize);
```
That comment is NOT true if someone sets both the physical edge and relative edge. So like paddingLeft and paddingEnd for RTL. This diff simply pipes the direction to that spot to use instead of hardcoding LTR. Every file changed is just to pipe `direction`.
Changelog: [Internal]
Reviewed By: NickGerleman
Differential Revision: D58169843
fbshipit-source-id: 5b4854dddc019285076bd06955557edf73ef7ec5
Jakub Kosmydel
Blake Friedman
Peter Abbondanzo
Edmond Chui
Pieter Vanderwerff
Gijs Weterings
Moti Zilberman
Riccardo Cipolleschi
Christoph Purrer
Alex Hunt
Samuel Susla
Pieter De Baets
Fabrizio Cucci
Nicola Corti
Soe Lynn
Nick Gerleman
dan
Eric Rozell
Wojciech Lewicki
Mauricio Meirelles
rickhanlonii (Meta Employee)
Zeya Peng
Joe Vilches