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
Summary:
this PR fixes a few small ESLint issues that were showing up under PR diffs.
## Changelog:
[INTERNAL] [FIXED] - Fix various ESLint issues
Pull Request resolved: https://github.com/facebook/react-native/pull/46379
Test Plan: ran JS tests + linter; all passing
Reviewed By: cipolleschi
Differential Revision: D62385788
Pulled By: NickGerleman
fbshipit-source-id: b33d7ade4696bbaed2ac1a3fc2e0b3dff9bb04b7
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/42690
Issues triggered by `InspectorProxy*` tests under `packages/dev-middleware` (T169943794) can be root-caused to `dev-middleware` performing Babel registration within a test run, after Jest has hooked its own transformer.
Babel registration is only required when running this code (`dev-middleware`, etc) directly from source - we already have the `BUILD_EXCLUDE_BABEL_REGISTER` mechanism to strip it out from production builds, but we currently don't prevent registration under tests, where Jest's transformer should be allowed to do its work.
This adds the same `babel-plugin-transform-define` mechanism that we use for production builds to the Jest transformer.
Changelog:
[Internal] Prevent inadvertent Babel registration during running of repo tests
Reviewed By: huntie
Differential Revision: D53125777
fbshipit-source-id: 1f0a20315c96edaf79054e29a80c7a9561e5b352
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/39251
As `react-native/babel-preset` is extended to include parts of codegen (written in Flow) via `react-native/babel-plugin-codegen`, we need to register Babel (with a Node JS config) in order to load the `react-native/babel-transformer` that Jest needs to transform RN code when running from source.
(This is *only* relevant to running from source, ie internally at Meta or when developing on a clone of the OSS repo)
Changelog: [Internal]
Reviewed By: huntie
Differential Revision: D48871440
fbshipit-source-id: 2f206b2380d67007e37782f211a6e831b35291f8
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/38771
Changelog: [Internal]
Metro has been passing `inlineRequires: false` to Babel transformers for the last 5 years (D9636747), as the inline requires transform had been hoisted into the transform worker. Here we clean up the unused code paths in React Native's implementations of the Metro Babel transformer API, and the unused properties in the API itself.
Reviewed By: GijsWeterings
Differential Revision: D48034441
fbshipit-source-id: d24a793962942a3c87461ffbade847ea749dac95
Summary:
X-link: https://github.com/facebook/metro/pull/1024
Pull Request resolved: https://github.com/facebook/react-native/pull/38228
Changelog: [General][Changed] - Move react-native-babel-transformer and react-native-babel-preset from Metro to React Native repo.
Metro Changelog: **[Breaking]** - Remove `metro-react-native-babel-transformer` and `metro-react-native-babel-preset`, to be published as `react-native/metro-babel-transformer` and `react-native/babel-preset` instead.
This diff does the following:
- Move `metro/packages/metro-react-native-babel-preset` to `react-native/packages/react-native-babel-preset`.
- Rename `metro-react-native-babel-preset` package to `react-native/babel-preset`.
- Move `metro/packages/metro-react-native-babel-transformer` to `react-native/packages/react-native-babel-transformer`.
- Rename `metro-react-native-babel-transformer` package to `react-native/metro-babel-transformer`.
- Upadate dependencies.
Reviewed By: robhogan
Differential Revision: D46977466
fbshipit-source-id: 32478f63a0442b61a1804f12ef814c8b29d7f8bb
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/38554
@public
Upgrades React Native, Relay, and Metro to use `hermes-parser@0.14.0`.
This also changes the repository's Jest configuration to now use `hermes-parser`.
Changelog:
[Internal]
Reviewed By: SamChou19815
Differential Revision: D47522140
fbshipit-source-id: 207ccd0c4e4489d486731d0c847d8089abc1cc72
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/38146
Now that `metro-react-native-babel-transformer` may be loaded from source without transformation, we can remove this workaround / potential footgun.
Jest uses Babel imperatively and doesn't rely on registration (require hooks), so registering within the preprocessor potentially conflicts and has caused problems before. This just tidies up some complexity we don't need.
Changelog: [Internal]
Reviewed By: christophpurrer
Differential Revision: D47162728
fbshipit-source-id: 06215f9bb7b8e71bcca0429d0bae9f20a22f45a8
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/37915
Enable the `prettier-plugin-hermes-parser` in xplat. This plugin enables the use of `hermes-parser` which is significantly faster than the current flow parser prettier bundles (improves formatting time by ~50%) and also brings support for the latest Prettier 3.0.0 printing logic for JS. This upgrade is required in order to enable upcoming Flow features that add new syntax.
Changelog: [Internal]
Reviewed By: SamChou19815
Differential Revision: D46748891
fbshipit-source-id: 3775ef9afa7c04e565fa4fcf8ca5b410f49d35a1
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/36623
Changelog:
[General][Changed] - The default `metro.config.js` in apps now extends `react-native/metro-config`, and should be updated in existing apps.
~~`react-native/rn-get-polyfills.js` is removed and should be updated to `react-native/js-polyfills` in existing apps (this is part of the new default config).~~
#publish-packages-to-npm
## Context
### React Native Metro config → React Native repo (https://github.com/facebook/react-native/pull/36502)
We (the React Native team) are aiming to relocate the default Metro config for React Native out of `react-native-community/cli-plugin-metro` and **into the React Native repo + app template** as a new `react-native/metro-config` package.
This is the first (and minimum viable) phase we can ship to separate the release process of Metro from RN CLI in order to reduce coupling and iterate faster for our users.
**See full motivation, design, and test plan (which previewed the CLI bump) here: https://github.com/facebook/react-native/pull/36502**
## Changes
NOTE: This PR is pending the inclusion of a bump to `react-native-community/cli`, and will be sequenced after https://github.com/react-native-community/cli/pull/1875 is merged.
- Upgrade `react-native-community/cli` to `11.0.0`, upgrade all `metro` packages to `0.76.0` (version distributed in this CLI release).
- Update the `metro.config.js` file in `packages/react-native/template/`.
- Now merges defaults from `react-native/metro-config`, and can be used with CLI >= 11.0.0.
- Update the `metro.config.js` files for `packages/react-native/` and `packages/rn-tester/` (these are integration test locations).
- Now merges defaults from `react-native/metro-config`, and can be used with CLI >= 11.0.0.
Changes to `react-native/metro-config` — `0.72.1` (prepared but not depended on yet):
- Export `mergeConfig` util (removing direct `metro-config` dependency in consuming projects).
- Explicitly depend on `metro-react-native-babel-transformer` and `metro-runtime` (transitively included today).
Reviewed By: cortinico, blakef
Differential Revision: D44099691
fbshipit-source-id: 405635dd69fd50a1e9548279eaeda3c932b5b167
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/36523
`jest/private/preprocessor.js` is only used to run tests on the workspace itself, it's not part of our exported Jest preset and is specifically excluded from publication in the `react-native` package.
Now that we have the monorepo setup, this belongs at the workspace root.
- `metro-react-native-babel-transformer` moved from RN `dependencies` to root `devDependencies` because it's only used by the preprocessor
- `jest/create-cache-key-function` added to `devDependencies` - it's also used by the `assetTransformer` in the public preset.
Changelog: [Internal]
Reviewed By: hoxyq
Differential Revision: D44197879
fbshipit-source-id: 0bbd9e2f500f53fa4f16562f05374dc601b67df6
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/36495
It looks like Jest is not running `babel/transform-modules-commonjs` on all files, and therefore when including `"import"` as a Package Exports condition in Jest, this misbehaved (0a3c55562b).
This is a hotfix to restore CI stability.
Changelog:
[Fix][Internal] Hotfix adjusting Jest changes added in 0a3c55562b
Reviewed By: cipolleschi, hoxyq
Differential Revision: D44130442
fbshipit-source-id: 6407519d0d5459ef422afe21be26a2e3141bedf3
Summary:
Updates the default set of `"exports"` condition names in our `ReactNativeEnv` for Jest, so that it aligns with the defaults in React Native CLI (https://github.com/react-native-community/cli/pull/1862).
Also includes a subtle update to how this is accomplished. Instead of overriding `exportConditions()`, we assign to the underlying class property — this allows users (once https://github.com/facebook/jest/pull/13989 is merged) to override `customExportConditions` via [`testEnvironmentOptions`](https://jestjs.io/docs/configuration#testenvironmentoptions-object).
```js
preset: 'react-native',
testEnvironmentOptions: {
customExportConditions: ['test', 'react-native'],
},
```
Changelog: [Internal]
Reviewed By: jacdebug
Differential Revision: D43879056
fbshipit-source-id: 86fffe2b5fdf9d8492d25b8b12a78be75b5fa3be
Summary:
The version using `jest.spyOn()` stopped working at some point. Couldn't find any relevant setup changes, but this form seems to work.
Changelog:
[Internal]
Reviewed By: christophpurrer
Differential Revision: D43669469
fbshipit-source-id: 89d207117e9a56ae3374aed47a8a75fdf2e644fd
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:
This change aligns requestAnimationFrame implementation used in Jest environment with web standard, and with the implementation that runs in the application environment.
As per specification https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame#parameters – requestAnimationFrame callback gets a single parameter, which represents the current frame timestamp. The current polyfill maps requestAnimationFrame directly to setTimeout which makes the callback execute without any parameters.
## Changelog
[General] [Fixed] - Jest mocked requestAnimationFrame callbacks now receive a timestamp parameter
Pull Request resolved: https://github.com/facebook/react-native/pull/35919
Test Plan:
1. execute jest test suite to make sure nothing breaks
2. add the below code to one of the tests:
```
jest.useFakeTimers();
requestAnimationFrame((timestamp) => console.log("rAF", timestamp));
jest.runOnlyPendingTimers();
jest.useRealTimers();
```
this code will print `undefined` before and numer `0` representing the mocked frame time after this change.
Reviewed By: jacdebug
Differential Revision: D42676544
Pulled By: robhogan
fbshipit-source-id: 363dc506ccc4bd034408fbb35ad3151875a8d309
Summary:
Changelog:
[General][Changed] - renamed react-native/polyfills -> react-native/js-polyfills and align with other packages versions (0.72.0) as a part of migration to monorepo
Reviewed By: motiz88
Differential Revision: D41553157
fbshipit-source-id: eef70c8e7639080acdeb6716d1a915760a85458a
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:
This PR is the follow up to the conversation started here by SimenB: https://github.com/react-native-community/discussions-and-proposals/issues/509
Basically, we want to move RN to use its own custom environment so that we can tweak it going forward - this PR in fact only sets up the groundwork for that; robhogan mentioned that with this in place, Meta engineers can
> iterate on it (with jest-environment-node as a starting point) against our internal product tests
This is also connected to Rob's work to bring Jest 29 into the codebase https://github.com/facebook/react-native/pull/34724 and my "mirror" PR to bring template in main up to the same version (https://github.com/facebook/react-native/pull/34972)
## 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] - move Jest config to use a custom react-native Jest env
Pull Request resolved: https://github.com/facebook/react-native/pull/34971
Test Plan: Tested that `yarn test` in main works fine after the changes; CI and Meta's internal CI will also serve the purpose of verifying that it works (but there's no reason not to since it's still pretty much just relying on `node`).
Reviewed By: huntie
Differential Revision: D40379760
Pulled By: robhogan
fbshipit-source-id: 2c6d0bc86d337fda9befce0799bda2f56cc4466c
Summary:
`getSize` should resolve with an array of `[width, height]` but this mock resolves with `{ width, height }`.
It should be `ReadOnlyArray<number>` instead of `{width: number, height: number}`
The native image loader call is [here](https://github.com/facebook/react-native/blob/main/Libraries/Image/NativeImageLoaderIOS.js#L18):
```js
+getSize: (uri: string) => Promise<$ReadOnlyArray<number>>;
```
but in the [jest setup file](https://github.com/facebook/react-native/blob/main/jest/setup.js):
```js
getSize: jest.fn(url => Promise.resolve({width: 320, height: 240})),
```
My tests were failing on `Image.getSize()` - `TypeError: Invalid attempt to destructure non-iterable instance.`
I managed to trace this down to this object being returned by the Jest mock - looks like it's returning a size object instead of a dimensions array.
## Workaround
If you are hitting this issue, you can work around this mock by using:
```js
ReactNative.NativeModules.ImageLoader.getSize = jest.fn((_) => Promise.resolve([320, 240]));
```
## Changelog
[JavaScript] [Changed]: Changed the mocked return value of `ImageLoader.getSize` to be `[320, 240]` instead of `{ width: 320, height: 240 }`
Pull Request resolved: https://github.com/facebook/react-native/pull/34653
Test Plan: TBD? I think a test with `Image.getSize(path)` will cover it. That's where I hit the error with the ios-specific imageLoader's getSize method.
Reviewed By: robhogan
Differential Revision: D39413522
Pulled By: NickGerleman
fbshipit-source-id: 7f18d7acde0cf94da0b4aec8fe2d0cad3fb0cc55
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/34659
We've used this Promise polyfill in Jest setup since at least 2015 ([`3ff3987`](3ff39870ce)), when native Promise implementations were either non-existent or new and unstable. We no longer need it.
It causes issues with "modern" timers in Jest, as documented in:
- https://github.com/facebook/react-native/issues/29303
- https://github.com/facebook/jest/issues/10221
It can also obscure real issues due to its default silent handling of uncaught rejections, eg: D39418412.
Changelog:
[General][Changed] - Don't polyfill Promise in Jest setup
Reviewed By: huntie
Differential Revision: D39417597
fbshipit-source-id: d12433ed66c06a402632c2e1d525aad112ef9b0c
Summary:
The removeEventListener method has been removed from AccessibilityInfo and Linking in this PR: https://github.com/facebook/react-native/issues/33580, so I believe we can remove it from the mocks.
## 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
-->
[Internal] [Removed] - Remove removeEventListener from AccessibilityInfo and Linking mocks
Pull Request resolved: https://github.com/facebook/react-native/pull/34260
Test Plan: I executed jest and everything is still green.
Reviewed By: dmitryrykun
Differential Revision: D38198653
Pulled By: GijsWeterings
fbshipit-source-id: 72d10ca54cd505d7c76e7531c9df718b1a9b9ed1
Summary:
Changelog:
[Internal] Rename AccessibilityInfo.sendAccessibilityEvent_unstable to sendAccessibilityEvent
In Fabric, we want people to use `AccessibilityInfo.sendAccessibilityEvent` instead of `UIManager.sendAccessibilityEvent` for Android. The API is not unstable. There is a test in [AccessibilityExample.js](c940eb0c49/packages/rn-tester/js/examples/Accessibility/AccessibilityExample.js (L959)) in RNTester to confirm that it works.
A search for [`AccessibilityInfo.sendAccessibilityEvent_unstable` in Github](https://github.com/search?q=AccessibilityInfo.sendAccessibilityEvent_unstable&type=Code) shows that it's not being used yet, which makes sense because it's an Fabric API. Therefore it's safe to rename it.
Reviewed By: sammy-SC
Differential Revision: D37901006
fbshipit-source-id: 73f35b09ca8f9337f4d66a431f0a3f815da38249
Summary:
Changelog:
[Internal][Changed] - Remove babel plugins from jest preprocessor which are part of preset metro-react-native-babel-preset
Transformer metro-react-native-babel-transformer has preset metro-react-native-babel-preset which has necessary plugins to transpile the source. So we don’t need to pass it again in the preprocessor.
As part of the change, updated one test to use strict mode since metro-react-native-babel-preset has strictMode is set to false.
Reviewed By: motiz88
Differential Revision: D34868961
fbshipit-source-id: 71678f1ee6f1b5ebf9a0c6fd2d6444a61d7583ac
Summary:
Changelog:
[Breaking][General] Remove jest/preprocessor from the react-native package
Using `react-native/jest/preprocessor` outside of the React Native repo has been deprecated since D34820086 (c1e9aa9a27). Here, we make this file private and stop publishing it to npm.
The supported method of using Jest in React Native projects is using the [Jest preset](https://jestjs.io/docs/tutorial-react-native) shipped as part of the `react-native` package.
NOTE: We could probably make some of the other files under `jest/` private as well, but we should go through a separate deprecation cycle with those, in case they are also being used externally by some projects. I'm leaving that for future followup at the moment.
Reviewed By: GijsWeterings
Differential Revision: D36132939
fbshipit-source-id: 300ffa6cf16232573cd3a79a34c14daaafd7aa43
Summary:
I wrote a test for a vibration feature in a react native app by importing the `Vibration` module and using `jest.spyOn(Vibration, 'vibrate')`.
I had the following error:
```
Invariant Violation: TurboModuleRegistry.getEnforcing(...): 'Vibration' could not be found. Verify that a module by this name is registered in the native binary.
```
That lead me to look for (and not find) a mock for the `Vibration` module in the code.
## 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] [Fixed] - Add Jest mock for Vibration module
Pull Request resolved: https://github.com/facebook/react-native/pull/30643
Test Plan:
I would be glad to provide a test plan for this, but as it is part of testing I don't really know how to do so.
Any suggestion or help is welcome!
Reviewed By: yungsters
Differential Revision: D36097003
Pulled By: cortinico
fbshipit-source-id: 58683120da34f40e142a44c4bef8a5fced04bac2
Summary:
Jest 28 will error if only a string is returned from a transfomer, it needs to be an object of `{code: string, map?: object}`. Returning an object has been supported since https://github.com/facebook/jest/pull/2290, released in Jest v20.
## 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
-->
[Internal] [Fixed] - Return object from Jest preprocessor
Pull Request resolved: https://github.com/facebook/react-native/pull/33576
Test Plan: Green CI?
Reviewed By: motiz88
Differential Revision: D35426748
Pulled By: robhogan
fbshipit-source-id: 3edb79b62b2d34274be192061817d3fcd8a7ba17
Summary:
Changelog:
[General][Deprecated] Deprecate the use of `react-native/jest/preprocessor.js` by external projects
The supported method of using Jest in React Native projects is using the [Jest preset](https://jestjs.io/docs/tutorial-react-native) shipped as part of the `react-native` package. Some projects are directly using `preprocessor.js` which is part of the testing setup for the React Native repo itself.
In a future release of React Native, we will stop publishing this file to npm and require projects to switch to the supported preset (or a custom Jest config if necessary).
Reviewed By: GijsWeterings
Differential Revision: D34820086
fbshipit-source-id: 197c33726639e66c6916a244117252e6af11f2f6
Summary:
React Native has an *implicit* dev dependency on this transform via `metro-react-native-babel-transformer`. The transform replaces `Object.assign` with `babelHelpers.extend`, but `Object.assign` has been available natively since node 4.
We intend remove it from metro (https://github.com/facebook/metro/pull/745) as it's no longer needed by any supported runtime - removing RN's small dependency in advance so RN's tests won't break when we do.
Changelog:
[Internal][Changed] - Remove `babel/plugin-transform-object-assign` from jest preprocessor
Reviewed By: motiz88
Differential Revision: D34110208
fbshipit-source-id: 064f8241461fb338de1cd8b53077e8660301aa77
Summary:
Fixes https://github.com/facebook/react-native/issues/32939
It appears there is circular dependencies on the Modal component that causes the modalMock function to be an empty object. Removing the import fixes the issue.
I don't know yet why this is not happening when executing the test suite inside `Modal-test.js` but I will investigate this later.
## 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] [Fixed] - Fix error "mockModal is not a function"
Pull Request resolved: https://github.com/facebook/react-native/pull/32964
Test Plan:
On a newly initiated project using react-native 0.67.1 I created a ModalComponent:
```
import React from 'react';
import {Modal, Text} from 'react-native';
export const ModalComponent = () => {
return (
<Modal visible>
<Text>Test</Text>
</Modal>
);
};
```
and a ModalComponent.test.tsx:
```
import 'react-native';
import React from 'react';
import {ModalComponent} from '../ModalComponent';
// Note: test renderer must be required after react-native.
import renderer from 'react-test-renderer';
it('renders correctly', () => {
renderer.create(<ModalComponent />);
});
```
Running the test throws the error "TypeError: mockModal is not a function".
After modifying the mockModal inside node_modules/react-native/jest/mockModal.js it works correctly.
Reviewed By: christophpurrer
Differential Revision: D33771136
Pulled By: lunaleaps
fbshipit-source-id: c09ada8d2f864f5568b3379616a6cace9fb9921e
Summary:
Eliminates all of the console logs that appear when successfully running Jest tests for React Native.
Changelog:
[Internal]
Reviewed By: lunaleaps
Differential Revision: D32304619
fbshipit-source-id: 8bc8ef9337ae6af588238cec7cfb874ac6067340