[Jest] V2 - rc2 Invariant Violation: TurboModuleRegistry.getEnforcing(...): 'NativeReanimated'

[mym0404]

Description

I bumped RC 1 -> RC 2 in my project and suffered JEST error like the following

 ● Test suite failed to run

    Invariant Violation: TurboModuleRegistry.getEnforcing(...): 'NativeReanimated' could not be found. Verify that a module by this name is registered in the native binary.

      at invariant (node_modules/invariant/invariant.js:40:15)
      at Object.getEnforcing (node_modules/react-native/Libraries/TurboModule/TurboModuleRegistry.js:39:3)
      at Object.<anonymous> (node_modules/react-native-reanimated/src/reanimated2/NativeReanimated.native.js:5:23)
      at Object.<anonymous> (node_modules/react-native-reanimated/src/reanimated2/WorkletEventHandler.js:1:1)

My mock file is like that.

// @ts-ignore https://github.com/wcandillon/react-native-redash/issues/395
global.__reanimatedWorkletInit = () => {};

jest
  .mock('react-native-reanimated', () => ({
    ...require('react-native-reanimated/mock'),
  }))
  .mock('react-native/Libraries/Animated/src/NativeAnimatedHelper');

Expected behavior

Test should success

Package versions

• React: 16.13.1
• React Native: 0.63.4
• React Native Reanimated: 2.0.0-rc02
• NodeJS: 14.7.0

[github-actions[bot]]

Issue validator - update # 3

Hello! It seems like there are some problems with your issue. Please fix them and wait for the validator to confirm that everything is alright. Thank you!

Validator encountered the following problems:

• Section required but not found: steps to reproduce(for label 🐞 bug)
• Section required but not found: actual behavior(for label 🐞 bug)

[LiamDotPro]

I can also confirm that changing my project from 2.0.0-rc2 to 2.0.0-rc1 stopped jest from failing. Would really like RC2 to work as the withTiming caused crashes on ios in this version..

[LiamDotPro]

I'm also getting the following now when trying to render the app:

renders correctly

