Summary:
Changelog: [Internal] - Remove all imports back to CJS for changelog in 0.72
We are reverting these imports as it may regress perf as we don't have a recommended inlining solution for ES modules at the current time.
Reviewed By: NickGerleman
Differential Revision: D43630911
fbshipit-source-id: ff3bb80009f327c4d51dad21f2cd287ce46d5964
Summary:
After reviewing the doc [`Image`](https://reactnative.dev/docs/image), the typescript compiler doesn't know the following properties:
- src
- srcSet
- referrerPolicy
- tintColor
- objectFit
But after reviewing the source code and this [`commit`](https://github.com/facebook/react-native/commit/b2452ab216e28e004dc625dd8e1ad32351a79be9), the `objectFit` property isn't one related to the Image component but to the `style` props, making the official doc outdated. So, an [`issue in the react-native-website repo`](https://github.com/facebook/react-native-website/issues/3579) have been created and I decided to not include the objectFit prop in this PR.
So, this PR includes those properties: sec, secSet, referrerPolicy and tintColor
## Changelog
[GENERAL][FIXED] Add src, srcSet, referrerPolicy, tintColor to Image.d.ts declaration file
Pull Request resolved: https://github.com/facebook/react-native/pull/36214
Reviewed By: NickGerleman
Differential Revision: D43437894
Pulled By: rshest
fbshipit-source-id: 497426490134aba0a474c49bf8bab9131f2e5845
Summary:
Update podspecs with the right search paths to include the required framework by every module.
## Changelog:
[iOS][Changed] - Update search paths to support `use_frameworks!` with Fabric
Reviewed By: sammy-SC, dmytrorykun
Differential Revision: D43089372
fbshipit-source-id: 4bbfc4b98bd289d66ce4015429d581856d9c05b3
Summary:
This makes it so that React Native unit tests will fail if code unexpectedly outputs a warning or error (which would show as a redbox error).
This logic split out from the normal `jest/setup.js` which is included by the jest-preset, to only effect our tests instead of existing RN Jest users.
Changelog:
[Internal][Changed] - Fail tests on `console.error()` or `console.warn()`
Reviewed By: huntie
Differential Revision: D41564032
fbshipit-source-id: 3cc7d3a8433fcb75f654669b9c350dea2da937a8
Summary:
`aria-labelledby` Flow types were added to the Text props on https://github.com/facebook/react-native/commit/f353119113d6fc85491765ba1e90ac83cb00fd61 but the text component does not support `accessibilityLabelledBy`, which is the prop we were supposed to map `aria-labelledby` to. As the Text component does not really support `aria-labelledby` this PR updates the `TextProps` documentation to explain that this prop is necessary for cross-platform purposes and that other platforms need it.
## Changelog
[Android] [Changed] - Add notes to `aria-labelledby` from Text props
Pull Request resolved: https://github.com/facebook/react-native/pull/35327
Test Plan: Ensure CI is green
Reviewed By: necolas
Differential Revision: D41280877
Pulled By: lunaleaps
fbshipit-source-id: 81cf016bcf3117f15385ddd119c44d6f9fdd6b68
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/35169
This reorganizes typing structure a bit.
`Utilities.d.ts` was originally added for utilitiy types but I ended up leaving it a grab bag of types that didn't belong to any individual bit of code. Out of what is in it right now, `Insets` was actually public, and seems to have been imported.
We also run into files around the renderer which are [currently overwritten](https://github.com/facebook/react-native/commits/e286da25fc83324363486eb668806aca179f74b3/Libraries/Renderer/implementations/ReactNativeRenderer.d.ts) by the React sync script.
Finally, all of the top-level imports of `Utilities` were auto-generated by VS Code, but fail in real apps. I think this is because our tsconfig sets a `baseUrl` to allow resolution from the types folder, so the tooling in the RN repo will use that, but it breaks in real apps that don't have that mapping.
This splits all these up into a couple separate directories that are hopefully easier to reason about, and removes `Omit` which has been a builtin type for quite some time (we were actually already using built-in `Omit`).
Changelog:
[General][Fixed] - Fixup TS Organization
Reviewed By: cipolleschi
Differential Revision: D40932319
fbshipit-source-id: 0b6e3e3eda603885b4dc01dcb9f5233aa546d128
Summary:
In 2017, React published v15.5 which extracted the built-in `prop types` to a separate package to reflect the fact that not everybody uses them. In 2018, React Native started to remove `PropTypes` from React Native for the same reason. In 0.68 React Native introduced a deprecation warning which notified users that the change was coming, and in 0.69 we removed the PropTypes entirely.
The feedback we've received from the community is that there has not been enough time to migrate libraries off of PropTypes. This has resulted in users needing to patch the React Native package `index.js` file directly to add back the PropTypes, instead of migrating off of them. We can empathize with this fix short term (it unblocks the upgrade) but long term this patch will cause users to miss important changes to `index.js`, and add a maintenance cost for users.
Part of the reason there was not enough time is that we didn't do a good job surfacing libraries that were using PropTypes. This means, when you got a deprecation warning, it wasn't clear where the source of the usage was (either in your code or in a library). So even if you wanted to migrate, it was difficult to know where to actually make the change.
In the next release, we've made it easier to find call sites using deprecated types by [fixing the code frame in errors](https://github.com/react-native-community/cli/pull/1699) reporting in LogBox, and ensuring that [the app doesn't crash without a warning](https://github.com/facebook/react-native/pull/34650). This should make it easier to identify exactly where the deprecated usage is, so you can migrate it.
To help users get off of the patch, and allow more time to migrate, we're walking back the removal of PropTypes, and keeping it as a deprecation for a couple more versions. We ask that you either migrate off PropTypes to a type system like TypeScript, or migrate to the `deprecated-react-native-prop-types` package.
Once we feel more confident that the community has migrated and will not need to patch React Native in order to fix this issue, we'll remove the PropTypes again. **If you have any trouble finding the source of the PropType usage, please file an issue so we can help track it down with you.**
Changelog:
[General][Changed] - Add back deprecated PropTypes
Reviewed By: yungsters
Differential Revision: D40725705
fbshipit-source-id: 8ce61be30343827efd6dc89a012eeef0b6676deb
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/35038
React-jsi provides JSI to allow React Native to interface with JavaScriptCore.
The hermes-engine Pod provides a second copy of JSI, as Hermes is built and linked statically with JSI.
This second copy of JSI would lead to an [ODR Violation](https://en.cppreference.com/w/cpp/language/definition).
To resolve this, when Hermes is enabled:
- React-hermes and hermes-engine are installed.
- React-jsc is not installed.
- React-jsi continues to be installed.
- React-jsi will not build JSI.
- React-jsi will declare a dependency on hermes-engine.
The result is that the JSI dependency for React Native is satisfied by hermes-engine, and there is no duplicate JSI library in the project.
When Hermes is disabled:
- React-jsi and React-jsc are installed.
- React-hermes and hermes-engine are not installed.
- React-jsi will build JSI.
Changelog:
[iOS][Changed] Resolve JSI ODR violation, make hermes-engine the JSI provider when Hermes is enabled
Reviewed By: cipolleschi
Differential Revision: D40334913
fbshipit-source-id: 409407a193a35cbd21b0e8778537b3627e4c54a2
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/35031
The React-jsi Pod was serving two purposes: building JSI, and configuring JavaScriptCore as the JS engine.
By splitting the React-jsi Pod into React-jsi and React-jsi, we can start working towards de-coupling the JSI dependency from any particular JS engine.
Pods that depended on React-jsi, now depend on React-jsi and React-jsc.
One exception to this is React-hermes, which is only installed when Hermes is enabled, and thus does not require JavaScriptCore.
Upcoming commits should take care of removing the React-jsc dependency when Hermes is enabled, but it is out of scope for this commit.
Changelog:
[iOS][Changed] - The JSC Runtime is now provided by the React-jsc Pod instead of React-jsi. Libraries that declared a dependency on React-jsi in order to specifically create a JSC runtime (`makeJSCRuntime()`) will need to add React-jsc to their dependencies.
Reviewed By: dmytrorykun
Differential Revision: D40442603
fbshipit-source-id: b9b21146b9deb401f80cfef76a87c9867754a953
Summary:
circleci analyze_code errors: https://app.circleci.com/pipelines/github/facebook/react-native/16638/workflows/76804803-ceb5-4fb3-bd24-26bbb9826827/jobs/321696
- __Image.flow and Image.ios:__ requires needed to be sorted alphabetically
- __error-utils-test.js:__ duplicate describe block title is used, i believe this was a typo
Changelog:
[Internal][Fixed] - fix circleci:analyze_code errors
Reviewed By: lunaleaps
Differential Revision: D40491001
fbshipit-source-id: a1df6ded77374f92e297d0a8866a2c4096e1196a
Summary:
D31464478 enabled clang-format by default across projects, but opted out directories with a lot of formatting errors. This removes the opt-out, so clang-format is run in that directory as well.
Changelog:
[Internal][Changed] - Remove clang-format opt-out for Libraries
Reviewed By: lunaleaps
Differential Revision: D40310275
fbshipit-source-id: abe154ab466798fbfa010364a3627f40ca18b179
Summary:
This adds the `alt` prop to the `Image` component as requested on https://github.com/facebook/react-native/issues/34424. Using this new `alt` prop enables the `accessibility` prop and passes down the alt text to `accessibilityLabel`. This PR also updates RNTester ImageExample in order to facilitate the manual QA.
#### Open questions
- ~~On web `alt` text is displayed on the page if the image can't be loaded for some reason, should we implement this same behavior if the `Image` component fails to load `source`?~~ Not for now
## Changelog
[General] [Added] - Add alt prop to Image component
Pull Request resolved: https://github.com/facebook/react-native/pull/34550
Test Plan:
1. Open the RNTester app and navigate to the Image page
2. Test the `alt` prop through the `Accessibility Label via alt prop` 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/187790249-0d851363-c30e-41b6-8c24-73e72467f4ba.mov
Reviewed By: lunaleaps
Differential Revision: D39618453
Pulled By: cipolleschi
fbshipit-source-id: 0e26b2574514e76ce7e98ddb578f587a9cc30ee9
Summary:
React Native's TS definitions are currently mostly stored in one monolithic file. This change splits the definitions up to correspond to the source files they came from, and are placed next to the source files. I think this should help inform, and make it easy to update the TS declarations when touching the Flow file.
I noticed as part of the change that the typings have not yet removed many APIs that were removed from RN. This is bad, since it means using the removed/non-functional API doesn't cause typechecker errors. Locating typings next to source should prevent that from being able to happen.
The organization here means individual TS declarations can declare what will be in the RN entrypoint, which is a little confusing. Seems like a good potential next refactor, beyond the literal translation I did.
Changelog:
[General][Changed] - Place TS Declarations Alongside Source Files
Reviewed By: lunaleaps, rshest
Differential Revision: D39796598
fbshipit-source-id: b36366466fd1976bdd2d4c8f7a4104a33c457a07
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:
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:
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:
This adds the `tintColor` prop to the Image component to replace the non-standard `style.tintColor` as requested on https://github.com/facebook/react-native/issues/34424, so that React Native for Web does not have to deopt styles for Image rendering. I didn't have to change anything on Android as `tintColor` was already being passed down to the native component as a prop. This PR also updates RNTester ImageExample in order to facilitate the manual QA.
## Changelog
[General] [Added] - Add tintColor prop to Image component
Pull Request resolved: https://github.com/facebook/react-native/pull/34534
Test Plan:
1. Open the RNTester app and navigate to the Image page
2. Test the `tintColor` prop through the `Tint Color` section
https://user-images.githubusercontent.com/11707729/187444761-ce5fd949-89f3-4d73-9717-31d035c6ee6b.mov
Reviewed By: necolas
Differential Revision: D39133292
Pulled By: jacdebug
fbshipit-source-id: 314e0ed47ab65366153e730667a31554bc2b6aa7
Summary:
Small typo fix.
## Changelog
[General] [Fixed] - Typo in AssetSourceResolver
Pull Request resolved: https://github.com/facebook/react-native/pull/34520
Test Plan: No test plan is required. Just check the file changes.
Reviewed By: NickGerleman
Differential Revision: D39087572
Pulled By: cipolleschi
fbshipit-source-id: a79253d2486ee21fbf5683177b21ec534607d65d
Summary:
Previously published by [grgr-dkrk][2] as [https://github.com/facebook/react-native/issues/31296][3], fixes the following issues:
1) ImportantForAccessibility="no" does not work on Text, Button
2) ImportantForAccessibility="no-hide-descendants" does not work on Text, Button, or ImageBackground.
Note: On ImageBackground, focus is prevented on the imageBackground node itself, but focus is not prevented on its descendants.
Note: [Button component expected behavior for prop importantForAccessibility][4]
>Some components like Button seem like atomic units, but they end up rendering a hierarchy of components for example a wrapper View with a Text inside them. Allowing those descendants to become focusable, breaks the model of these being a single component to consider and forcing no-hide-descendants makes sense here.
>The other option is always to render any descendants of these elements with importantForAccessibility="no", so they can never be focusable on their own. This would have the same result, **BUT may potentially cause issues when the descendant content is supposed to automatically get moved up to the focusable ancestor to act as a label** (which is what Talkback does with unfocusable text elements by default).
Note: [importantForAccessibility="no" does not allow screenreader focus on nested Text Components with accessibilityRole="link" or inline Images][5]
fixes https://github.com/facebook/react-native/issues/30850 related https://github.com/facebook/react-native/pull/33690
## Changelog
[Android] [Fixed] - adding importantForAccessibility for Text, Button, ImageBackground
Pull Request resolved: https://github.com/facebook/react-native/pull/34245
Test Plan:
1) testing ImageBackground importantForAccessiblity ([link to test][1])
2) importantForAccessibility="no" does not allow screenreader focus on nested Text Components with accessibilityRole="link" or inline Images ([link to test][5])
3) testing ImageBackground importantForAccessiblity ([link to test][6])
4) Button with importantForAccessibility=no ([link to test][7])
[1]: https://github.com/facebook/react-native/pull/31296#issuecomment-1192341626 ""
[2]: https://github.com/grgr-dkrk "grgr-dkrk"
[3]: https://github.com/facebook/react-native/pull/31296 "https://github.com/facebook/react-native/issues/31296"
[4]: https://github.com/facebook/react-native/pull/31296#discussion_r616184584 "expected behaviour with prop importantForAccessibility in Button component"
[5]: https://github.com/facebook/react-native/issues/30850#issuecomment-1192286477 "importantForAccessibility=no does not allow screenreader focus on nested Text Components with accessibilityRole=link or inline Images"
[6]: https://github.com/facebook/react-native/pull/34245#issuecomment-1192446124 "testing ImageBackground importantForAccessiblity"
[7]: https://github.com/facebook/react-native/pull/34245#issuecomment-1192443589 "Button with importantForAccessibility=no"
Reviewed By: cipolleschi
Differential Revision: D38121992
Pulled By: dmitryrykun
fbshipit-source-id: 368b4dcb47d7940274820aa2e39ed5e2ca068821
Summary: Add annotations to function parameters required for Flow's Local Type Inference project. This codemod prepares the codebase to match Flow's new typechecking algorithm. The new algorithm will make Flow more reliable and predictable.
Reviewed By: bradzacher
Differential Revision: D37388949
fbshipit-source-id: cdcbc98035ce9b6994842005ea46df42de54f9b8
Summary: Add annotations to function parameters required for Flow's Local Type Inference project. This codemod prepares the codebase to match Flow's new typechecking algorithm. The new algorithm will make Flow more reliable and predicatable.
Reviewed By: evanyeung
Differential Revision: D37360113
fbshipit-source-id: 870bcfe680542b3861fefbaf372db0ae8b32cbf3
Summary:
Bumping RTC-Folly version used to address CVE-2022-24440.
## 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
-->
[General][Security] - Bump RTC-Folly to 2021-07-22
Pull Request resolved: https://github.com/facebook/react-native/pull/33841
Reviewed By: Andjeliko, philIip
Differential Revision: D36425598
Pulled By: cortinico
fbshipit-source-id: d38c5f020dbecf794b10f12ed2da30e1825071af
Summary: Some files relying on -include_pch and therefore they miss Foundation.h and UIKit.h includes. This diff is fixing missing imports
Reviewed By: rmaz
Differential Revision: D37140239
fbshipit-source-id: bc57921e0c8365e0e9a5a571d607ba40ff1b31f3
Summary:
Please see this issue https://github.com/facebook/react-native/issues/33034 for details on the problem solved by this PR.
## 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
-->
[CATEGORY] [TYPE] - Message
[ios] [changed] - HTTP Response headers added to the error object passed to JS code.
Pull Request resolved: https://github.com/facebook/react-native/pull/33880
Test Plan:
Tested:
(All tests done on images in rn-tester app, which is a part of this repo)
1. onError method in case image has an HTTP Error
2. onError method in case of non http error (DNS error)
3. Successful image load
Reviewed By: cortinico
Differential Revision: D37066159
Pulled By: cipolleschi
fbshipit-source-id: 546f7678fa0321fe6c6fbef55288715cb6ddc2fd
Summary:
We are working on making the empty object literal `{}` have the type `{}` - i.e. exact empty object - rather than being unsealed.
Some manual fixes, in particular to React Native code, which is used and can be synced to other repos (e.g. WWW).
With these changes, error diff in Xplat is down to ~1990 errors
Note that after I roll out `exact_empty_objects`, I'll codemod all the `{...null}` (the only way to get an exact empty object currently) back to `{}`
Changelog: [Internal]
Reviewed By: SamChou19815
Differential Revision: D36142838
fbshipit-source-id: 054caf370db230f42a4c5f5706c88979ef246537