Jest parsing fails with the simple implementation of axios

[siddtheone]

Describe the bug

• Execute npx create-react-app test --template typescript
• Move to new app cd test
• Execute tests by npm run test press a to execute all tests and observe that all tests are passing.
• Install axios by running npm i axios
• Add following code to the App.tsx file

import axios from "axios";
import React, { useEffect } from "react";
import logo from "./logo.svg";
import "./App.css";

function App() {
  useEffect(() => {
    axios.get("https://jsonplaceholder.typicode.com/posts");
  }, []);
  return (
    <div className="App">
      <header className="App-header">
        <img src={logo} className="App-logo" alt="logo" />
        <p>
          Edit <code>src/App.tsx</code> and save to reload.
        </p>
        <a
          className="App-link"
          href="https://reactjs.org"
          target="_blank"
          rel="noopener noreferrer"
        >
          Learn React
        </a>
      </header>
    </div>
  );
}

export default App;

• Tests starts failing with the following error

My package.json is as below

{
  "name": "test",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^5.16.5",
    "@testing-library/react": "^13.4.0",
    "@testing-library/user-event": "^13.5.0",
    "@types/jest": "^27.5.2",
    "@types/node": "^16.18.11",
    "@types/react": "^18.0.27",
    "@types/react-dom": "^18.0.10",
    "axios": "^1.2.4",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-scripts": "5.0.1",
    "typescript": "^4.9.4",
    "web-vitals": "^2.1.4"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

Did you try recovering your dependencies?

No

Which terms did you search for in User Guide?

Environment

(paste the output of the command here.)

Steps to reproduce

(Write your steps here:)

Expected behavior

(Write what you thought would happen.)

Actual behavior

(Write what happened. Please add screenshots!)

Reproducible demo

(Paste the link to an example project and exact instructions to reproduce the issue.)

[holly-cummins]

I'm seeing this too. I'm sure there's some configuration that fixes this, but I've tried a few and haven't found a working combination. It would be nice if debugging into config options wasn't needed.

I first started with transform options:

  "jest": {
    "transformIgnorePatterns": [
      "node_modules/(?!@axios)/"
    ]
  }

... but that gives a TextEncoder error.

[holly-cummins]

(This is probably the same as axios/axios#5101)