TypeError: (0 , _reactNativeReanimated.useSharedValue) is not a function

  36 | 
  37 | const Notch: React.FC<Props> = ({ pressed }) => {
> 38 |   const offset = useSharedValue(0);
     |                  ^
  39 | 
  40 |   const animatedStyles = useAnimatedStyle(() => {
  41 |     return {

  at Notch (src/components/NumPad/Notch.tsx:38:18)
  at renderWithHooks (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:6156:18)
  at mountIndeterminateComponent (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:8690:13)
  at beginWork$1 (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:10052:16)
  at performUnitOfWork (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:14694:12)
  at workLoopSync (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:14667:22)
  at performSyncWorkOnRoot (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:14366:11)
  at node_modules/react-test-renderer/cjs/react-test-renderer.development.js:2063:24
  at unstable_runWithPriority (node_modules/react-test-renderer/node_modules/scheduler/cjs/scheduler.development.js:818:12)
  at runWithPriority (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:2013:10)

I believe I'm missing some mocks now that were moved into master last November, which I guess are in the RC2?

[mym0404]

@LiamDotPro V2 mocks are included in RC02. I suggest you to inspect mock.js file in repo and use it correctly.

[LiamDotPro]

Well I can't currently run jest at RC2 because of Invariant Violation: so I downgraded to RC1 which now presents me with this type error. I'm using the following inside react-native-reanimated.js export * from 'react-native-reanimated/mock';

[Andreyco]

This is not only Jest related. Same happens when

• remote debugging
• with rc-1 as well

Remote debugging issue indicates me Hermes comes into play. That is not viable on iOS for me 🤷‍♂️

[LiamDotPro]

@karol-bisztyga Can we expect an update on the validity / if it is planned to fix?

[mgambati]

I opened a PR, but if you guys want a temporary fix. Use ds300/patch-package and put this on patches/react-native-reanimated+2.0.0-rc.2.patch:

diff --git a/node_modules/react-native-reanimated/mock.js b/node_modules/react-native-reanimated/mock.js
index 3bc10c5..c26bce3 100644
--- a/node_modules/react-native-reanimated/mock.js
+++ b/node_modules/react-native-reanimated/mock.js
@@ -234,6 +234,7 @@ module.exports = {
   __esModule: true,

   ...Reanimated,
+  ...ReanimatedV2,

   default: {
     ...Reanimated,
diff --git a/node_modules/react-native-reanimated/src/reanimated2/mock.js b/node_modules/react-native-reanimated/src/reanimated2/mock.js
index e4b6a8c..7b4ebe7 100644
--- a/node_modules/react-native-reanimated/src/reanimated2/mock.js
+++ b/node_modules/react-native-reanimated/src/reanimated2/mock.js
@@ -1,11 +1,18 @@
-const hooks = require('./Hooks');

 /* eslint-disable standard/no-callback-literal */
+const useRef = require('react').useRef
 const NOOP = () => {};
 const ID = (t) => t;

 const ReanimatedV2 = {
-  useSharedValue: hooks.useSharedValue,
+  useSharedValue: (init) => {
+    const ref = useRef(null);
+    if (ref.current === null) {
+      ref.current = { value: init };
+    }
+  
+    return ref.current
+  },
   useDerivedValue: (a) => ({ value: a() }),
   useAnimatedScrollHandler: () => NOOP,
   useAnimatedGestureHandler: () => NOOP,

[mym0404]

@mgambati It works like a charm thanx

[ferrannp]

Thanks to take care of Jest @mgambati.

[walterholohan]

Thank you @mgambati for the patch. YOu saved me a lot of heartache. Hopefully, they will merge the PR soon.

[nonewcode]

This fails again on rc.3 unfortunately.

[Ovsdrak]

I've updated the package to 2.0.0 following the recommended setup, and I got this error:

TypeError: react_native_reanimated_1.useSharedValue is not a function in my index.test.tsx

In my index.tsx the line with the problem is this one: const animatedWidth = useSharedValue(thumbWidth);

useSharedValue comes from react-native-reanimated

How to reproduce the error

1. Run yarn add react-native-reanimated, Note: In package.json you will see "react-native-reanimated": "^2.0.0",
2. In your jest.config.js, you must have a setup file like this setupFiles: ['./jest-setup.js'],
3. In the jest-setup.js file you should have

// @ts-ignore
require('react-native-reanimated/src/reanimated2/jestUtils').setUpTests(); // This is the recommended line.

// These are the mocks I was already using.
//@ts-ignore
jest.mock('react-native-reanimated', () => {
    const reanimated = require('react-native-reanimated/mock');

    // The mock for `call` immediately calls the callback which is incorrect
    // So we override it with a no-op
    reanimated.default.call = () => {};

    return reanimated;
})
// Silence the warning: Animated: `useNativeDriver` is not supported because the native animated module is missing
jest.mock('react-native/Libraries/Animated/src/NativeAnimatedHelper');

If someone finds a solution with 2.0.0, I would appreciate he/she could share it.

Reference:

• https://github.com/software-mansion/react-native-reanimated/pull/1731
• https://github.com/software-mansion/react-native-reanimated/releases/tag/2.0.0
• https://docs.swmansion.com/react-native-reanimated/docs/testing

[Jackmekiss]

Same error here

[surajprasad13]

i am getting same issue recently but last previous days it was working fine since react native updated latest version 0.64

[p2mittal-dev]

Error Solved

Error - TurboModuleRegistry.getEnforcing(...): 'NativeReanimated' Hello, I got this[TurboModuleRegistry.getEnforcing(...): 'NativeReanimated'] error and i found the solution Step 1 - Download react native project from github "https://github.com/software-mansion-labs/reanimated-2-playground". Step 2- Then run command => npm install => react-native start => react-native run-android and build app Step 3- when its work move your required project files and install your required npm pakages. Step 4 - Then run commands => npm cache clean --force => cd android => gradlew clean => gradle cleanBuildCache => gradlew build --refresh-dependencies => cd.. => npx react-native start --reset-cache => npx react-native run-android its work for me try once.

[surajprasad13]

Thanks

On Thu, 18 Mar 2021, 12:04 pm p2mittal-dev, @.***> wrote:

Error - TurboModuleRegistry.getEnforcing(...): 'NativeReanimated' Cause - React Native Reanimated 2.0

Hello, I got this[TurboModuleRegistry.getEnforcing(...): 'NativeReanimated'] error and i found the solution Step 1 - Download react native project from github " https://github.com/software-mansion-labs/reanimated-2-playground". Step 2- Then run command => npm install => react-native start => react-native run-android and build app Step 3- when its work move your required project files and install your required npm pakages. Step 4 - Then run commands => npm cache clean --force => cd android => gradlew clean => gradle cleanBuildCache => gradlew build --refresh-dependencies => cd.. => npx react-native start --reset-cache => npx react-native run-android its work for me try once.

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/software-mansion/react-native-reanimated/issues/1642#issuecomment-801670187, or unsubscribe https://github.com/notifications/unsubscribe-auth/ALO4WP44PYTY6ZS67ZG3QALTEGNIDANCNFSM4WFZOS5A .

[piaskowyk]

@mym0404, @Ovsdrak Sorry for my late reply 😕 From version 2.0.0 we support Jest testing and now you don't need to use your own mocks because we using Reanimated Web implementation as Jest's mocks.

Instead of use something like this:

jest.mock('react-native-reanimated', () => {
    const reanimated = require('react-native-reanimated/mock');
    return reanimated;
})

You can just import react-native-reanimated and use directly Reanimated's objects. If anyone has questions or suggestions I encourage them to discussion.

Thanks all for commitment 🙌