Jest fails to parse TSX in preact

Viewed 626

I'm trying to run tests with Jest and enzyme in a Preact app with TypeScript.

I get a Jest encountered an unexpected token error :

FAIL  src/app/app.test.tsx
  ● Test suite failed to run

    Jest encountered an unexpected token

    This usually means that you are trying to import a file which Jest cannot parse, 
     e.g. it's not plain JavaScript.
...
    Details:

    src/app/app.test.tsx:10
        const wrapper = enzyme_1.mount(<app_1.default optOutUrl="none"/>);
                                       ^

    SyntaxError: Unexpected token <

    at Runtime.createScriptFromCode (node_modules/jest-runtime/build/index.js:1059:14)

After seen TypeScript example in this repository, I Changing jsx option to react in tsconifg.json. But It not helpful for my project environment:

Cannot find module 'react' from 'styled.js'

    However, Jest was able to find:
        './styled.js'
        './styled.js.flow'
        './styled.js.map'

    See https://jestjs.io/docs/en/configuration#modulefileextensions-array-string

      at Resolver.resolveModule (node_modules/jest-resolve/build/index.js:276:11)
      at Object.<anonymous> (node_modules/linaria/src/react/styled.js:3:15)

In the above error, it says that react parsing failed in the styled component related file. (I’m use styled components from linaria/react with custom Preact typing.) this issue not appear in development and production environment.

I also tried using babel-jest with below config.

“transform”: {
      “^.+\\.t(s|x)$”: “babel-jest”
    }
 FAIL  src/app/app.test.tsx
  ● Test suite failed to run

    src/app/app.tsx: Cannot find module 'react'
0 Answers
Related