How can I get WebStorm to recognize Jasmine methods?
JasmineWebstormJasmine Problem Overview
I have a node.js project that contains some Jasmine specifications. The specifications are in a spec/ subdirectory and have the .spec.coffee extension, as required by jasmine-node.
When I open one of my spec files in the WebStorm IDE, all the calls to beforeEach and describe and it are shown with blue squiggly underlines with the tooltip: "Unresolved function or method it()". So even though I'm using the 3.0 EAP and it's supposed to have some amount of Jasmine support, it's not automatically picking up on the fact that this is a Jasmine spec file.
I tried going into File > Settings > JavaScript Libraries, and adding Jasmine as a library (specifying the path to jasmine-2.0.0.rc1.js), and then going to the Usage Scope sub-page and checking "Jasmine" in the drop-down list next to "Project", but that had no effect -- the Jasmine methods still show up as unresolved.
How can I tell WebStorm that all files in a spec subdirectory, and/or all files with a .spec.coffee extension, are Jasmine tests, and have it recognize the Jasmine APIs those tests are using?
Jasmine Solutions
Solution 1 - Jasmine
You can use predefined JS library stubs in Webstorm/PHPStorm/Idea
- Open File > Settings...
- Select Languages & Frameworks > JavaScript > Libraries
- Click on Download...
- Swich to TypeScript community stubs
- Find karma-jasmine (originally under the name jasmine) (If this does not work, try jasmine instead)
- Click on Download and Install
I am using this setup with Jasmine 2.0
Solution 2 - Jasmine
On a mac with webstorm 2016.1.1 i did the following :
- Open Preferences (webstorm->preference or [command + ,] )
- Go to libraries and frameworks -> javascript -> libraries
- download
- select 'jasmine - DefinitelyTyped' from the list
Solution 3 - Jasmine
Note, if you are using a Code Quality Tool such as JSHint with WebStorm, adding the global jasmin/karma-jasmine library did not get rid of the JSHint errors.
You need to access the JSHint settings via WebStorm's menu system (Lang & Frameworks>JavaScript>Code Quality Tools>JSHint) and click the checkbox to enable it know which environment it is running in.
Solution 4 - Jasmine
Using TypeScript (and Angular2) you just need to enable the TypeScript compiler in the WebStorm Settings ...
Settings > Languages & Settings > TypeScript ...
Under the Compiler heading tick ...
Enable TypeScript Compiler ...
(I also clicked the use tsconfig.json radio)
Jasmine methods will now be recognised
Solution 5 - Jasmine
This could also be caused by a missing dependency (if you're developing in TypeScript).
Make sure you've installed @types/jasmine
npm install --save-dev @types/jasmine
Solution 6 - Jasmine
If you encounter this issue after having generated a project using the Angular CLI then go to File -> Settings -> Languages & Frameworks -> JavaScript -> Libraries and check {your-project-name}/node_modules.
Solution 7 - Jasmine
To find the answer to this, I ran DiffMerge on my project root and a new Angular CLI project created in Webstorm that properly detected jasmine types.
What I found is that the tsconfig.json and tsconfig.spec.json files from my project defined typeRoots and types, whereas the other project did not.
The behavior of the typeRoots option is:
> If typeRoots is specified, only packages under typeRoots will be included.
Types behaves a similar way.
Typescript documentation goes on to say:
> By default all visible ”@types” packages are included in your compilation. Packages in node_modules/@types of any enclosing folder are considered visible.
So, for my project, this behavior is good enough for me. Deleting typeRoots and types from both my tsconfig.json and tsconfig.spec.json files solved this immediately.
Yes, jasmine was declared under types in tsconfig.spec.json. Yes, it was set to extend tsconfig.json.
In this case, it didn't matter. One day it just stopped working. Possibly due to a Typescript upgrade, but I can't say for certain. If anyone knows why, please leave a comment below, I'm curious.