VS-Code wrong Types for Unit-Tests (Mocha&Chai instead of Jasmine)

Question

I have an ionic project which I want to e2e-test with Cypress and unit-test with Jasmine. After I added the cypress package to the package.json and started writing the first e2e-tests, VS-Code showed me some errors in the spec.ts files for my Unit-Tests. The problem is, that VS-Code assumes, that I am using Mocha and Chai for my tests.

I can run the tests without an error.

Here is my tsconfig.json file:

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "dec

    laration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2017",
      "dom"
    ]
  }
}

And my tsconfig.spec.json file:

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/spec",
    "module": "commonjs",
    "types": [
      "jasmine",
      "node"
    ]
  },
  "files": [
    "test.ts",
    "polyfills.ts",
  ],
  "include": [
    "**/*.spec.ts",
    "**/*.d.ts"
  ]
}

Finally my dependencies from package.json:

"dependencies": {
    "@angular/common": "~6.1.1",
    "@angular/core": "~6.1.1",
    "@angular/forms": "~6.1.1",
    "@angular/http": "~6.1.1",
    "@angular/platform-browser": "~6.1.1",
    "@angular/platform-browser-dynamic": "~6.1.1",
    "@angular/pwa": "^0.8.0-beta.2",
    "@angular/router": "~6.1.1",
    "@angular/service-worker": "~6.1.1",
    "@ionic-native/core": "5.0.0-beta.14",
    "@ionic-native/splash-screen": "5.0.0-beta.14",
    "@ionic-native/status-bar": "5.0.0-beta.14",
    "@ionic/angular": "^4.0.0-beta.0",
    "@ngxs/devtools-plugin": "^3.2.0",
    "@ngxs/router-plugin": "^3.2.0",
    "@ngxs/store": "^3.2.0",
    "child_process": "^1.0.2",
    "core-js": "^2.5.3",
    "karma-junit-reporter": "^1.2.0",
    "prompt": "^1.0.0",
    "rxjs": "6.2.2",
    "zone.js": "^0.8.26"
  },
  "devDependencies": {
    "@angular-devkit/architect": "~0.7.2",
    "@angular-devkit/build-angular": "~0.7.2",
    "@angular-devkit/core": "~0.7.2",
    "@angular-devkit/schematics": "~0.7.2",
    "@angular/cli": "^6.2.0-beta.2",
    "@angular/compiler": "~6.1.1",
    "@angular/compiler-cli": "~6.1.1",
    "@angular/language-service": "~6.1.1",
    "@compodoc/compodoc": "^1.1.3",
    "@ionic/ng-toolkit": "^1.0.0",
    "@ionic/schematics-angular": "^1.0.0",
    "@types/jasmine": "~2.8.6",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "~10.5.2",
    "codelyzer": "~4.4.2",
    "cypress": "^3.1.0",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~3.0.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.0",
    "karma-jasmine": "~1.1.1",
    "karma-jasmine-html-reporter": "^0.2.2",
    "start-server-and-test": "^1.7.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.11.0",
    "typescript": "~2.7.2"
  }

How can I solve the confusion of these testing frameworks?

Kind regards,

David

Answer 1

VS takes tsconfig.json file by default. Since you didn't specified types field in it, it takes all types from @types directory. Possible solution could be create tsconfig.json in nested folder instead of tsconfig.spec.json file and specify types field in it.