WebStorm / Rider - Cannot Debug Jest Tests - Unrecognized CLI Parameter: Unrecognized option "testTimeout"

Question

I'm working on a Vue.js 2.x project with Jest tests and, although I can run them fine, I can't debug them at all in Rider / WebStorm as I get the following error (paths abbreviated...)

/home/me/.nvm/versions/node/v14.21.2/bin/node --require /usr/share/rider/plugins/javascript-impl/helpers/jest-intellij/lib/jest-intellij-stdin-fix.js /home/me/Development/Repositories/my-app/src/MyApp.Web/ClientApp/node_modules/@vue/cli-service/bin/vue-cli-service.js test:unit --runInBand --testTimeout=10000000 --colors --reporters /usr/share/rider/plugins/javascript-impl/helpers/jest-intellij/lib/jest-intellij-reporter.js --verbose --testNamePattern=^VIEW: log-in shows a form where you can log in  --runTestsByPath /home/me/Development/Repositories/MyApp/src/MyApp.Web/ClientApp/tests/unit/views/log-in.spec.js
Debugger listening on ws://127.0.0.1:44527/c71be107-86f0-4e2f-ae31-2ebdd8c8892d
For help, see: https://nodejs.org/en/docs/inspector
Debugger attached.
● Unrecognized CLI Parameter:

  Unrecognized option "testTimeout".

  CLI Options Documentation:
  https://jestjs.io/docs/en/cli.html

Waiting for the debugger to disconnect...

Process finished with exit code 1

I'm not sure what to configure / tweak / change / fix to get this working. I can't just not send "testTimeout" as it's not under my control.

Is there something I should be doing with my jest-config.json file? It currently looks like this...

{
    "moduleFileExtensions": [
        "js",
        "json",
        "vue"
    ],
    "transformIgnorePatterns": [
        "/node_modules/(?!(core-js/modules/es6.array.filter|another-module|yet-another-module)/)"
    ],
    "modulePathIgnorePatterns": [
        "<rootDir>/.*/__mocks__"
    ],
    "transform": {
        ".*\\.(vue)$": "vue-jest",
        "^.+\\.js$": "<rootDir>/node_modules/babel-jest",
        "\\.(jpg|jpeg|png|gif|webp|svg)$": "<rootDir>/img-test-transformer.js",
        "\\.(eot|otf|svg|ttf|woff|woff2)$": "<rootDir>/font-test-transformer.js",
        "\\.(mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/media-test-transformer.js",
        "\\.(css|styl|less|sass|scss)$": "jest-transform-stub"
    },
    "moduleNameMapper": {
        "\\.(css|less)$": "<rootDir>/__mocks__/style-mock.js",
        "^@/(.*)$": "<rootDir>/src/$1"
    },
    "testResultsProcessor": "./node_modules/jest-junit-reporter",
    "collectCoverage": true,
    "coverageReporters": [
        "json",
        "text-summary",
        "cobertura"
    ],
    "collectCoverageFrom": [
        "src/**/*.{js,vue}",
        "!**/node_modules/**",
        "!**/dist/**"
    ]
}

Keith Jackson · Answer 1 · 2023-03-07T16:33:06.727

NOT RECOMMENDED The workaround below does kind of work but it left me in a weird mess where one of my files was stuck with errors that just wouldn't go away. I suspect that not using the Vue CLI option means that the imports don't work properly. Something in Rider / WebStorm has now got convinced that it needs to run that particular test file that way and won't now be told otherwise - I was only able to get it to run properly by changing the file name.

Original suggestion follows...

This isn't an ideal answer, as it needs to be set each time, but I managed to get the tests debugging by going to the run configuration for the test suite and under "Edit Configuration Settings" setting the "Jest package" setting to "jest" rather than "@vue/cli-service" This then works for the given run configuration (Maybe....). You can run a single test this way by right clicking the test run icon in the code window and doing the same.

The downside to this approach is that it then seems to cause other errors - Namely "SyntaxError: Cannot use import statement outside a module" starts popping up everywhere.

WebStorm / Rider - Cannot Debug Jest Tests - Unrecognized CLI Parameter: Unrecognized option "testTimeout"

1 Answers1