23c8787fe2
Add annotations to fix future errors after fix for unsound array types ( #52691 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/52691
Unannotated array literals are unsound in Flow right now. This diff adds in annotations and makes a few things readonly, to reduce future errors.
Changelog: [Internal]
Reviewed By: marcoww6
Differential Revision: D78519638
fbshipit-source-id: d98a7668ecf97bcc87dcb3fad25ade736d885d9a
2025-07-17 17:30:43 -07:00
3e6423fe65
RN: Flowify packages/rn-tester ( #51788 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/51788
Adds `flow` to the remaining files that are lacking it in the `packages/rn-tester` directory.
This also adds any necessary type annotations and fixes lint warnings.
Changelog:
[Internal]
Reviewed By: SamChou19815
Differential Revision: D75899307
fbshipit-source-id: 27a74ed0007b3b754446a45931c2c148312d5e3a
2025-06-04 12:03:52 -07:00
e3d607fc2e
Fix new arch refresh control not shown when refreshing on mount ( #49240 )
...
Summary:
- In the old architecture on iOS, it was possible to begin refreshing a [`RefreshControl`](https://reactnative.dev/docs/refreshcontrol ) backed by [`RCTRefreshControl.m`](https://github.com/facebook/react-native/blob/ea876054cfdcdfba1d8ded69ab359f20072aef6c/packages/react-native/React/Views/RefreshControl/RCTRefreshControl.m ) on mount (see [old arch rn-tester video](https://github.com/user-attachments/assets/0a759072-8931-438b-b9af-698b5f8fa072 )).
- In the new architecture on iOS, when attempting to refresh on mount, the `RefreshControl` backed by [`RCTPullToRefreshViewComponentView.mm`](https://github.com/facebook/react-native/blob/ea876054cfdcdfba1d8ded69ab359f20072aef6c/packages/react-native/React/Fabric/Mounting/ComponentViews/ScrollView/RCTPullToRefreshViewComponentView.mm ) is not shown. Additionally, recycled `RefreshControl`s are missing their [`title`s](https://reactnative.dev/docs/refreshcontrol#title-ios ) (see [new arch rn-tester video](https://github.com/user-attachments/assets/22f87a82-4703-470b-9c00-6454eb9458dd )).
- This change fixes the new arch issues mentioned above, so that the new arch behaves the same as the old arch did (see [new arch rn-tester video with fix](https://github.com/user-attachments/assets/3ab6c90c-6ad4-4dc7-b2f5-7cf1378e50b9 )).
- This change also updates the rn-tester [`RefreshControlExample`](https://github.com/facebook/react-native/blob/442a368af5bda653e84514b870084c73607645eb/packages/rn-tester/js/examples/RefreshControl/RefreshControlExample.js ) to include a refresh-on-mount to prevent future regressions
## Changelog:
[IOS] [FIXED] - Fix new arch RefreshControl wasn't shown when refreshing on mount
[IOS] [FIXED] - Fix new arch recycled RefreshControl was missing its title
[INTERNAL] [CHANGED] - Update rn-tester RefreshControlExample to refresh on mount
Pull Request resolved: https://github.com/facebook/react-native/pull/49240
Test Plan:
- I created a [video](https://github.com/user-attachments/assets/0a759072-8931-438b-b9af-698b5f8fa072 ) of the baseline old arch behavior by overriding [`new_arch_enabled`](https://github.com/facebook/react-native/blob/main/packages/react-native/scripts/cocoapods/new_architecture.rb#L163-L165 ) to return `false`
- I created a [video](https://github.com/user-attachments/assets/22f87a82-4703-470b-9c00-6454eb9458dd ) of the broken new arch behavior by overriding [`new_arch_enabled`](https://github.com/facebook/react-native/blob/main/packages/react-native/scripts/cocoapods/new_architecture.rb#L163-L165 ) to return `true`
- I applied the changes in this PR and created a [video](https://github.com/user-attachments/assets/3ab6c90c-6ad4-4dc7-b2f5-7cf1378e50b9 ) that confirms that the new arch with fix now behaves the same as the old arch
- I also used [patch-package](https://github.com/ds300/patch-package ) to verify that the changes in this PR work as expected in my production React Native app, running `react-native@0.77 .0`, with the new arch now enabled by default. Note that this app uses [`react-navigation`](https://github.com/react-navigation/react-navigation ) and [`react-native-screens`](https://github.com/software-mansion/react-native-screens ), which I expected might complicate the fix. The changes in this PR continue to work as expected, even with the complications of those popular libraries.
## Details:
- All of my changes were inspired by the many years of fixes that are included in [`RCTRefreshControl.m`](https://github.com/facebook/react-native/blob/ea876054cfdcdfba1d8ded69ab359f20072aef6c/packages/react-native/React/Views/RefreshControl/RCTRefreshControl.m ), which haven't yet been included in the new [`RCTPullToRefreshViewComponentView.mm`](https://github.com/facebook/react-native/blob/ea876054cfdcdfba1d8ded69ab359f20072aef6c/packages/react-native/React/Fabric/Mounting/ComponentViews/ScrollView/RCTPullToRefreshViewComponentView.mm )
- My `_isBeforeInitialLayout` is inspired by the old [`_isInitialRender`](https://github.com/facebook/react-native/blob/442a368af5bda653e84514b870084c73607645eb/packages/react-native/React/Views/RefreshControl/RCTRefreshControl.m#L17 )
- My `layoutSubviews` is inspired by the old [`layoutSubviews`](https://github.com/facebook/react-native/blob/442a368af5bda653e84514b870084c73607645eb/packages/react-native/React/Views/RefreshControl/RCTRefreshControl.m#L43-L59 )
- My `beginRefreshingProgrammatically` is inspired by the old [`beginRefreshingProgrammatically`](https://github.com/facebook/react-native/blob/442a368af5bda653e84514b870084c73607645eb/packages/react-native/React/Views/RefreshControl/RCTRefreshControl.m#L72-L107 )
- I have tried to comment all of the unexpected changes. Some of these comments are taken directly from the old `RCTRefreshControl.m`
- In general, it seems like [`UIRefreshControl`](https://developer.apple.com/documentation/uikit/uirefreshcontrol ) ignores many style updates, and even calls to `beginRefreshing`, until it's been added to the view hierarchy. That's why the `layoutSubviews` hack was needed in the old arch, and is similarly needed in this PR.
- Here's a [Stack Overflow answer](https://stackoverflow.com/a/67758859 ) that hints at this, by saying that `beingRefreshing` needed to be called in a ViewController's `viewWillAppear` lifecycle callback
- Here's a different [Stack Overflow answer](https://stackoverflow.com/a/32688124 ) that shows that `viewWillLayoutSubviews` (and by extension, all of the subviews' `layoutSubviews`) is indeed called after `viewWillAppear`
- Since `_refreshControl` effectively ignores updates until the first `layoutSubviews` call, I needed to buffer all calls to `updateProps:oldProps:` into my new `_initialProps` before finally re-calling `updateProps:oldProps:` with `_initialProps` against `PullToRefreshViewShadowNode::defaultSharedProps` in `layoutSubviews`
- Additionally, I needed to move the `if` block regarding refreshing from the top of `updateProps:oldProps:` to the bottom of it, because `_refreshControl` ignores updates that are made after the call to `beginRefreshing`
## Known issues:
- There is one small difference between the old arch and the new arch with this PR. The old arch [programmatically animates the pull down content offset](https://github.com/facebook/react-native/blob/442a368af5bda653e84514b870084c73607645eb/packages/react-native/React/Views/RefreshControl/RCTRefreshControl.m#L89-L102 ), whereas this PR does not. See `[scrollView setContentOffset:offset]` in the PR code.
- I tried animating it with the block below, and this did work in the rn-tester app. However, it caused the fix to not work when used with the extremely popular `react-navigation` and `react-native-screens` libraries. In that case, the `RefreshControl` exhibited the same buggy behavior of not being shown when refreshing on mount.
```objective-c
[UIView animateWithDuration:0.25 delay:0 options:UIViewAnimationOptionBeginFromCurrentState animations:^{
[_scrollViewComponentView.scrollView setContentOffset:offset];
} completion:^(BOOL finished) {
[_refreshControl beginRefreshing];
}];
```
- I thought it would be better to fix this for a larger number of real-world scenarios without animation than it would be to fix it for just the rn-tester app with animation.
Reviewed By: javache
Differential Revision: D69980100
Pulled By: cipolleschi
fbshipit-source-id: bbacd8ffffff5d87728a1c8c0063acc60215d1a6
2025-02-25 02:19:37 -08:00
c9ea05552f
RN: Fix lint/sort-imports Errors ( #47109 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/47109
Fixes the `lint/sort-imports` errors that are now surfaced after fixing the lint configuration.
For a couple files, I added lint suppressions instead because the unsorted import ordering is important due to interleaved calls with side effects.
Changelog:
[Internal]
Reviewed By: GijsWeterings
Differential Revision: D64569485
fbshipit-source-id: 26415d792e2b9efe08c05d1436f723faae549882
2024-10-18 04:07:02 -07:00
09682b5109
Fix dark mode text ( #46898 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46898
Replaces *many* `Text` component usages with `RNTesterText`: a thin wrapper around `Text` that applies color based on the color scheme chosen by the user. It makes text legible for dark mode across 41 different example files. This changes intentionally do not touch a few larger component sites that expand beyond RNTester, like `Animated` and `NewAppScreen`
Changelog: [Internal]
Reviewed By: rshest
Differential Revision: D64053464
fbshipit-source-id: 9516fef2afe1b364eb38e85e3a2dbb5c434e44db
2024-10-10 11:02:18 -07:00
5b96e90f77
Replace React.Element<any> and unnecessarily specific React.Element with React.MixedElement ( #45923 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45923
Changelog: [Internal]
Reviewed By: gkz
Differential Revision: D60872182
fbshipit-source-id: b81fb43968c52cbfdb4a9fa57f1175aabc2a3939
2024-08-06 21:33:08 -07:00
d6e0bc714a
Enable lint/sort-imports everywhere ( #41334 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/41334
TSIA.
Changelog: [Internal]
Reviewed By: robhogan
Differential Revision: D51025812
fbshipit-source-id: e10d437be775a6b80946483aa96460f34927f870
2023-11-06 12:59:38 -08:00
aa2a0c1115
New RNtester e2e tests ( #39117 )
...
Summary:
The motivation was to create more e2e tests that test other components in the RNTester app.
The list of components that have been tested is below:
| Component|Test is added|Platform|
| :--- | :----: |---: |
|DrawerLayoutAndroid|NO|Android|
|ActivityIndicator|YES|iOS & Android|
|Button|YES|iOS & Android|
|FlatList|YES|iOS & Android|
|Image|NO|iOS & Android|
|JSResponderHandler|YES|iOS & Android|
|InputAccessoryView|NO|iOS|
|KeyboardAvoidingView|YES|iOS & Android|
|Modal|YES|iOS & Android|
|New App Screen|YES|iOS & Android|
|Pressable|YES|iOS & Android|
|RefreshControl|YES|iOS & Android|
|ScrollView|NO|iOS & Android|
|ScrollViewSimpleExample|YES|iOS & Android|
|SafeAreaView|NO|iOS|
|ScrollViewAnimated|NO|iOS & Android|
|ScrollViewIndicatorInsets|NO|iOS|
|SectionList|NO|iOS & Android|
|StatusBar|NO|iOS & Android|
|SwipeableCard|NO|iOS & Android|
|Switch|NO|iOS & Android|
|Text|NO|iOS & Android|
|TextInput|NO|iOS & Android|
|Touchable* and onPress|NO|iOS & Android|
|TextInputs with key prop|NO|Android|
|TransparentHitTestExample|NO|iOS|
|View|NO|iOS & Android|
|New Architecture Examples|NO|iOS & Android|
|Performance Comparison Examples|NO|iOS & Android|
## Changelog:
[General] [Added] - Added next component tests for RNTester
Pull Request resolved: https://github.com/facebook/react-native/pull/39117
Test Plan:
Follow Readme file.
## Test Result:
For iOS platform:<br>
For Android platform:<br>
Reviewed By: yungsters
Differential Revision: D48828525
Pulled By: cipolleschi
fbshipit-source-id: dfe7cc9871666a6b5c0704a207ca1eeb65f50114
2023-09-01 03:24:30 -07:00
8bd3edec88
Update copyright headers from Facebook to Meta
...
Reviewed By: aaronabramov
Differential Revision: D33367752
fbshipit-source-id: 4ce94d184485e5ee0a62cf67ad2d3ba16e285c8f
2021-12-30 15:11:21 -08:00
77ecc7ede1
JS: Format with Prettier v2.4.1 [3/n]
...
Summary:
Changelog:
[General][Internal]
Reviewed By: zertosh
Differential Revision: D31883447
fbshipit-source-id: cbbf85e4bf935096d242336f41bf0cc5d6f92359
2021-11-02 22:14:16 -07:00
e48e63709c
Use example or module description
...
Summary: Changelog: [Internal] RNTester to only show the module description. Example descriptions to follow
Reviewed By: yungsters
Differential Revision: D29571326
fbshipit-source-id: 973e0031fedee805e75c010fbf59833205801640
2021-07-15 23:26:28 -07:00
1270873ed6
RNTester UI Redesign ( #29685 )
...
Summary:
This Pull request adds the UI changes to the RNTester app as discussed in the MLH Fellowship.
This list is not exhaustive.
- The initial App screen is redesigned.
- A bottom Navbar has been added.
- Filter pills are added.
- The list card UI is updated.
- The example page UI is updated.
- Recently Viewed Sections are added. It shows the last 5 recently viewed components/APIs.
- Bookmarking functionality is added.
- The documentation URL is added to the example page.
- RNTester doesn't lose its state on a hard refresh (even on iOS).
<img width="373" src="https://user-images.githubusercontent.com/22813027/90530113-20346180-e192-11ea-8ef6-789fa25b402b.png " />
<img width="373" src="https://user-images.githubusercontent.com/22813027/90530112-20346180-e192-11ea-9539-706b540fcc5f.png " />
<img width="373" src="https://user-images.githubusercontent.com/22813027/90530100-1d397100-e192-11ea-8836-b88070643233.png " />
<img width="373" src="https://user-images.githubusercontent.com/22813027/90530110-1f9bcb00-e192-11ea-936b-64ee75fa4289.png " />
Pull Request resolved: https://github.com/facebook/react-native/pull/29685
Test Plan:
Imported from GitHub, without a `Test Plan:` line.
{F302717939}
Note: this failed **before** this diff too:
{F302745716}
Reviewed By: mdvacca, cpojer
Differential Revision: D23240434
fbshipit-source-id: 65e2766a6a097eca0e0d0fda8dadf6871e9276c2
Co-authored-by: agarwalmanya <manya18ag@gmail.com >
Co-authored-by: chirag-singhal <csinghal208@gmail.com >
Co-authored-by: Ansh Godha <ag759@cornell.edu >
Co-authored-by: Yash Kumar Verma <yk.verma2000@gmail.com >
Co-authored-by: Sanskar Jethi <sansyrox@gmail.com >
Co-authored-by: Aniketh Saha <anik220798@gmail.com >
Co-authored-by: Xtremilicious <nilarjundas@outlook.com >
Co-authored-by: Jani Evakallio <jani.evakallio@gmail.com >
2020-08-26 08:45:57 -07:00
63992c0b96
Migrating RNTester to Packages Directory ( #29567 )
...
Summary:
## Changelog
<!-- Help reviewers and the release process by writing your own changelog entry. For an example, see:
https://github.com/facebook/react-native/wiki/Changelog
-->
This PR aims to migrate the RNTester App to `packages` directory. But is currently, open to inspect the CI issues and resolve the merge conflicts.
Currently done
- Working on iOS
- Working on Android
- Detox Tests working on iOS
Need to work on
- Errors generated by the CI builds
[General] [Changed] - Migrated the RNTester App to the packages directory.
Pull Request resolved: https://github.com/facebook/react-native/pull/29567
Test Plan: It runs on both ios and android for now and the detox iOS builds are working.
Reviewed By: cpojer
Differential Revision: D23034761
Pulled By: rickhanlonii
fbshipit-source-id: e04bb06e1c7ef15d340206090d1575a871b9e6f5
2020-08-19 17:57:08 -07:00
Sam Zhou
Tim Yung
Julian Tigler
Peter Abbondanzo
Moti Zilberman
Elżbieta Berger
Andres Suarez
Tim Yung
Luna Wei
Ankit Tiwari
stealthanthrax
