Important note: When using React 16 with Node version 8, you might see wrong line numbers for errors originating from tsx files. There's an issue with more details on this
Note: Looking for collaborators. Want to help improve ts-jest?
ts-jest is a TypeScript preprocessor with source map support for Jest that lets you use Jest to test projects written in TypeScript.
To use this in your project, run:
npm install --save-dev ts-jest @types/jest
Modify your project's
package.json so that the
jest section looks something like:
This setup should allow you to write Jest tests in Typescript and be able to locate errors without any additional gymnastics.
You can try using ts-jest with
jest@test; use at your own risk! (And file an issue if you find problems.)
Prior to version
20.0.0, coverage reports could be obtained using the inbuilt coverage processor in ts-jest. Starting with version
20.0.0, ts-jest delegates coverage processing to jest and no longer includes a coverage processor.
To generate coverage results, set the
mapCoverage property in the
jest configuration section to
Please note that the
outDirproperty in the
jestconfiguration section is removed in coverage mode, due to #201.
ts-jest tries to ship with sensible defaults, to get you on your feet as quickly as possible.
Sourcemaps should work out of the box. That means your stack traces should have the correct line numbers, and you should be able to step through the TypeScript code using a debugger.
ts-jest automatically located your
If you want to compile typescript with a special configuration, you can do that too
If you're on a codebase where you're using synthetic default imports, e.g.
//Regular imports;//Synthetic default imports:;
ts-jest tries to support that. If
allowSyntheticDefaultImports is set to true in your
tsconfig file, it uses babel
to automatically create the synthetic default exports for you - nothing else needed.
You can opt-out of this behaviour with the skipBabel flag
If the default setup doesn't address your requirements, you can create a custom setup to suit your project.
By default this package will try to locate
tsconfig.json and use its compiler options for your
You can override this behaviour by pointing ts-jest to a custom TypeScript configuration file.
You can do this by setting the
tsConfigFile option in your global variables under the
ts-jest key to path of the
custom configuration file (relative to the project's root directory)
Warning: Using __TS_CONFIG__ option in globals is deprecated and soon will be removed.
For all available
tsc options see TypeScript docs.
Note that if you haven't explicitly set the
module property through a separate configuration file with
tsConfigFile, it will be overwritten to
commonjs (regardless of the value in
tsconfig.json) since that is the format Jest expects. This only happens during testing.
If you don't use mocks, or synthetic default imports you can skip the babel-transpilation step.
jest.mock() calls will not be hoisted to the top,
and synthetic default exports will never be created.
Simply add skipBabel to your global variables under the
//This will skip babel transpilation
When using Babel, ts-jest, by default, doesn't use the
.babelrc file. If you want ts-jest to use
.babelrc, you should set the
globals > ts-jest > useBabelrc flag to
true in your
In some cases, projects may not want to have a
.babelrc file, but still need to provide custom Babel configuration. In these cases, you can provide a Babel config directly to
ts-jest using the
globals > ts-jest > babelConfig option in your
Note that if you also set the
useBabelrc option to
true, any configuration passed using this method will be overwritten by corresponding keys in
There is a few additional steps if you want to use it with React Native.
npm install -D babel-jest babel-preset-react-native
jest section, the
transform should be like this:
Fully completed jest section should look like this:
If only testing typescript files then remove the
js option in the testRegex.
When using Jest with Angular (a.k.a Angular 2) apps you will likely need to parse HTML templates. If you're unable to add
html-loader to webpack config (e.g. because you don't want to eject from
angular-cli) you can do so by defining
__TRANSFORM_HTML__ key in
You'll also need to extend your
transform regex with
If you have dependencies on npm packages that are written in TypeScript but are
not published in ES5 you have to tweak your configuration. For example
you depend on a private scoped package
@foo/bar you have to add following to
your Jest configuration:
// ..."transformIgnorePatterns":"<rootDir>/node_modules/(?!@foo)"// ...
By default Jest ignores everything in
node_modules. This setting prevents Jest from ignoring the package you're interested in, in this case
@foo, while continuing to ignore everything else in
"target": "ES6"while using
node v4in your test environment;
"jsx": "preserve"for now (see progress of this issue);
"baseUrl": "<path_to_your_sources>", you also have to change
jest configa little bit:
tsc --noEmit -p . && jest
jest.mock() calls is placed after actual code, (e.g. after functions or classes) and
skipBabel is not set,
the line numbers in stacktraces will be off.
We suggest placing the
jest.mock() calls after the imports, but before any actual code.
const enumis not supported
This is due to a limitation in the ts-jest preprocessor which compiles each test file individually, therefore ignoring implementations of ambient declarations. The TypeScript team currently have no plan to support const enum inlining for this particular compiler method. See #112 and #281 for more information.
One possible workaround is to manually inline usage of const enum values - i.e. in your code, use
let x: Enum = 1 as Enum as opposed to
let x: Enum = Enum.FirstValue. This allows you to keep the type checking on enums without running into this issue.
If you have any suggestions/pull requests to turn this into a useful package, just open an issue and I'll be happy to work with you to improve this.
git clone https://github.com/kulshekhar/ts-jestcd ts-jestnpm installnpm test
Note: If you are cloning on Windows, you may have to run
git config --system core.longpaths true for Windows to stop complaining about long filenames.