I'm following this tutorial from angular.io
As they said, I've created hero.spec.ts file to create unit tests:
import { Hero } from './hero';
describe('Hero', () => {
it('has name', () => {
let hero: Hero = {id: 1, name: 'Super Cat'};
expect(hero.name).toEqual('Super Cat');
});
it('has id', () => {
let hero: Hero = {id: 1, name: 'Super Cat'};
expect(hero.id).toEqual(1);
});
});
Unit Tests work like a charm. The problem is: I see some errors, which are mentioned in tutorial:
Our editor and the compiler may complain that they don’t know what it and expect are because they lack the typing files that describe Jasmine. We can ignore those annoying complaints for now as they are harmless.
And they indeed ignored it. Even though those errors are harmless, it doesn't look good in my output console when I receive bunch of them.
Example of what I get:
Cannot find name 'describe'. Cannot find name 'it'. Cannot find name 'expect'.
What can I do to fix it?
I hope you've installed -
npm install --save-dev @types/jasmine
Then put following import at the top of the hero.spec.ts
file -
import 'jasmine';
It should solve the problem.
With Typescript@2.0 or later you can install types with:
npm install -D @types/jasmine
Then import the types automatically using the types
option in tsconfig.json
:
"types": ["jasmine"],
This solution does not require import {} from 'jasmine';
in each spec file.
"types": ["jasmine"]
line anymore. "By default all visible “@types” packages are included in your compilation. Packages in node_modules/@types of any enclosing folder are considered visible; specifically, that means packages within ./node_modules/@types/, ../node_modules/@types/, ../../node_modules/@types/, and so on."
node
and jasmine
types are not detected. At least it doesn't work for me and I'm using Typescript@2.1.5
ang-app/e2e/tsconfig.json
. I tried it in every json level. Could you please add more details?
npm install @types/jasmine
As mentioned in some comments the "types": ["jasmine"]
is not needed anymore, all @types
packages are automatically included in compilation (since v2.1 I think).
In my opinion the easiest solution is to exclude the test files in your tsconfig.json like:
"exclude": [
"node_modules",
"**/*.spec.ts"
]
This works for me.
Further information in the official tsconfig docs.
src/tsconfig.app.json
, src/tsconfig.spec.json
and tsconfig.json
. The mentioned "exclude" section is part of the 1st one. "types": [ "jasmine" ]
part of the 2nd.
exclude
block.
exclude
block. Then I created a new tsconfig.build.json
file with the spec file pattern added to the exclude
block. Now, in my ts-loader
options(in the webpack.config) I am using tsconfig.build.json
. With these configurations, the modules are being resolved in the test files and while creating the build or starting the server, the test files are excluded.
You need to install typings for jasmine. Assuming you are on a relatively recent version of typescript 2 you should be able to do:
npm install --save-dev @types/jasmine
With Typescript@2.0 or later you can install types with npm install
npm install --save-dev @types/jasmine
then import the types automatically using the typeRoots option in tsconfig.json.
"typeRoots": [
"node_modules/@types"
],
This solution does not require import {} from 'jasmine'; in each spec file.
Solution to this problem is connected with what @Pace has written in his answer. However, it doesn't explain everything so, if you don't mind, I'll write it by myself.
SOLUTION:
Adding this line:
///<reference path="./../../../typings/globals/jasmine/index.d.ts"/>
at the beginning of hero.spec.ts
file fixes problem. Path leads to typings
folder (where all typings are stored).
To install typings you need to create typings.json
file in root of your project with following content:
{
"globalDependencies": {
"core-js": "registry:dt/core-js#0.0.0+20160602141332",
"jasmine": "registry:dt/jasmine#2.2.0+20160621224255",
"node": "registry:dt/node#6.0.0+20160807145350"
}
}
And run typings install
(where typings
is NPM package).
In my case, the solution was to remove the typeRoots
in my tsconfig.json
.
As you can read in the TypeScript doc
If typeRoots is specified, only packages under typeRoots will be included.
In order for TypeScript Compiler to use all visible Type Definitions during compilation, types
option should be removed completely from compilerOptions
field in tsconfig.json
file.
This problem arises when there exists some types
entries in compilerOptions
field, where at the same time jest
entry is missing.
So in order to fix the problem, compilerOptions
field in your tscongfig.json
should either include jest
in types
area or get rid of types
comnpletely:
{
"compilerOptions": {
"esModuleInterop": true,
"target": "es6",
"module": "commonjs",
"outDir": "dist",
"types": ["reflect-metadata", "jest"], //<-- add jest or remove completely
"moduleResolution": "node",
"sourceMap": true
},
"include": [
"src/**/*.ts"
],
"exclude": [
"node_modules"
]
}
google map types
in the types
option. After removing the option completely, it worked fine.
I'm up to the latest as of today and found the best way to resolve this is to do nothing...no typeRoots
no types
no exclude
no include
all the defaults seem to be working just fine. Actually it didn't work right for me until I removed them all. I had:
"exclude": [
"node_modules"
]
but that's in the defaults so I removed that.
I had:
"types": [
"node"
]
to get past some compiler warning. But now I removed that too.
The warning that shouldn't be is: error TS2304: Cannot find name 'AsyncIterable'.
from node_modules\@types\graphql\subscription\subscribe.d.ts
which is very obnoxious so I did this in tsconfig so that it loads it:
"compilerOptions": {
"target": "esnext",
}
since it's in the esnext set. I'm not using it directly so no worries here about compatibility just yet. Hope that doesn't burn me later.
"types": ["node"]
in tsconfig.json
but you should add this type in tsconfig.app.json
! You should don't have this warning again I think. You could keep "target": "es5"
or "target": "es6"
now.
I'll just add Answer for what works for me in "typescript": "3.2.4" I realized that jasmine in node_modules/@types there is a folder for ts3.1 under the jasmine type so here are the steps:-
Install type jasmine npm install -D @types/jasmine
Add to tsconfig.json jasmine/ts3.1 "typeRoots": [ ... "./node_modules/jasmine/ts3.1" ],
Add Jasmine to the types "types": [ "jasmine", "node" ],
Note: No need for this import 'jasmine';
anymore.
Only had to do the following to pick up @types in a Lerna Mono-repo where several node_modules exist.
npm install -D @types/jasmine
Then in each tsconfig.file of each module or app
"typeRoots": [
"node_modules/@types",
"../../node_modules/@types" <-- I added this line
],
In my case, I was getting this error when I serve the app, not when testing. I didn't realise I had a different configuration setting in my tsconfig.app.json file.
I previously had this:
{
...
"include": [
"src/**/*.ts"
]
}
It was including all my .spec.ts
files when serving the app. I changed the include property to
exclude` and added a regex to exclude all test files like this:
{
...
"exclude": [
"**/*.spec.ts",
"**/__mocks__"
]
}
Now it works as expected.
I had this error in an angular library. Turns out I accidentally included my .spec file in the exports in my public-api.ts. Removing the export fixed my issue.
Look at the import maybe you have a cycle dependency, this was in my case the error, using import {} from 'jasmine';
will fix the errors in the console and make the code compilable but not removes the root of devil (in my case the cycle dependency).
I'm on Angular 6, Typescript 2.7, and I'm using Jest framework to unit test. I had @types/jest
installed and added on typeRoots
inside tsconfig.json
But still have the display error below (i.e: on terminal there is no errors)
cannot find name describe
And adding the import :
import {} from 'jest'; // in my case or jasmine if you're using jasmine
doesn't technically do anything, so I thought, that there is an import somewhere causing this problem, then I found, that if delete the file
tsconfig.spec.json
in the src/
folder, solved the problem for me. As @types is imported before inside the rootTypes.
I recommend you to do same and delete this file, no needed config is inside. (ps: if you're in the same case as I am)
if the error is in the .specs file app/app.component.spec.ts(7,3): error TS2304: Cannot find name 'beforeEach'.
add this to the top of your file and npm install rxjs
import { range } from 'rxjs'; import { map, filter } from 'rxjs/operators';
Success story sharing
@types/jasmine@2.5.41
. Otherwise you may see these compilation errors.import 'jasmine';
import {} from 'jasmine';
actually do? Is it the same asimport 'jasmine'
?