Typescript library imports fail with Jest

[andrewbihl]

Describe the bug

Making a new React project with the defaults for typescript does not allow importing of a library when running a unit test.

I've put in a great deal of time trying to fix this in my project, but for this bug report I've simply started a new one with nothing more than the required steps to reproduce the error.

Running just these steps (and nothing else) causes the issue, even though all of the involved technologies (typescript, jest, react, create-react-app) claim to support the others.

Environment

current version of create-react-app: 3.4.1
running from /Users/...../34876/lib/node_modules/create-react-app

System:
OS: macOS 10.15.5
CPU: (16) x64 Intel(R) Core(TM) i9-9980HK CPU @ 2.40GHz
Binaries:
Node: 14.4.0 - /usr/local/bin/node
Yarn: 1.22.4 - /usr/local/bin/yarn
npm: 6.14.4 - /usr/local/bin/npm
Browsers:
Chrome: 84.0.4147.135
Firefox: 80.0
Safari: 13.1.1
npmPackages:
react: ^16.13.1 => 16.13.1
react-dom: ^16.13.1 => 16.13.1
react-scripts: 3.4.1 => 3.4.1
npmGlobalPackages:
create-react-app: Not Found

Steps to reproduce

Steps to reproduce:

1. npx create-react-app app --typescript

2. yarn add ky

3. Add file src/fetch-a-thing.ts:

import ky from 'ky'

export function fetchSomething() {
    ky.get('http://google.com')
    return true
}

4. Add file src/fetch-a-thing.test.ts:

import {fetchSomething} from './fetch-a-thing'

test('fetchSomething', () => {
    const res = fetchSomething()
    expect(res).toEqual(true)
})

Run: yarn test.

Output:

 FAIL  src/fetch-a-thing.test.ts
  ● 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.

    By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".

    Here's what you can do:
     • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
     • If you need a custom transformation specify a "transform" option in your config.
     • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.

    You'll find more details and examples of these config options in the docs:
    https://jestjs.io/docs/en/configuration.html

    Details:

    /Users/...../app/node_modules/ky/index.js:523
    export default createInstance();
    ^^^^^^

    SyntaxError: Unexpected token 'export'

    > 1 | import ky from 'ky'
        | ^
      2 | 
      3 | export function fetchSomething() {
      4 |     ky.get('http://google.com')

      at ScriptTransformer._transformAndBuildScript (node_modules/@jest/transform/build/ScriptTransformer.js:537:17)
      at ScriptTransformer.transform (node_modules/@jest/transform/build/ScriptTransformer.js:579:25)
      at Object.<anonymous> (src/fetch-a-thing.ts:1:1)

Expected behavior

Trivial test compiles and passes.

Actual behavior

Jest cannot run the test.

Reproducible demo

https://github.com/andrewbihl/jest-is-broken

[petetnt]

Hi @andrewbihl ,

there's a similar report in #7000 (comment)

Can you try if setting the transformIgnorePatterns settings would help?

Eg. add

{
  ....,
  "jest": {
    "transformIgnorePatterns": [
      "/!node_modules\\/ky/"
    ]
  }
}

to your package.json

[stale]

This issue has been automatically marked as stale because it has not had any recent activity. It will be closed in 5 days if no further activity occurs.

[stale]

This issue has been automatically closed because it has not had any recent activity. If you have a question or comment, please open a new issue.

[cpiber]

Hi @andrewbihl ,

there's a similar report in #7000 (comment)

Can you try if setting the transformIgnorePatterns settings would help?

Eg. add

{
  ....,
  "jest": {
    "transformIgnorePatterns": [
      "/!node_modules\\/ky/"
    ]
  }
}

to your package.json

Thank you, this indeed helped. It seems one of my packages uses ES module syntax with their new version. The tests couldn't handle that, but start could... I am on the newest version of create-react-app.