jest-preset-angular: Unexpected token import on new project

Following the instructions in the README with a brand new Angular CLI 1.0 generated project results in an “Unexpected token import” error when running jest.

Environment: OS: OSX Sierra @angular/cli: v1.0.0 node: v7.5.0 Typescript: v2.2.2

Reproduction steps:

$ ng new temp-jest
$ npm install --save-dev jest jest-preset-angular @types/jest
$ npm uninstall --save-dev @types/jasmine

Follow the instructions in the README to create setupJest.ts and jestGlobalMocks.ts as well as the instructions to add the package.json settings and scripts.

Running the following command:

$ npm test

results in the following error:

 FAIL  src/app/app.component.spec.ts
  ● Test suite failed to run

    /Users/bradyisom/Development/temp/temp-jest/src/setupJest.ts:1
    ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){require('ts-jest').install();import 'jest-preset-angu
lar';
                                                                                                                          ^^^^^^
    SyntaxError: Unexpected token import

      at transformAndBuildScript (node_modules/jest-runtime/build/transform.js:320:12)
      at process._tickCallback (internal/process/next_tick.js:103:7)

Test Suites: 1 failed, 1 total
Tests:       0 total
Snapshots:   0 total
Time:        1.005s
Ran all test suites.
error Command failed with exit code 1.

Also, running with --no-cache option results in the same error.

About this issue

Original URL
State: closed
Created 7 years ago
Reactions: 1
Comments: 21 (8 by maintainers)

Commits related to this issue

Bump zone.js peerDependency, use a valid SPDX license expression (#4) — committed to JLHwung/jest-preset-angular by 4kochi 7 years ago

Most upvoted comments

Ok, so you’ll need to add "allowJs": true to "compilerOptions" in you src/tsconfig.spec.json file.

thymikee on Apr 9, 2017

Ok, so I can repro this! The problem is "module" entry in src/tsconfig.app.json. Looks like ts-jest needs it to be set to "commonjs" instead of "es2015":

"compilerOptions": {
  "module": "commonjs"
}

From the preset side, it should use src/tsconfig.spec.json by default, I’ll address a PR in a minute. After changing anything in TS config, jest need to be run with --no-cache once.

thymikee on Apr 4, 2017

You need to add that package to the whitelist of transformIgnorePatterns. Include something like this in Jest config entry in your package.json:

"transformIgnorePatterns": [
  "node_modules/(?!@ngrx|angular2-ui-switch)"
]

thymikee on Apr 8, 2017

It’s working, thank you !

srod on Apr 9, 2017

Hi @jkyoutsey,

The issue you have is because jest asks for module:common.js in your tsconfig.spec.json. Once you declare that and run jest --clearCache then rerun your tests, it will be fine.

ahnpnl on Jan 18, 2019