jest-transform-stub | Jest stub transform | Mock library

jest runs via Node runtime, meaning there are no browser APIs. You will need to mock it. Look into jest setupFiles.

Create a setup file:

The problem is specific to node-sass, in this project it seems to be the only binary dependency that depends on a platform and Node version.

There is a message that lock file version is old, this means that it was created with another version of NPM (v6), this can be is a possible source of problems due to differences in resolved dependencies.

As the documentation lists, different node-sass versions are linked to different Node versions, "node-sass": "^4.12.0" suggests that the project is supposed to run with Node v12, while v16 was used.

Possible solutions are:

• Switch to Node v12 for this project (can be too old for other ones) and run as is

• Switch to Node v14 (the latest LTS release, less problems in general) and update node-sass to ^4.14

• Stay with Node v16 and update node-sass to ^6.0

• Stay with Node v16, remove node-sass, instead add platform-independent sass, follow migration guidelines for Dart Sass if problems arise (primarily / syntax)

You'll need to define the functions inside the mock statement.

Currently, you've said that rather than using the real thing a mock should be used. The reason you're then getting undefine is because the mock is empty (you've not defined any functions in it).

So, the next thing to do is to specify how that mocked library should interact. You're importing two functions, so you'll need to define those functions inside the mock statement:

run command from the project root folder.

if npm

rm -rf node_modules package-lock.json

if yarn

rm -rf node_modules yarn.lock

remove ^ from every package

set package version from the concerned library if that version exists then ok, otherwise set version that actually exists

run command

npm install or yarn install

then

cd ios

run command from ios folder

rm -rf Pods Podfile.lock

then

pod install

Solution found here. Add @react-native to your Jest configuration. Such as:

Based on Vuetify's Jest setup docs:

1. Don't use localVue.use(Vuetify) because you've already called Vue.use(Vuetify) in the Jest setup file.

2. Along with localVue, pass vuetify as a new instance of Vuetify to mount():

The Jest documentation about moduleNameMapper states that:

Note: If you provide module name without boundaries ^$ it may cause hard to spot errors. E.g. relay will replace all modules which contain relay as a substring in its name: relay, react-relay and graphql-relay will all be pointed to your stub.

You have mobx in your moduleNameMapper which will stub out both mobx and mobx-react, which is not what you want. You should be able to get rid of the error by removing that.

According to this thread https://github.com/airbnb/javascript/issues/2331#issuecomment-724114465

you need to update eslint-plugin-import to ^2.22.1 which supports ∞ value.

I managed to solve this problem. Had to change two lines of code:

In my Btn component, changed VBtn import to: import { VBtn } from 'vuetify/lib/components/VBtn'; (imported from vuetify/lib/components/VBtn, not from vuetify/lib).

In jest.config.js update in moduleNameMapper to 'vuetify/lib(.*)': '/node_modules/vuetify/es5$1'.

And that is all, now it works :)

My whole jest.config.js: