Обновление Angular с 8 по 9 создает проблемы для тестирования фреймворка

#javascript #angular #electron #angular8 #angular-upgrade

#javascript #angular #electron #angular8 #angular-обновление

Вопрос:

Я обновил свое приложение с Angular 8 до 9, используя следующую команду ng update @angular / core @9 @angular / cli @ 9

на основе следующего руководства https://update.angular.io/?l=2amp;v=8.1-9.0

Миграция прошла успешно, но когда я выполняю «ng serve», я получаю ошибки в нескольких файлах .spec

Добавление нескольких ошибок и предложений из командной строки ниже

 1) test.component.spec.ts:395:13 - error TS2304: Cannot find name 'expect'.
395  expect(effects.loadTest$).toBeObservable(expected);

2) home.component.spec.ts:365:5 - error TS2593: Cannot find name 'describe'. Do you need to install type definitions for a test runner? Try `npm i @types/jest` or `npm i @types/mocha` and then add `jest` or `mocha` to the types field in your tsconfig.

365     describe('myTest$', () => {
  

Я использую Jasmin в качестве тестового бегуна, но почему я получаю нижеприведенное предложение (я пробовал это, но тоже не сработало)

  Do you need to install type definitions for a test runner? Try `npm i @types/jest` or `npm i @types/mocha` and then add `jest` or `mocha` to the types field in your tsconfig.
  

Пожалуйста, найдите мой package.json после обновления

 {
  "name": "myapp",
  "productName": "MyApp",
  "description": "My Test App",
  "version": "0.5.0",
  "license": "",
  "main": "main.js",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build --aot",
    "build:prod": "ng build --prod",
    "test": "ng test",
    "test-ci": "ng test --watch=false --reporters junit --code-coverage --browsers HeadlessChrome --progress=false",
    "coverage": "ng test --watch=false --code-coverage",
    "lint": "ng lint",
    "bundle-report": "webpack-bundle-analyzer dist/stats.json",
    "electron-dev": "concurrently -k "ng serve" "electron ."",     
    "start:electron": "electron ."
  },
  "dependencies": {
    "@angular/animations": "9.1.12",
    "@angular/cdk": "~8.2.3",
    "@angular/common": "9.1.12",
    "@angular/compiler": "9.1.12",
    "@angular/core": "9.1.12",
    "@angular/forms": "9.1.12",
    "@angular/material": "~8.2.3",
    "@angular/platform-browser": "9.1.12",
    "@angular/platform-browser-dynamic": "9.1.12",
    "@angular/router": "9.1.12",
    "@microsoft/signalr": "^3.1.8",
    "@ngrx/effects": "^8.6.0",
    "@ngrx/entity": "^8.6.0",
    "@ngrx/router-store": "^8.6.0",
    "@ngrx/store": "^8.6.0",
    "@ngrx/store-devtools": "^8.6.0",
    "@ngx-translate/core": "^12.1.2",
    "@ngx-translate/http-loader": "^4.0.0",
    "@types/file-saver": "^2.0.1",
    "bootstrap": "^4.4.1",
    "bootstrap-sass": "^3.4.1",
    "browserslist": "^4.14.5",
    "classlist.js": "^1.1.20150312",
    "core-js": "^3.6.5",
    "ej-angular2": "18.1.42",
    "file-saver": "^2.0.2",
    "hammerjs": "^2.0.8",
    "istanbul-api": "^3.0.0",
    "istanbul-reports": "^3.0.2",
    "jasmine-marbles": "^0.6.0",
    "jquery": "^3.4.1",
    "js-yaml": "^3.13.1",
    "kill-port": "^1.6.1",
    "lodash": "^4.17.20",
    "moment": "^2.29.0",
    "ngx-bootstrap": "^5.6.2",
    "ngx-image-cropper": "^0.2.9",
    "node-sass": "^4.14.1",
    "rxjs": "^6.6.3",
    "syncfusion-javascript": "18.1.42",
    "tslib": "^1.10.0",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.901.12",
    "@angular-devkit/core": "9.1.12",
    "@angular-devkit/schematics": "9.1.12",
    "@angular/cli": "^9.1.12",
    "@angular/compiler-cli": "~9.1.12",
    "@angular/language-service": "9.1.12",
    "@ngrx/schematics": "^8.6.0",
    "@types/bootstrap": "^3.4.0",
    "@types/ej.web.all": "18.1.2",
    "@types/fs-extra": "^8.1.1",
    "@types/jasmine": "^3.5.14",
    "@types/jasminewd2": "^2.0.8",
    "@types/jquery": "3.5.0",
    "@types/lodash": "^4.14.161",
    "@types/node": "^12.11.1",
    "angular-auth-oidc-client": "^9.0.8",
    "codelyzer": "^5.1.2",
    "electron": "^10.1.5",
    "electron-builder": "^22.8.1",
    "jasmine-core": "^3.6.0",
    "jasmine-spec-reporter": "^6.0.0",
    "karma": "^5.2.3",
    "karma-chrome-launcher": "^3.1.0",
    "karma-cli": "^2.0.0",
    "karma-coverage-istanbul-reporter": "^3.0.2",
    "karma-html-reporter": "^0.2.7",
    "karma-jasmine": "^4.0.1",
    "karma-jasmine-html-reporter": "^1.5.4",
    "karma-junit-reporter": "^2.0.1",
    "protractor": "^7.0.0",
    "puppeteer": "^5.3.1",
    "ts-node": "~8.10.1",
    "tslint": "^6.1.3",
    "typescript": "~3.8.3",
    "webpack-bundle-analyzer": "^3.9.0"
  }
}
  

Ответ №1:

Вероятно, вам нужно проверить "typeRoots" в вашем tsconfig.json или tsconfig.spec.json

Убедитесь, что у вас есть эта запись:

  "typeRoots": ["node_modules/@types"],
  

если у вас это tsconfig.json есть, возможно tsconfig.spec.json , потребуется расширить tsconfig.json следующим образом:

   "extends": "../tsconfig.json",
  

Кроме того, это, вероятно, не решит проблему, но в вашем есть некоторые зависимости packages.json , которые, вероятно, необходимо перенести в devDependencies подобные тезисы:

 "istanbul-api": "^3.0.0",
"istanbul-reports": "^3.0.2",
"jasmine-marbles": "^0.6.0",