Skip to content

Add support for specific tsconfig file path inside of vue-jest jest.config.js options #309

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
JessicaSachs opened this issue Dec 7, 2020 · 9 comments

Comments

@JessicaSachs
Copy link
Contributor

We refactored vue-jest to have better tsconfig support by recursively walking up the directory structure, but sometimes users use sibling directories to store their build + config settings.

Can we specify a tsconfig path inside of jest.config.js? Perhaps relative to <rootDir>?

@xiaohulu
Copy link
Contributor

xiaohulu commented Mar 8, 2021

My project is a electron app, I put tsconfig.json at src/renderer/, when I run npm run jest report below errors:

 FAIL  src/renderer/layout/titlebar/__test__/Titlebar.spec.ts
  ● Test suite failed to run

    TypeError: Cannot read property 'compilerOptions' of null

      at Object.transpileModule (../../node_modules/typescript/lib/typescript.js:131656:40)
      at Object.process (../../node_modules/vue-jest/lib/transformers/typescript.js:22:28)
      at processScript (../../node_modules/vue-jest/lib/process.js:44:30)
      at Object.module.exports [as process] (../../node_modules/vue-jest/lib/process.js:140:24)
      at ScriptTransformer.transformSource (../../node_modules/@jest/transform/build/ScriptTransformer.js:464:35)
      at ScriptTransformer._transformAndBuildScript (../../node_modules/@jest/transform/build/ScriptTransformer.js:569:40)
      at ScriptTransformer.transform (../../node_modules/@jest/transform/build/ScriptTransformer.js:613:25)

I found resolveTsConfigSync just resolve tsconfig at root dir, see #307 (comment)

vue-jest 5.0.0-alpha.8

@lmiller1990
Copy link
Member

@xiaohulu we should definitely support this. Are you interested in making a PR? I made a suggestion on how to do this here.

@xiaohulu
Copy link
Contributor

xiaohulu commented Mar 8, 2021

@lmiller1990 I'll try to make a PR, but I'm not sure if I can do it well。

@lmiller1990
Copy link
Member

Give it a try :) if you get stuck ask - I can help out.

@xiaohulu
Copy link
Contributor

xiaohulu commented Mar 10, 2021

@lmiller1990 Throw errors when I run npm run test:e2e on win10

[vue-jest]: (babel-in-package) Copying vue-jest into node_modules

'cp' is not an internal or external command, nor is it a runnable program  or batch file
error Command failed with exit code 1.

Use yarn test:e2e works

xiaohulu added a commit to xiaohulu/vue-jest that referenced this issue Mar 10, 2021
@xiaohulu
Copy link
Contributor

xiaohulu commented Mar 10, 2021

@lmiller1990 I make a PR.

Another question about typescript. I try to change package.json to below code which use ts-jest. Run yarn test:e2e then report errors

{
  "name": "typescript",
  "version": "1.0.0",
  "main": "index.js",
  "license": "MIT",
  "private": true,
  "scripts": {
    "test": "jest --no-cache ./sub-project/test.js"
  },
  "dependencies": {
    "vue": "3.0.0-alpha.10"
  },
  "devDependencies": {
    "@types/jest": "^26.0.20",
    "ts-jest": "^26.5.3",
    "typescript": "^4.2.3",
    "jest": "^24.0.0"
  },
  "jest": {
    "globals": {
      "vue-jest": {
        "tsConfig": "./sub-project/tsconfig.json"
      }
    },
    "moduleFileExtensions": [
      "js",
      "ts",
      "json",
      "vue"
    ],
    "transform": {
      "^.+\\.ts$": "ts-jest",
      "^.+\\.vue$": "../../../lib/index.js"
    }
  }
}

then report errors. Did I miss something?

 FAIL  sub-project/test.js
  ● Test suite failed to run

    D:\sources\xiaohulu\vue-jest\e2e\__projects__\typescript\sub-project\test.js:1
    ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import { createApp, h } from 'vue'
                                                                                             ^^^^^^

    SyntaxError: Cannot use import statement outside a module

      at ScriptTransformer._transformAndBuildScript (node_modules/@jest/transform/build/ScriptTransformer.js:537:17)
      at ScriptTransformer.transform (node_modules/@jest/transform/build/ScriptTransformer.js:579:25)

@lmiller1990
Copy link
Member

lmiller1990 commented Mar 15, 2021

Hi!

Regarding cp ... yep, it's only going to work on a linux env. The problem is [here](

run(`cp ${cwd}/package.json node_modules/vue-jest/`)
.

You could rewrite that part of the code using fs perhaps, so it's cross platform. Something like fs.readFileSync to get the file, then fs.writeFileSync to write it. 🤔

Regarding the second error - you might need to install babel-jest. Jest will not read ES modules out of the box. Just installing babel-jest (should) let it work.

If not, please push your branch and write instructions so I can try running it. This project is pretty tricky and annoying to work on at times, but I'm sure we can get this to work 👍

EDIT: I see your branch here: https://github.com/vuejs/vue-jest/pull/324/files

I can look tonight! :) Thanks for waiting.

nogic1008 pushed a commit that referenced this issue Mar 29, 2021
…jest.config.js options (#324)

* feat: add support for specific tsconfig file path inside of vue-jest jest.config.js options (#309)
* chore: modify package name property
* style: avoid use Optional Chaining
@nogic1008
Copy link
Collaborator

PR contains linguish error, so I fixed & merged.
@lmiller1990 I'll fix test-script issue on Windows soon.

@lmiller1990
Copy link
Member

Thanks.

You are now added a collab. Feel free to make fixes/close issues if you want, let me know if you need any help with anything.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

4 participants