vscode jest extension doesn't work properly

Question

I'm working with VSCode and installed the extension: "Jest" for better jest-testing-enviroment.

In the extension's instruction I saw we get a nice intellisense support for Jest's commands.

The Problem:

1. I dont get "Jest" icon on the bottom bar, which means the ext doesnt work properly.

2. I still dont get the intellisense support for jest's commands

My Question:

Did anyone had this issue and find the way to configure it properly ?

Answer 1

Solution:

Once I understood my folder structure was the reason for the extension not to work properly, I started using VSCode's Workspaces.

Explanation:

When using Workspaces you can have multiple projects in one folder. Each will be count as a root project. The Workspace allows you to have multiple root projects in the same folder (which actually solved my problem).

When working with Jest without setting a jest.config.js file, you get your rootDir to its default (which is the folder where the package.json is in).

P.S.

From what I experienced till now, vscode-jest extension is not so stable and still has some bugs. So in my case, I decided to disable it for the meanwhile.

Answer 2

Highly recommend using the jest runner extension instead.

Demo:

Answer 3

On a fresh install of the extension, it didn't work properly for me right out of the box either. Running npm run test on the WSL2 terminal worked, but the extension didn't.

My folder structure was

root
__tests__
         __testThis__
                     featureA.js    <-- jest tests
         __andThis__
                    feature1.js     <--
                    feature2.js     <--
testThis.js
andThis.js
package.json

and my test script was initially "test": "jest --watchAll --maxWorkers=1", on my package.json.

But it finally worked after doing the ff.:

(1) Jest icon not appearing in bottom status bar

• Specify jest.rootPath in .vscode/settings.json . Documentation elaborates more on this here.
• I set mine as "" (empty) since I used testMatch to find my tests.

  "jest.rootPath": "",
  

(2) jest command not found

• make sure jest and jest-cli are installed in the shell used by the jest extension
• I had been running tests using WSL2 with no issues (without the extension), but encountered "jest command not found" with the extension.
• After installing jest and jest-cli on Git Bash, this was no longer a problem.

(3) Extension runs for a split second, then "watch-tests" ended unexpectedly

• Instead of using the Jest extension wizard, I ran jest --init at the root of my project to create a jest.config.js. This updates the test script to "test": "jest" -- I left this as is after.
• enable testMatch in the resulting jest.config.js, so jest knows where to look for tests

  testMatch: [
     "**/__tests__/**/*.[jt]s?(x)",
     "**/?(*.)+(spec|test).[tj]s?(x)"
  ],
  

(4) Tests finally run, but they run repeatedly until CPU usage goes --> ~90%

• turn jest autoRun off in .vscode/settings.json

  "jest.autoRun": "off",
  

• click thru the jest extension's side bar icon (the Erlenmeyer flask) to run tests only as needed

Even then, not everything in the extension works perfectly (e.g. the debugger still doesn't work for me), but am able to run single tests (or all tests at once) using the extension.

Hope this helps somehow!

Answer 4

I had the same problem. I just placed a jest.config.js at the root of my monorepo and the extension picks up. The problem, for me at least, was that it was looking for that file starting at the root path, and never finding it.

Answer 5

Try modifying the settings.json under: .vscode/settings.json and add this settings: https://stackoverflow.com/a/76942557/5108002