Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45834
These are very rarely called, outside of directly by the view manager, but they are still public, so we should make these work off the same composite drawable as the view managers (eventually BasrViewManager).
Changelog: [Internal]
Reviewed By: joevilches
Differential Revision: D60495100
fbshipit-source-id: 90f51870dd9929d1f3657d8f5368ef46216c8544
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45854
Right now these border widths are incorporated into Yoga layout, but view manager never responds to it.
This adds the props supported by <View> to text, still missing many others. The underlying functions are aware of the spacing type,
I plan to fix this more thoroughly, across the different edges, properties, and different components, after we remove the legacy background stack, and all of these can live in a single place on BaseViewManager.
Changelog:
[Android][Fixed] - Add borderStartWidth and borderEndWidth support
Reviewed By: necolas
Differential Revision: D60560343
fbshipit-source-id: 8e1ebaa087e0728b5758850239c41aeae5d619a9
Summary:
Many `AccessibilityInfo` functions (`isReduceMotionEnabled`, `isBoldTextEnabled`, etc.) return promises, but the mocked versions of them in jest/setup.js aren't returning promises.
All of these functions live in [packages/react-native/Libraries/Components/AccessibilityInfo/AccessibilityInfo.js](https://github.com/facebook/react-native/blob/main/packages/react-native/Libraries/Components/AccessibilityInfo/AccessibilityInfo.js), where you can verify their return types are Promises.
When using `react-native/jest-preset` and running tests that utilize one of these functions, you'll get an error:
```
AccessibilityInfo.isReduceMotionEnabled().then() is not a function
```
https://github.com/facebook/react-native/pull/29381 was opened in 2020 but closed after becoming stale. My PR is nearly identical but covers additional Promise-returning functions that have been added to `AccessibilityInfo` since then.
## Changelog:
[GENERAL] [FIXED] - Update the react-native/jest-preset mock of AccessibilityInfo to better match its API
Pull Request resolved: https://github.com/facebook/react-native/pull/45825
Test Plan:
I've tested by making the change locally in my project's `node_modules/react-native/jest/setup.js` file and confirming that I no longer get an error when running this test:
```
it("should pass", async () => {
await AccessibilityInfo.isReduceMotionEnabled().then(enabled => {
expect(enabled).toBe(false);
});
});
```
Before:
```
TypeError: Cannot read properties of undefined (reading 'then')
16 |
17 | it.only("should pass", async () => {
> 18 | await AccessibilityInfo.isReduceMotionEnabled().then(enabled => {
| ^
19 | expect(enabled).toBe(false);
20 | });
21 | });
```
After: No type error, and test passes.
Reviewed By: robhogan
Differential Revision: D60519836
Pulled By: tdn120
fbshipit-source-id: 24fc77b0f9693e131686a0a45b81fbd33ff65f01
Summary:
Issue: https://github.com/facebook/react-native/issues/45596
## Changelog:
[INTERNAL] [CHANGED] - Migrate `BundleHermesCTaskTest.kt` to AssertJ testing library
<!-- 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/45806
Test Plan: Run `./gradlew -p packages/gradle-plugin test`
Reviewed By: mdvacca
Differential Revision: D60522760
Pulled By: cortinico
fbshipit-source-id: f7847143d182b29e1bbbba738a0ddae9bf3ee59c
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45746
Once the spread was past a certain value, it could break some of this logic by creating a null rect or negative size. This just makes it so that in those cases, inset will be a 0x0 clear region rect and outset will be nothing
Changelog: [Internal]
Reviewed By: NickGerleman
Differential Revision: D60317780
fbshipit-source-id: 021bf41d71ae69809076b4f5e6413d04cd878372
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45681
This diff fixes 2 related issues that arise when we add a border to the view with box shadow
1) The shadow fills the padding box and not the border box. To fix this we just need to subtract the edge insets (border width) from both the shadow size and the clear region size. We also need to change the clipping area to clip anything outside the padding box
2) The corner radius of the clear region is based on the corner insets, so border radius - border width
The first change required a bit of thinking on my part to remember what bits of the crazy arithmetic here needed to change. So I refactored a bit:
* The general theme now is that all of the rects are derived from one another, and make use of CGRectOffset and CGRectInset to make their necessary adjustments.
* We introduce `shadowFrame` which is just the frame of the shadow area - agnostic of things like blur padding and offscreen shenanigans. So its the size of the layer insetted by the border widths.
* From this we can derive our 2 offscreen rects. The `shadowCastingRect` outsets the shadow frame by the blurRadius, while the `clearRegionRect` insets by spread distance. We then use `CGRectOffset` to push it offscreen. We save this offset so we can use it later to get the CG shadow back in place (since this is all originally derived from `shadowFrame`.
* There is now a single place that dictates the size of the shadow (`shadowFrame`), and a single place that dictates the offset to push our rects offscreen. The necessary change to trace padding box and not content box therefore just needs to change `shadowFrame` as opposed to 4 other spots.
* Additionally, when we offset, we do not need to worry about things like spread and blur, since `CGRectInset` takes care of that along with the size
Changelog: [Internal]
Reviewed By: NickGerleman
Differential Revision: D60201959
fbshipit-source-id: 4ecf0e0db8ce9d54f08e89adec94d50eb19a26a3
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45679
`cornerRadiiForBoxShadow(cornerRadii, 0)` no-ops since there is no spread, and it returns the same type as it takes as an input, so there is no point for this complexity
Changelog: [Internal]
Reviewed By: NickGerleman
Differential Revision: D60203620
fbshipit-source-id: c1f86ce6e8fef07365ab57caa3e906f1601a0c2b
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45678
This doesn't need to be an explicit path, its just tracing out a rect. CG has a method for that
Changelog: [Internal]
Reviewed By: NickGerleman
Differential Revision: D60202842
fbshipit-source-id: 61faa21e57b1341c3b96961f12503eb4a7f3020b
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45824
changelog: [internal]
add a bounds check to prevent crash in TouchTargetHelper.
as it turns out, firstReactAncestor may be bigger than the size of pathAccumulator.
Reviewed By: christophpurrer
Differential Revision: D60449741
fbshipit-source-id: 4e981d06877e26d278c4567beebebd82262f60d0
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45822
Changelog: [internal]
## Context
`react-native/Libraries/Renderer/shims/ReactFabric` is the default module to load the RN renderer and loading it has side-effects (among other things it sets `global.RN$stopSurface`.
We introduced a proxy module (`RendererProxy`) so we could use dependency injection to overwrite the renderer module with a custom implementation (the original goal was to be able to use a renderer version that didn't pull paper and only used Fabric).
Unfortunately, using both the proxy and the module directly in some places leads to race conditions setting `global.RN$stopSurface`, which causes some screens to be rendered with one renderer and unmounted/disposed with a different one (because we accessed `ReactFabric` later and set `RN$stopSurface` from a different renderer implementation). When this happens, the unmount request in the other renderer is a no-op because no surface was renderer in it. This leads to surfaces not being disposed.
## Changes
This modifies the proxy to add additional functions and modifies all other modules in the package to make sure that all the accesses to the renderer go through the proxy.
Reviewed By: sammy-SC
Differential Revision: D60452544
fbshipit-source-id: 1b17a95ed9b1c529718f22983dde1f00f1b2adae
Summary:
Issue: https://github.com/facebook/react-native/issues/45596
## Changelog:
[INTERNAL] [CHANGED] - Migrate `GenerateCodegenSchemaTaskTest.kt` to AssertJ testing library
<!-- 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/45807
Test Plan: Run `./gradlew -p packages/gradle-plugin test`
Reviewed By: andrewdacenko
Differential Revision: D60509334
Pulled By: cortinico
fbshipit-source-id: 0702958f0c9d03994b0c9a6a1c743f5db84e5703
Summary:
Issue: https://github.com/facebook/react-native/issues/45596
## Changelog:
[INTERNAL] [CHANGED] - Migrate `PreparePrefabHeadersTaskTest.kt` to AssertJ testing library
<!-- 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/45808
Test Plan: Run `./gradlew -p packages/gradle-plugin test`
Reviewed By: andrewdacenko
Differential Revision: D60509282
Pulled By: cortinico
fbshipit-source-id: 1b7d9f0c24bb0e8e573f685582c532a38e6b3b13
Summary:
Fixes [44566](https://github.com/facebook/react-native/issues/44566)
Issue was onChangeText was called 5-6 times if maxLength was set in a multiline component and TextInput Value was changed via state update.
`if (_maxLength) {
NSInteger allowedLength = MAX(
_maxLength.integerValue - (NSInteger)backedTextInputView.attributedText.string.length + (NSInteger)range.length,
0);
if (text.length > allowedLength) {
// If we typed/pasted more than one character, limit the text inputted.
if (text.length > 1) {
if (allowedLength > 0) {
// make sure unicode characters that are longer than 16 bits (such as emojis) are not cut off
NSRange cutOffCharacterRange = [text rangeOfComposedCharacterSequenceAtIndex:allowedLength - 1];
if (cutOffCharacterRange.location + cutOffCharacterRange.length > allowedLength) {
// the character at the length limit takes more than 16bits, truncation should end at the character before
allowedLength = cutOffCharacterRange.location;
}
}
// Truncate the input string so the result is exactly maxLength
NSString *limitedString = [text substringToIndex:allowedLength];
NSMutableAttributedString *newAttributedText = [backedTextInputView.attributedText mutableCopy];
// Apply text attributes if original input view doesn't have text.
if (backedTextInputView.attributedText.length == 0) {
newAttributedText = [[NSMutableAttributedString alloc]
initWithString:[self.textAttributes applyTextAttributesToText:limitedString]
attributes:self.textAttributes.effectiveTextAttributes];
} else {
[newAttributedText replaceCharactersInRange:range withString:limitedString];
}
backedTextInputView.attributedText = newAttributedText;
_predictedText = newAttributedText.string;
// Collapse selection at end of insert to match normal paste behavior.
UITextPosition *insertEnd = [backedTextInputView positionFromPosition:backedTextInputView.beginningOfDocument
offset:(range.location + allowedLength)];
[backedTextInputView setSelectedTextRange:[backedTextInputView textRangeFromPosition:insertEnd
toPosition:insertEnd]
notifyDelegate:YES];
[self textInputDidChange];
}
return nil; // Rejecting the change.
}}`
This is the original code snippet.
It was happening because of wrong check of maxLength with text length `if (text.length > allowedLength)` this should be
`(text.length > _maxLength.integerValue)` and `if (allowedLength <= 0)` we should not change the string and fire `textInputDidChange`
## Changelog:
[IOS] [FIXED] : Fixing maxLength check which was firing onChange multiple times
For more details, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests
Pull Request resolved: https://github.com/facebook/react-native/pull/45401
Test Plan:
Tested in Ios
Ran yarn test
<img width="1661" alt="Screenshot 2024-07-12 at 1 00 28 PM" src="https://github.com/user-attachments/assets/fbad94a8-9989-4252-ad7d-e507d4eafd9e">
Reviewed By: sammy-SC
Differential Revision: D59911745
Pulled By: cipolleschi
fbshipit-source-id: 67410ec50d6a2415e568e1685699bfed02fd0a27
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45838
Some Internal tests in the old architecture were failing after landing [#45414](https://github.com/facebook/react-native/pull/45414) because the `RCTNativeAnimatedModule` in the old architecture was not declaring the event.
This change fixes it by declaring the event that is never fired in the Old Architecture as it is not needed.
## Changelog
[iOS][Added] - Declare the `onUserDrivenAnimationEnded` in the old Architecture
Reviewed By: sammy-SC
Differential Revision: D60507812
fbshipit-source-id: eb12563c6551204bcf98f3a2001e1efcf84ef05e
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45803
This makes the same rough changes as I made to images, to apply background styles in view manager layer, using BackgroundStyleApplicator, including new boxShadow style property.
Changelog: [Internal]
Reviewed By: mdvacca
Differential Revision: D60409795
fbshipit-source-id: 304cb99855de72fe36af33cdda4a150e21b629b9
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45797
Android borders are drawn using a path generated by `addRoundRect()` inset by half the border width, using the full border width as stoke width. The edges of the ellipsis drawn for rounded borders do not line up with the math used to trace the bounding border-box path.
In a relatively similar hack to elsewhere in border drawing code for gap between content and the border, we inset the clipOut path, as if its bounding rectangle were about half a subpixel smaller, to mininally overlap the border on these edges. We then place the outer box shadows under the border in z-ordering, so that the minimal extra insetting is only visible with transparent backgrounds.
Changelog: [Internal]
Reviewed By: joevilches
Differential Revision: D60389685
fbshipit-source-id: 8c449cc3eee1a3e4100f06fd87f27ae341e02eac
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45781
This adds some RNTester examples for `boxShadow`, that render correctly when `ReactNativeFeatureFlags.enableBackgroundStyleApplicator()` is set!
Changelog: [Internal]
Reviewed By: joevilches
Differential Revision: D60367850
fbshipit-source-id: 3c9ae2bf906ae923c713b5f36cd2000f612fe3dc
Summary:
Backout of the [commit](https://github.com/facebook/react-native/commit/afa887b6225352d35ed99eb5271bef8a3fe1c7d6) to react to the new event as it is breaking internal tests.
## Changelog:
[General][Changed] - Revert React to onUserDrivenAnimationEnded event in JS
Reviewed By: mdvacca, arushikesarwani94
Differential Revision: D60467143
fbshipit-source-id: c70bb057adf49b5f26df4201f8b987bf6b876f46
Summary:
Backout of this [commit]() as the previous one was making some E2E fail and need to investigate further.
## Changelog:
[Internal] - Add back `_shouldEmitEvent` guardrails
Reviewed By: mdvacca, arushikesarwani94
Differential Revision: D60467145
fbshipit-source-id: a703022aa74ca0ed0fed05b59da68918eb2001e1
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45795
Changelog: [internal]
Our modules to set up the runtime have side-effects and depend on import order to work correctly. This is error-prone and complicates the migration to ESM in some cases, so this refactors all of them in `src/private/setup` to export a function instead.
Reviewed By: rshest
Differential Revision: D60382506
fbshipit-source-id: 9ac30b29659b74605d59eb97562d6cbf01f48e47
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45793
Changelog: [internal]
These files are safe to move because they haven't been enabled in OSS and people shouldn't be importing them directly.
Reviewed By: rshest
Differential Revision: D60381603
fbshipit-source-id: bba62b56c42817b15bb28bce22d6c2cf668dc797
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45791
Changelog: [internal]
These files are safe to move because they haven't been enabled in OSS and people shouldn't be importing them directly.
Reviewed By: rshest
Differential Revision: D60377869
fbshipit-source-id: 02bc0335385859c0589a494de9b59b0c2ebc06f6
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45792
Changelog: [internal]
These files are safe to move because they haven't been enabled in OSS and people shouldn't be importing them directly.
Reviewed By: rshest
Differential Revision: D60377868
fbshipit-source-id: db0ec2839af91620fe8b6d3927ad0b809d1bdf23
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45784
Changelog: [internal]
I originally created `src/private/core` as a directory to contain set up files for RN, but the name wasn't implying that and ended up holding more stuff.
This moves everything out of that directory and renames it as `src/private/setup` so it has a clearer scope.
Reviewed By: NickGerleman
Differential Revision: D60290620
fbshipit-source-id: b5dc27fbaa64df9a8a09a84f02023896f6fd2884
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45414
This change completes the fix for broken pressable when animations were applied to components with native driven animations.
When creating the AnimatedProps, if they are natively drive animation, we look for the AnimatedValue involved and we register a listener. This is needed to make sure that the NativeModule will send te updated value upon calling the `update` function.
Then, when observing the props lifecycle, it register a listener to the new `OnUserAnimationEnded` event, fired by the NativeAnimation module.
When the `OnUserAnimationEnded` event is fired, the AnimatedProps will update the props that depends on the user driven animation.
## Changelog
[General][Fixed] - reallign the shadow tree and the native tree when the user finishes interacting with the app.
Reviewed By: sammy-SC
Differential Revision: D59681428
fbshipit-source-id: c6690c41ea6d5517b7f8413e9dba1e12861a2400
Nick Gerleman
Kyle Rosenberg
Thomas Nardone
Alan Lee
omer-ayhan
Bogusz Kaszowski
Joe Vilches
Ruslan Shestopalyuk
Samuel Susla
Rubén Norte
Nicola Corti
Deepanshu.shukla
Riccardo Cipolleschi
Arushi Kesarwani
Andrew Datsenko