Summary:
This diff updates the documentation for enableCppRenderSystem feature flag
This is a follow up of D38725771 (https://github.com/facebook/react-native/commit/399907fe4ad843ac6aa0aa2f553ba3aee3c83006)
changelog: [internal] internal
Reviewed By: cortinico, makovkastar
Differential Revision: D39558834
fbshipit-source-id: e079ee688a912dfa2670c66e5adf347a902a45e1
Summary: Changelog: [Internal] Add flow declaration for Alert. Couldn't figure out how to do type statics on interfaces in Flow.
Reviewed By: yungsters
Differential Revision: D39186533
fbshipit-source-id: 928ee76080490a133c9773d2330473a688e0612d
Summary:
This diff creates a new Feature Flag to Enable/Disable C++ Render System in JS
Changelog: [Internal] Internal
Reviewed By: sammy-SC
Differential Revision: D38725771
fbshipit-source-id: 3a238781bec427274dbd8f7c045d360135d1803e
Summary:
This task has been created T131775291 that blames D39268920 (https://github.com/facebook/react-native/commit/f1c1f8116ba1cfa9d10c5b8c30b98b796047b9c2). I reverted part of the changes and added the support of capital letters for the font weight. It should make the test pass.
However, I am a bit puzzled: I tried to change the title of the `GemstoneTitleBar` and the test was not showing the changed value. I think I'm missing something.
Changelog: [Internal]
Reviewed By: GijsWeterings
Differential Revision: D39478951
fbshipit-source-id: d3e28336fe52c5c58b49872c3f5b6e63e1e37ca5
Summary:
When `getItemLayout` is not supplied, VirtualizedList doesn't know the measurements for its child items ahead of time. It caches most recent cell measurements so that an item which is virtualized away is associated with its correct height. VirtualizedList will not consume space for an item it has not yet rendered/knows measurements for.
This also means an initially created list will only take up the height of its `initialNumToRender()`. This can cause scroll jumping for the scenario of nested VirtualizedLists of the same orientation, since a virtualized away child list will shrink (compared to the spacer), then re-expand, once returned to.
There is logic in the VirtualizedList constructor to load cached frame metrics based on supplied listKey, to enable reloading most recent state. Though locally it seems to be reading the context too early in the lifecycle (compared to other successful checks during componentDidMount, render). It was moved from `componentDidMount` to `constructor` as part of the initial change (https://www.internalfb.com/diff/D6330846 (https://github.com/facebook/react-native/commit/2668dc8e1be7bf93e65ca2e11c87cbeef3310c3e)?dst_version_fbid=131968984136932&transaction_fbid=1578362385612542), and I think has likely been unreliable or dead since.
Restoring state was the only usage of a durable key for nested lists beyond their lifetime. So removing the dead code lets us remove the need for a `listKey`, which has been error-prone. This still leaves the problem present since inception, but there may be alternate solutions like scroll anchoring.
Changelog:
[Internal][Removed] - Remove dead code for restoring state to nested VirtualizedList
Reviewed By: ryancat
Differential Revision: D39466678
fbshipit-source-id: fc2f39802e5cdf9b920974333be64c74211b99a9
Summary:
This updates `fontVariant` to support space-separated string values, i.e., `'small-caps common-ligatures'`, thus aligning it with the [CSS Fonts Module Level 4](https://drafts.csswg.org/css-fonts/#font-variant-prop) specification as requested on https://github.com/facebook/react-native/issues/34425. This also adds unit tests to the `processFontVariant` function ensuring the style processing works as expected.
## Changelog
[General] [Added] - Add space-separated string support for fontVariant
Pull Request resolved: https://github.com/facebook/react-native/pull/34641
Test Plan:
This can be tested either through `processFontVariant-tests` or by using the following code:
```js
<Text
style={{
fontVariant: 'small-caps common-ligatures',
}} />
```
Reviewed By: javache
Differential Revision: D39423317
Pulled By: cipolleschi
fbshipit-source-id: ad971addb423ed338e178528a11fe9d456c03e6e
Summary:
This aligns the logic of setting style (width / height) and source of Android with iOS.
iOS handles nullish uris with set width and heigth by passing them through. Android did not.
## Changelog
[Android] [Fixed] - Align android image style / source logic with ios
Pull Request resolved: https://github.com/facebook/react-native/pull/34655
Test Plan:
```
<Image source={{width: 100, height: 100}} />
```
Before this Patch:
* iOS: Renders a blank image with 100x100
* Android: Renders a blank image with 0x0
After this Patch:
* iOS: Renders a blank image with 100x100
* Android: Renders a blank image with 100x100
Reviewed By: sammy-SC
Differential Revision: D39423391
Pulled By: cipolleschi
fbshipit-source-id: 997c06dea42e9b69fda12b678a1b82ad8319537f
Summary:
Changelog:
[General][Fixed] In RN devtools, call that method, and then set component state to not inspecting.
Reviewed By: lunaruan
Differential Revision: D38852009
fbshipit-source-id: d14bd4cc4461f0f7ec4ae9cd6098a58eef3e6ab9
Summary:
Changelog:
[General][Fixed] - Currently selectNode doesn't work for Fabric. Passing the instance instead of a tag to `selectNode` works.
Reviewed By: lunaruan
Differential Revision: D38851141
fbshipit-source-id: 7640d0f31fb099346a4d8205981e262da6be4990
Summary:
Jest 27 [flips defaults](https://jestjs.io/blog/2021/05/25/jest-27#flipping-defaults), making "modern" fake timers (ie, `sinonjs/fake-timers`) the default, over "legacy", which we currently use.
We're not quite ready for modern timers yet, partly due to Promise polyfills (https://github.com/facebook/react-native/pull/34659), and also some internal issues with specific tests.
This makes our use of legacy timers explicit in preparation for an update to Jest. A switch to modern timers may follow later.
Changelog:
[Internal][Changed] - Prepare for Jest 27+ by making legacy fake timer use explicit
Reviewed By: jacdebug
Differential Revision: D39383719
fbshipit-source-id: 6a3dc6f8547cc76f7702a5a39c9b30a184303f17
Summary:
This test currently uses `jest.runAllTicks()` to execute cached, immediately-resolving promises, under Jest "legacy" timers (the RN default) - this works only because [we polyfill Promise](https://github.com/facebook/react-native/blob/main/jest/setup.js#L24) using a userland JavaScript implementation that internally uses mocked-out timer functions.
Here we change to a more universal approach by adding a new microtask/promise to the end of the queue and awaiting it.
This allows us to remove our Promise polyfill from Jest setup (to follow).
Changelog:
[Internal][Fixed] - Prepare `LogBoxLog-test.js` for native promises
Reviewed By: huntie
Differential Revision: D39418413
fbshipit-source-id: 1384ef385b1e10261754513369af8997d296ffea
Summary:
This test was causing uncaught promise rejections, because the mocked `symbolicateStackTrace` in this test returns a different type from the real one, causing `LogBoxSymbolication`'s unawaited, cached promises to reject.
This wasn't picked up as a test failure because our `promise` polyfill silently swallows uncaught rejections, but it does cause a failure if we use native promises in tests.
Changelog:
[Internal][Fixed] - Fix LogBoxSymbolication-test.js
Reviewed By: huntie
Differential Revision: D39418412
fbshipit-source-id: 0be8f1551c4a58dc47faf1597caf47271af40af2
Summary:
This PR adds support for number values for `fontWeight` as requested in https://github.com/facebook/react-native/issues/34425.
## Changelog
<!-- Help reviewers and the release process by writing your own changelog entry. For an example, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests
-->
[General] [Added] - Added support for number values in fontWeight.
Pull Request resolved: https://github.com/facebook/react-native/pull/34598
Test Plan:
```js
<Text style={{ fontWeight: 900, color: 'red' }}>
Hello World
</Text>
```
Reviewed By: jacdebug
Differential Revision: D39268920
Pulled By: cipolleschi
fbshipit-source-id: 9bb711677bf173f9904b74f382659042856efd83
Summary:
This adds the `id` prop to `Text`, `TouchableWithoutFeedback` and `View` components as requested on https://github.com/facebook/react-native/issues/34424 mapping the existing `nativeID` prop to `id`. As this components are inherited by others this also adds the `id` prop support to `Image`, `TouchableBounce`, `TouchableHighlight`, `TouchableOpacity` and `TextInput`.
This PR also adds android tests ensuring that the `id` property is passed to the native view via the `nativeID` prop, these tests were based on the existing `nativeID` tests ([NativeIdTestCase.java](https://github.com/facebook/react-native/blob/main/ReactAndroid/src/androidTest/java/com/facebook/react/tests/NativeIdTestCase.java)).
## Changelog
[General] [Added] - Add id prop to Text, TouchableWithoutFeedback and View components
Pull Request resolved: https://github.com/facebook/react-native/pull/34522
Test Plan: Ensure that the new `id` prop android tests pass on CircleCI
Reviewed By: lunaleaps
Differential Revision: D39089639
Pulled By: cipolleschi
fbshipit-source-id: 884fb2461720835ca5048004fa79096dac89c51c
Summary:
Changelog: [internal]
This brings back a fix for ScrollView on iOS that we removed because we thought it was no longer necessary, but it actually is.
Reviewed By: jacdebug
Differential Revision: D39382967
fbshipit-source-id: f052b4fb899f4e60e8c530990caf07344a907c43
Summary:
This adds a a couple of tests to run existing behavior where VirtualizedList avoids batched renders until it has seen scroll metrics when the list is not initialized to the zero position.
Changelog:
[Internal][Added] - Add VirtualizedList tests for handling non-zero initialScrollIndex before scroll metrics
Reviewed By: yungsters
Differential Revision: D39247250
fbshipit-source-id: 530f58f9c7421949c388048c376fc5b0ab7835d9
Summary:
This PR aims to add support for objectFit a partial equivalent to the resizeMode style and prop of Image.
## Changelog
[General] [Added] - Add support for objectFit style of Image.
Pull Request resolved: https://github.com/facebook/react-native/pull/34576
Test Plan:
1. Open the RNTester app and navigate to the Image page
2. See the Object Fit section.
Reviewed By: rickhanlonii
Differential Revision: D39261176
Pulled By: jacdebug
fbshipit-source-id: 1eefd76b6c11ed5fc52b2c524ad78c91051077f6
Summary:
Changelog: [internal]
This replaces all direct references to the `ReactNative` module (which is the Paper renderer) to `RendererProxy` which would select between Paper and Fabric correctly.
The implementation of these functions is exactly the same right now.
As per the removal of the fix for T55744311 in `ScrollView`, I verified this doesn't cause any issues in the screen where it failed before.
Reviewed By: javache
Differential Revision: D39270691
fbshipit-source-id: 03882748fe4b754b9a2c5e9d4c4f003b94ed49ef
Summary:
This replaces all direct references to `ReactNative` within the `react-native` package to use `findNodeHandle` with a reference obtained from `RendererProxy`, which will allow us to select the correct renderer.
Changelog: [internal]
Reviewed By: javache
Differential Revision: D39270689
fbshipit-source-id: a39875281ba7b7b1b00128564124b6adcacebc4d
Summary:
This diff creates a proxy module to interact with the React Native renderer. The goal of this proxy is to decouple usages of several functions (e.g.: `findNodeHandle`, etc.) from the actual renderer used in an app. This way, we can easily switch between renderers without having to change code depending on it.
This will be useful to remove a specific renderer from an app bundle when it's no longer used (e.g.: Paper on the Facebook App).
Changelog: [Internal]
Reviewed By: javache
Differential Revision: D39205975
fbshipit-source-id: 05289c0c3c8cd26d81aa1d2163097c73ec40c6ad
Summary:
The `Systrace` module implements a polyfill for the User Timing API that's:
1. Incompatible with the Web standard. This polyfill expects `performance.mark` and `performance.measure` to be used exactly like `Systrace.beginEvent` and `Systrace.endEvent` respectively. If not used like those functions, they throw an error at runtime, which is really bad.
2. Never actually used. See below.
This polyfill is only installed if we're actually profiling on startup:
https://www.internalfb.com/code/fbsource/[4d888a933920]/xplat/js/react-native-github/Libraries/Core/setUpSystrace.js?lines=17-21
While the only code that we have that uses this API is actually not installed if we're profiling:
https://www.internalfb.com/code/fbsource/[4d888a933920]/xplat/js/react-native-github/Libraries/Core/setUpDeveloperTools.js?lines=20-21
This should be safe to remove then.
We have plans to add proper support for this API in the short term, so this also gets out of the way of doing that.
Additionally, installing this polyfill was the only reason why we had `setupSystrace`, so we can get rid of that too :)
Changelog: [Internal]
Reviewed By: javache
Differential Revision: D39210813
fbshipit-source-id: a90b6237c311d2157069b41975d10b33f1f464ef
Summary:
This unifies the Android only `autoComplete` and the iOS only `textContentType` TextInput props with the web `autoComplete` values as requested on https://github.com/facebook/react-native/issues/34424. I left the `textContentType` prop and the current supported `autoComplete` values untouched in order to avoid having a breaking change. This also updates RNTester to include test cases using the new `autoComplete` values
## Changelog
<!-- Help reviewers and the release process by writing your own changelog entry. For an example, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests
-->
[General] [Changed] - Unify TextInput autoComplete and textContentType props
Pull Request resolved: https://github.com/facebook/react-native/pull/34523
Test Plan:
1. Open the RNTester app and navigate to the TextInput page
2. Test the `TextInput` component through the `Text Auto Complete` section
https://user-images.githubusercontent.com/11707729/187118267-3b509631-7b84-47b7-a580-567a7f5b483f.mov
Reviewed By: NickGerleman
Differential Revision: D39104545
Pulled By: cipolleschi
fbshipit-source-id: a0d4b1b9ab336854a741a9efe4a62c3da0b5c0f4
Summary:
This adds `aria-live` alias for `accessibilityLiveRegion`, it unifies aria-live and accessibilityLiveRegion and also maps `aria-live='off'` to `accessibilityLiveRegion='none'` as requested on https://github.com/facebook/react-native/issues/34424
## Changelog
<!-- Help reviewers and the release process by writing your own changelog entry. For an example, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests
-->
[General][Added] - Added aria-live alias for accessibilityLiveRegion.
Pull Request resolved: https://github.com/facebook/react-native/pull/34555
Test Plan:
```js
<View aria-live="polite">
<Text>Clicked {this.state.count} times</Text>
</View>
<View aria-live="off">
<Text>Clicked {this.state.count} times</Text>
</View>
```
Reviewed By: cipolleschi
Differential Revision: D39206291
Pulled By: jacdebug
fbshipit-source-id: fd2019e7047ff7ff6133fed39f1a70b5a9396f89
Summary:
FillRateHelper accesses frame metrics based on passed state/cellsAroundViewport on scroll. cellsAroundViewport may be [0, -1] for no items. Usually this is captured by the check that item count is zero, but it is possible to have items without yet expanding state to render the items. This adds a check to bail early if we are not yet rendering any viewport-related cells.
Also renamed "state" to "cellsAroundViewport" for more consistent naming with the new list, where it is no longer the only state.
Reviewed By: javache
Differential Revision: D39345705
fbshipit-source-id: 198ab46ff2c8e8fe64076c9150edd4914dd745d7
Summary:
This adds support for the `userSelect` style attribute, mapping the already existing selectable attribute as requested on https://github.com/facebook/react-native/issues/34425. This PR also updates the TextExample.android and TestExample.ios on the RNTester in order to facilitate the manual QA of this.
## Changelog
[General] [Added] - Add support for `userSelect` style
Pull Request resolved: https://github.com/facebook/react-native/pull/34575
Test Plan:
- open the RNTester app and navigate to the Text page
- Check the `Selectable Text` through the Selectable text section
<Image src="https://user-images.githubusercontent.com/22423684/188112863-65acd145-76b0-47ba-8bc6-f72298077096.png" height="600" width="300" />
Reviewed By: yungsters
Differential Revision: D39252798
Pulled By: jacdebug
fbshipit-source-id: f7fabf20ee68778d75461f511c56f94d0d756d9c
Summary: VirtualizedList would more gracefully handle out of range cells than VirtualizedList_EXPERIMENTAL, which treats it as an invariant violation. D39244112 (https://github.com/facebook/react-native/commit/7aa203beda3cd358703c2fa535ed045771761612) attempted to fix an issue where recalculation of cells around viewport can include out of range cells, but it is still showing up later. This change adds a bounds check to the remaining branch we control, and an assertion that `computeWindowedRenderLimits` is not returing something out of range to discover if that is the cause.
Reviewed By: yungsters
Differential Revision: D39267445
fbshipit-source-id: 64c99da28b5b01ef61784079b586e355f73764a1
Summary:
Non-integer `initialScrollIndex` or values to `scrollToIndex` would produce a reasonable result, with the caveat that it always falls back to layout estimation (will only be correct when all items are the same size), and breaks if getItemLayout() is supplied. It has usage though, so this diff adds proper support for non-integer scrollIndex, to offset a given amount into the length of the specific cell.
This overlaps a bit with the optional `viewOffset` and `viewPosition` arguments in `scrollToIndex`, but there isn't really the equivalent API for `initialScrollIndex`.
Changelog:
[General][Added]- Add proper support for fractional scrollIndex in VirtualizedList
Reviewed By: yungsters
Differential Revision: D39271100
fbshipit-source-id: 4d93887eed4497e9f6abcd1a6117ac7fdaebf2b1
Summary:
This PR is for adding the support for `crossOrigin`, `referrerPolicy`, `width`, `height` and `srcSet` props to Image Component and mapping the `src` prop to `source.uri` of Image Component for the issue https://github.com/facebook/react-native/issues/34424. An example is also added in the RNTester ImageExample.
## Changelog
[General] [Changed] - Map the `src` prop to `source.uri` prop in Image Component.
[General] [Added] - added `crossOrigin`, `referrerPolicy`, `width`, `height` and `srcSet` props to Image Component.
Pull Request resolved: https://github.com/facebook/react-native/pull/34481
Test Plan:
1. Navigate to Image Component Example in the RNTester app.
2. Contains an example of the Image component using the `src` and `srcSet` prop.
3. For headers, inspect the Image request using Flipper.
<img src="https://user-images.githubusercontent.com/32268377/186153246-d7b72ce3-e082-46d9-87d1-aefacd3af34f.png" height="500" />
Reviewed By: christophpurrer
Differential Revision: D38982041
Pulled By: cipolleschi
fbshipit-source-id: dd6594e39b8f3b36cfcdafa35695254034f1fb7f
Summary:
The `JSDevSupport` module is incompatible with Fabric. Given it's not used internally and it's undocumented in OSS, we decided to remove it altogether.
Changelog: [Internal]
Reviewed By: javache, nlutsenko
Differential Revision: D39305892
fbshipit-source-id: 82455701a0b9ba83e6f971fc774280dceb2b22e0
Summary:
This adds the ` aria-hidden` prop to `Pressable`, `TouchableBounce`, `TouchableHighlight`, `TouchableNativeFeedback`, `TouchableOpacity`, `TouchableWithoutFeedback` and `View` components as requested on https://github.com/facebook/react-native/issues/34424, being an alias `importantforAccessibility='no-hide-descendants'` on Android and an alias for `accessibilityElementsHidden` on iOS. This PR also updates RNTester AccessibilityExample in order to facilitate the manual QA.
## Changelog
[General] [Added] - Add aria-hidden prop to Pressable, View and Touchables components
Pull Request resolved: https://github.com/facebook/react-native/pull/34552
Test Plan:
1. Open the RNTester app and navigate to the Accessibility page
2. Test the `aria-hidden` prop through the `View with hidden children from accessibility tree` section, this can be tested either by enabling Voice Over if you're using a real device or through the Accessibility Inspector if you're using a simulator
https://user-images.githubusercontent.com/11707729/187814455-6937e33e-7edd-434e-b7d3-ee6c03f635ca.mov
Reviewed By: NickGerleman
Differential Revision: D39206245
Pulled By: jacdebug
fbshipit-source-id: 551dc671fbcedc824f253e22b8d7753c466838c7
Summary: VirtualizedList would more gracefully handle out of range cells than VirtualizedList_EXPERIMENTAL, which treats it as an invariant violation. This attempts to fix an issue where recalculation of cells around viewport can include out of range cells.
Reviewed By: rshest
Differential Revision: D39244112
fbshipit-source-id: 20fe6ea552035061d9d00720fcab77b29a785771
Summary:
This adds `pointerEvents` style which is equivalent to `pointerEvents` prop as requested in https://github.com/facebook/react-native/issues/34425
## Changelog
<!-- Help reviewers and the release process by writing your own changelog entry. For an example, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests
-->
[General] [Added] - Added pointerEvents style equivalent to pointerEvents prop
Pull Request resolved: https://github.com/facebook/react-native/pull/34586
Test Plan:
```
<View
style={{
pointerEvents: 'none'
}}
>
</View>
```
Reviewed By: cipolleschi
Differential Revision: D39252830
Pulled By: jacdebug
fbshipit-source-id: 94f265a6b6940a4371e7985d5de3b8143693e069
Summary:
Changelog:
[General][Added] - Added an overlay similar to Inspector.js that allows directly selecting elements on RN from React DevTools
This diff updates DevToolsHighlighter into DevToolsOverlay. It now also allows DevTools user to select an element to inspect directly from DevTools.
Depends on https://github.com/facebook/react/pull/25111 to work.
TODOs:
- Currently once an element selected on RN, the inspector toggle isn't turned off automatically.
- Fabric support depends on https://github.com/facebook/react/pull/25118
Reviewed By: lunaruan
Differential Revision: D38815494
fbshipit-source-id: 7e1e3a78f6594960b5dfaec142bafd3ca4b146af
David Vacca
Luna Wei
Rujin Cao
Marshall Roch
Riccardo Cipolleschi
Nick Gerleman
Gabriel Donadel Dall'Agnol
Alex Smeshkov
Danilo Bürger
Tianyu Yao
Samuel Susla
Rob Hogan
Daksh Bhardwaj
ankit-tailor
Viraj-10
Rubén Norte
Agastya Darma Laksana
Mayank Sunil Pagar
Anne Pham
dhruvtailor7
cyrus25
madhav23bansal
Pavel Matyukov
