Get rid of "Unresolved function/method/variable" warning in Jest test files
I'm using Jest in WebStorm and can't figure out how to get rid of the grey squiggly underlines for `expect` and matcher methods:
I couldn't find a Jest plugin for Webstorm, and setting up eslint-plugin-jest didn't resolve these inspection warnings.
Please sign in to leave a comment.
In Preferences | Languages & Frameworks | JavaScript | Libraries, press Download..., select 'jest' from the list of available stubs, press Download and Install
Followed the steps above on Webstorm latest release version. Nothing happens after clicking 'Download and Install'.
"In Preferences | Languages & Frameworks | JavaScript | Libraries, press Download..., select 'jest' from the list of available stubs, press Download and Install"
works fine for me. Please recreate the issue and provide your idea.log (https://intellij-support.jetbrains.com/hc/en-us/articles/207241085-Locating-IDE-log-files). Please put the file on file server, don't paste its content here
If downloading via Languages & Frameworks | JavaScript | Libraries doesn't work for you, you can add typings manually by running `npm i @types/jest` in your project root folder
trying to get this to work. btw there is a related bug for what Alt talked about where Download and Install does nothing:
https://youtrack.jetbrains.com/issue/WEB-30028
It's fixed in the latest EAP build of 2017.3.2.
Still, even with that, I am experiencing the same issue and can't get the underline to go away for it() and describe() by either doing Download and Install, or manually running the npm command.
works for me. What library did you download?
If the problem persist after invalidating caches (File | Invalidate caches, Invalidate and restart), please share a sample project that shows up the issue
Works partially in my case. For some reason IDEA could resolve "toBe" (with jump to declaration), but not "expect". But I use Yarn, not NPM, so that's could be the case, but it still annoying.
If the problem persist after invalidating caches (File | Invalidate caches, Invalidate and restart), please share a sample project that shows up the issue
Invalidating caches didn't help. I've created a sample project – https://github.com/h8/yarn_jest_ide_inspections
You can see, how it looks – expect is not recognized, while toBe – it is. Situation is the same on Linux (Ubuntu 17.10) and MacOS (10.13.2) systems. Node version is 9.3.0, Yarn 1.3.2. Everything else is in the package.json file. IntelliJ IDEA 2017.3.2 (Ultimate Edition)
Build #IU-173.4127.27
JRE: 1.8.0_152-release-1024-b8 x86_64
JVM: OpenJDK 64-Bit Server VM by JetBrains s.r.o
Mac OS X 10.13.2
reproduced; `expect` is actually resolved, but has a false 'Missing import' warning reported. https://youtrack.jetbrains.com/issue/WEB-30236 is fixed in 2017.3.3
Hi there.
I can't see any 'Jest' item in my PyCharm libraries list.
PyCharm 2017.3.3 Professional
Switch from 'Official libraries' to 'TypeScript Community stubs':
Same issue here, only the 'expect' keyword is not recognized.
When I try to download jest via Languages & Frameworks | JavaScript | Libraries like mentionned above, I get 'can not install Noe.js modul: Please specify npm or yarn package'.
I already have @types/jest in my package.json
(using WS 2018.1.5)
Edit :
It's now working just fine, but I don't get what did the trick haha (did not have to download jest)
Hi,
I've been having this issue lately after it used to work just fine.
I have `@types/jest` working in all of my projects except for my most recent one, which stopped working once I ejected from CRA.
Strangely enough, if I delete all my project's `node_modules`, the the intellisense on Jest works just fine - but as soon as I run `yarn install` the intellisense stops working and I get the "Unresolved function of method xxx" error. So I suspect one of my packages are causing `@types/jest` to stop working.
What I've tried:
1) All the methods discussed in here.
2) This workaround -> https://medium.com/front-end-hacking/fix-element-is-not-imported-jest-describe-it-expect-in-webstorm-aaf8c29ae3c2
3) Invalidating webstorm cache and restarting.
4) Reinstalling packages multiple times after deleting lock files
My current setup:
1) My Webstorm version is 2018.2.3
2) My `package.json` looks as follows:
{...
"dependencies": {
"axios": "0.18.0",
"classnames": "2.2.6",
"dashjs": "2.9.0",
"get-countries-info": "1.2.1",
"lodash": "4.17.10",
"moment": "2.22.2",
"nuka-carousel": "4.3.5",
"prop-types": "15.6.2",
"querystringify": "2.0.0",
"react": "16.4.2",
"react-custom-scrollbars": "4.2.1",
"react-dom": "16.4.2",
"react-icons-kit": "1.1.7",
"react-image-fallback": "8.0.0",
"react-lottie": "1.2.3",
"react-player-controls": "0.5.21",
"react-redux": "5.0.7",
"react-router-dom": "4.3.1",
"react-select": "2.0.0",
"react-toastify": "3.3.4",
"redux": "4.0.0",
"redux-promise": "0.6.0",
"redux-thunk": "2.3.0",
"uuid-validate": "0.0.3"
},
"devDependencies": {
"autoprefixer": "9.1.5",
"babel-core": "6.26.3",
"babel-eslint": "9.0.0",
"babel-jest": "23.4.2",
"babel-loader": "7.1.2",
"babel-preset-react-app": "3.1.2",
"babel-runtime": "6.26.0",
"case-sensitive-paths-webpack-plugin": "2.1.2",
"chalk": "2.4.1",
"css-loader": "1.0.0",
"dotenv": "6.0.0",
"dotenv-expand": "4.2.0",
"enzyme": "3.6.0",
"enzyme-adapter-react-16": "1.4.0",
"enzyme-matchers": "6.0.4",
"eslint": "5.5.0",
"eslint-config-prettier": "3.0.1",
"eslint-config-react-app": "2.1.0",
"eslint-loader": "2.1.0",
"eslint-plugin-flowtype": "2.50.0",
"eslint-plugin-import": "2.14.0",
"eslint-plugin-jest": "21.22.0",
"eslint-plugin-jsx-a11y": "6.1.1",
"eslint-plugin-prettier": "2.6.2",
"eslint-plugin-react": "7.11.1",
"extract-text-webpack-plugin": "3.0.2",
"file-loader": "2.0.0",
"fs-extra": "7.0.0",
"generate-react-code": "1.3.0",
"husky": "0.14.3",
"html-webpack-plugin": "3.2.0",
"jest": "23.5.0",
"jest-enzyme": "6.0.4",
"jest-mock-console": "0.4.0",
"lint-staged": "7.2.2",
"moxios": "0.4.0",
"node-sass-chokidar": "1.3.3",
"npm-run-all": "4.1.3",
"object-assign": "4.1.1",
"postcss-flexbugs-fixes": "4.1.0",
"postcss-loader": "3.0.0",
"promise": "8.0.1",
"prettier": "1.14.2",
"raf": "3.4.0",
"react-dev-utils": "5.0.2",
"redux-devtools-extension": "2.13.5",
"redux-logger": "3.0.6",
"resolve": "1.8.1",
"style-loader": "0.23.0",
"sw-precache-webpack-plugin": "0.11.5",
"url-loader": "1.1.1",
"webpack": "3.12.0",
"webpack-dev-server": "2.11.3",
"webpack-manifest-plugin": "2.0.3",
"whatwg-fetch": "2.0.4"
},
"babel": {
"presets": [
"react-app"
]
}
}
3) My `eslintrc.json` file looks as follows:
{"env": {
"browser": true,
"es6": true,
"jest/globals": true,
"jest": true,
"node": true
},
"globals": {
"process": true,
"localStorage": true,
"customScrollHandler": true,
"customOnScrollEvent": true
},
"extends": [
"react-app",
"prettier",
"eslint:recommended",
"plugin:react/recommended",
"plugin:jest/recommended",
"plugin:jsx-a11y/recommended"
],
"parserOptions": {
"ecmaVersion": 6,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true
}
},
"plugins": ["react", "jest", "prettier", "jsx-a11y"],
"settings": {
"react": {
"version": "16.4.2"
}
},
"rules": {
"class-methods-use-this": "off",
"semi": ["error", "always"],
"no-console": ["error", { "allow": ["warn", "error"] }],
"react/jsx-handler-names": "off",
"import/no-namespace": "off",
"import/namespace": "off",
"import/prefer-default-export": "off",
"import/default": "off",
"react/prefer-stateless-function": "off",
"react/jsx-curly-brace-presence": ["error", { "props": "never", "children": "ignore" }],
"jsx-a11y/click-events-have-key-events": "off",
"jsx-a11y/media-has-caption": "off",
"jsx-a11y/no-static-element-interactions": "off",
"jsx-a11y/label-has-for": "off",
"jsx-a11y/no-noninteractive-element-interactions": "off",
"jsx-a11y/href-no-hash": "off",
"jsx-a11y/anchor-is-valid": "off"
}
}
Any help will be appreciated!
Please can you provide screenshot(s) that show up the issue?
For what it's worth I was experiencing the exact same symptoms. @types/jest installed in Webstorm and by yarn. Turns out I had specified typeRoots: [ <somePath> ] without specifying node_modules as well. So I removed the typeRoots entry which I no longer needed and it now works as expected
I thought I had the same issue but then I realized it's not WebStorm but ESLint that was complaining about it. So I simply added jest to my .eslintrc:
"env": {"jest": true
},
Hover the mouse cursor on the underlined expect and look at the pop-up if it says ESLint.
Manually adding the folder containing my node modules helped with this. File > Settings > Languages and Frameworks > JavaScript > Libraries > Add
got to Languages & Frameworks | JavaScript | Libraries | Download | then type " expect "
downloading ( expect ) library should solve the auto-complete issue for ( expect ) , so if you face the same problem with ( express ) library then u should donwload express library and so on .
https://www.youtube.com/watch?v=9izXNWHD5Qg
watching this short video should give you an explanation why this issue exists .
Just install
yarn add --dev @types/jestThis worked for me.
I've just installed the latest EAP (via snap in Ubuntu) and hit the issue again. I fixed it as Lkaruhanga suggested in his comment. I have @types/jest installed in my package.json. I referenced manually the folder node_modules/@types/jest in Intellij settings screen: File | Settings | Languages & Frameworks | JavaScript | Libraries
My EAP version is:
I had this problem (WebStorm 2020.2.1) and fixed it by
1) installing @types/jest as Elena Pogoroleva suggested and also install ts-jest package as a dev dependency
2) add this entry in tsconfig.json:
"compilerOptions": {"types": [
"jest"
]
If using tslint instead of eslint, install package tslint-jest (as a dev dependency) and add this entry to tslint.json:
Hope this helps.
What I found for me was that @types/jest was not enough, because of other libraries I am utilizing.
The libraries I downloaded to get it to work:
* @types/jest
* @types/testing-library__jasmine-dom
* @types/testing-library__jest-dom
Running WebStorm 2021.1.1 on wslg, describe/expect/etc. are recognized but jest methods aren't (jest.fn(), jest.mock()):
Anyone have experience with this?
https://intellij-support.jetbrains.com/hc/en-us/community/posts/115000357324/comments/115000322910
Works still fine. Did not know about this feature!
I tried all of the solutions above but nothing works. Jest methods themselves are recognized, intellisense is working on the `jest` namespace, but the keyword `jest` itself is being flagged as unrecognized. I installed `@types/jest` stub (the library was already installed as part of the project). Still the problem persist. I'm using Webstorm 2022.2.2.
I recently switched from MacOS Big Sir to Monteray. Webstorm was working fine on my old computer, though I think I had v. 2022.2.1.
Anna Talis Unfortunately, we failed to reproduce the problem. Please share a sample project which we could use for this purpose within a support ticket so we can continue the investigation.
I am using Webstorm 2022.3 EAP, and the solution that worked for me was:
I'm using ts-jest and jest, ts jest has it's own globals.d.ts file where it import jest's expect. Overriding the regular types that comes from Jest.
The solution was to mark this file as “plaintext”
Checking in from March 2024. This is consistently a problem in both PHPStorm and WebStorm, regardless of installing jest, invalidating caches, or anything. Something this basic and common to almost every web developer should work out of the box without jumping through hoops that don't even actually work. Please fix this.
Unfortunately, the issue is not reproducible on our side so it's not clear what has to be fixed. Please share a sample project which we could use for this purpose within a support ticket so we can continue the investigation.