Модульные тесты Angular 2: не удается найти имя «описать»

213

Я слежу за этим уроком от angular.io

Как они сказали, я создал файл hero.spec.ts для создания юнит-тестов:

import { Hero } from './hero';
describe('Hero', () => {
  it('has name', () => {
    let hero: Hero = {id: 1, name: 'Super Cat'};
    expect(hero.name).toEqual('Super Cat');
  });
  it('has id', () => {
    let hero: Hero = {id: 1, name: 'Super Cat'};
    expect(hero.id).toEqual(1);
  });
});

Модульные тесты работают как шарм. Проблема: я вижу некоторые ошибки, которые упоминаются в учебнике:

Наш редактор и компилятор могут жаловаться, что они не знают, что it и expectкак, потому что им не хватает печатных файлов, которые описывают Jasmine. Мы можем пока игнорировать эти раздражающие жалобы, поскольку они безвредны.

И они действительно проигнорировали это. Несмотря на то, что эти ошибки безвредны, я не выгляжу хорошо в моей выходной консоли, когда получаю кучу таких ошибок.

Пример того, что я получаю:

Не могу найти название «описать».

Не могу найти имя 'оно'.

Не могу найти имя «ожидаю».

Что я могу сделать, чтобы это исправить?

Piotrek
источник
Вы можете проголосовать на Github, чтобы исправить эту ошибку: github.com/TypeStrong/atom-typescript/issues/1125
Лукас Кимон,

Ответы:

387

Я надеюсь, что вы установили -

npm install --save-dev @types/jasmine

Затем поместите следующий импорт в верхней части hero.spec.tsфайла -

import 'jasmine';

Это должно решить проблему.

ksharifbd
источник
3
В зависимости от требуемой версии Typescript может потребоваться установить более раннюю версию. Например, для ionic v2.2.1, который я сейчас использую и использует typcript v2.0.9, мне нужно было установить @types/jasmine@2.5.41. В противном случае вы можете увидеть эти ошибки компиляции .
Тони О'Хаган
18
Вы можете просто импортировать модуль для его побочных эффектов:import 'jasmine';
camolin3
8
Что на import {} from 'jasmine';самом деле делает? Это так же, как import 'jasmine'?
TetraDev
2
В ANGULAR 6.0.3: я только что импортировал «import {} из жасмина», и он снова заработал
Эдуардо Кордейру,
2
@aesede Какую версию PS вы запускаете? Я просто выполнил команду без кавычек, и все прошло хорошо.
Конрад Вилтерстен
162

С Typescript@2.0 или новее вы можете устанавливать типы с:

npm install -D @types/jasmine

Затем импортируйте типы автоматически, используя typesопцию в tsconfig.json:

"types": ["jasmine"],

Это решение не требуется import {} from 'jasmine';в каждом файле спецификации.

Цзяи Ху
источник
9
В соответствии с документами TypeScript для tsconfig.json (v2.1 в настоящее время), нет необходимости добавлять "types": ["jasmine"]строку больше. «По умолчанию все видимые« @types »пакеты включены в вашу компиляцию. Пакеты в node_modules / @ types любой вложенной папки считаются видимыми, в частности, это означает, что пакеты внутри ./node_modules/@types/, ../node_modules/@ типов /, ../../node_modules/@types/ и т. д. "
Бхолбен
12
@bholben Я знаю, но по какой-то причине nodeи jasmineтипы не обнаружены. По крайней мере, это не работает для меня, и я использую Typescript@2.1.5
Цзяи Ху
2
Это решение не работает для меня :(, извините. Я использовал его ang-app/e2e/tsconfig.json. Я пробовал его на каждом уровне json . Не могли бы вы добавить более подробную информацию?
Сергей
Это не будет работать при использовании веб-пакета - в этом случае нужно обслуживать реальную библиотеку - импорт {} из 'jasmine' проталкивает библиотеку через
Богдан
Это сработало для меня, но мне также пришлось обновить мой глобальный машинописный текст до 3.5.3 (с 2.5)
jsaddwater
27
npm install @types/jasmine

Как уже упоминалось в некоторых комментариях, "types": ["jasmine"]он больше не нужен, все @typesпакеты автоматически включаются в компиляцию (начиная с версии 2.1, я думаю).

На мой взгляд, самое простое решение - исключить тестовые файлы в вашем файле tsconfig.json, например:

"exclude": [
    "node_modules",
    "**/*.spec.ts"
]

Это работает для меня.

Дополнительная информация в официальных документах tsconfig .

Ленни
источник
3
просто примечание: новые проекты Angular есть src/tsconfig.app.json, src/tsconfig.spec.jsonи tsconfig.json. Упомянутый раздел «исключить» является частью первого. "types": [ "jasmine" ]часть вторая.
Мартин Шнайдер
2
Обратите внимание, что в VS Code вы теряете возможность находить ссылки в ваших спецификационных файлах, так как они не будут считаться частью Проекта.
Млеу
@mleu Я столкнулся с той же проблемой. Как вы решили эту проблему? Каждый раз, когда я пишу тестовый пример, я должен удалить шаблон spec-файлов из excludeблока.
Шишир Аншуман
@ShishirAnshuman: я не нашел решения и должен был жить с этим ограничением, пока проект не закончился.
Млеу
@mleu Ох. Нет проблем. В моем проекте в качестве обходного пути я удалил шаблон spec-файла из excludeблока tsconfig . Затем я создал новый tsconfig.build.jsonфайл с шаблоном spec-файла, добавленным в excludeблок. Теперь в моих ts-loaderнастройках (в webpack.config) я использую tsconfig.build.json. В этих конфигурациях модули разрешаются в тестовых файлах, и при создании сборки или запуске сервера тестовые файлы исключаются.
Шишир Аншуман
13

Вам нужно установить набор текста для Жасмин. Предполагая, что вы пользуетесь относительно свежей версией машинописного текста 2, вы должны сделать следующее:

npm install --save-dev @types/jasmine
аллюр
источник
8

С Typescript@2.0 или новее вы можете устанавливать типы с помощью npm install

npm install --save-dev @types/jasmine

затем импортировать типы автоматически с помощью typeRoots опции в tsconfig.json.

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

Это решение не требует импорта {} из 'Жасмин'; в каждом файле спецификации.

mvermand
источник
1
К сожалению, это не работает. Он по-прежнему показывает ошибки в спецификациях
dave0688,
3

Решение этой проблемы связано с тем, что @Pace написал в своем ответе. Однако, это не все объясняет, поэтому, если вы не возражаете, я напишу это сам.

РЕШЕНИЕ:

Добавление этой строки:

///<reference path="./../../../typings/globals/jasmine/index.d.ts"/>

в начале hero.spec.tsфайла исправляет проблему. Путь ведет кtypings папке (где хранятся все наборы).

Чтобы установить набор текста, вам нужно создать typings.jsonфайл в корне вашего проекта со следующим содержимым:

{
  "globalDependencies": {
    "core-js": "registry:dt/core-js#0.0.0+20160602141332",
    "jasmine": "registry:dt/jasmine#2.2.0+20160621224255",
    "node": "registry:dt/node#6.0.0+20160807145350"
  }
}

И запустить typings install(где typingsнаходится пакет NPM).

Piotrek
источник
3
это нестандартный способ сделать это. правила tslint по умолчанию будут препятствовать ссылочным путям. используйте файл tsconfig, чтобы указать на node_modules
FlavorScape,
3

В моем случае решение было удалить по typeRootsмоему tsconfig.json.

Как вы можете прочитать в документе TypeScript

Если указан typeRoots, будут включены только пакеты в typeRoots.

moppag
источник
3

Я в курсе последних событий на сегодняшний день и нашел лучший способ решить эту проблему - ничего не делать ... typeRootsнет, typesнет, excludeнет, includeвсе настройки по умолчанию, кажется, работают просто отлично. На самом деле это не сработало для меня, пока я не удалил их все. Я имел:

"exclude": [
    "node_modules"
]

но это по умолчанию, поэтому я удалил это.

Я имел:

"types": [
    "node"
]

чтобы пройти какое-то предупреждение компилятора. Но теперь я тоже это убрал.

Предупреждение, которое не должно быть: error TS2304: Cannot find name 'AsyncIterable'. отnode_modules\@types\graphql\subscription\subscribe.d.ts

что очень неприятно, поэтому я сделал это в tsconfig, чтобы он загружался:

"compilerOptions": {
    "target": "esnext",
}

так как он в наборе esnext. Я не использую его напрямую, поэтому пока не стоит беспокоиться о совместимости. Надеюсь, это не сожжет меня позже.

philn5d
источник
Вам не нужно , чтобы добавить "types": ["node"]в tsconfig.jsonно вы должны добавить этот тип в tsconfig.app.json! Вы не должны иметь это предупреждение снова, я думаю. Вы могли бы сохранить "target": "es5"или "target": "es6"сейчас.
Кристоф Шевалье
2

Нужно было только сделать следующее, чтобы забрать @types в Lerna Mono-repo, где существует несколько узлов node_modules.

npm install -D @types/jasmine

Затем в каждом файле tsconfig.file каждого модуля или приложения.

"typeRoots": [
  "node_modules/@types",
  "../../node_modules/@types" <-- I added this line
],
SoEzPz
источник
По умолчанию все видимые пакеты «@types» включены в вашу компиляцию. Пакеты в типах node_modules / @ любой вложенной папки считаются видимыми; в частности, это означает, что пакеты находятся внутри ./node_modules/@types/, ../node_modules/@types/, ../../node_modules/@types/ и так далее. Смотрите официальную документацию
Кристоф Шевалье
1

Чтобы компилятор TypeScript использовал все видимые определения типов во время компиляции, typesопция должна быть полностью удалена из compilerOptionsполя вtsconfig.json файле.

Эта проблема возникает, когда typesв compilerOptionsполе есть некоторые записи , где в то же время jestотсутствует запись.

Таким образом, чтобы решить проблему, compilerOptionsполе в вашем поле tscongfig.jsonдолжно быть либо включено jestв typesобласть, либо полностью typesисключено:

{
  "compilerOptions": {
    "esModuleInterop": true,
    "target": "es6",
    "module": "commonjs",
    "outDir": "dist",
    "types": ["reflect-metadata", "jest"],  //<--  add jest or remove completely
    "moduleResolution": "node",
    "sourceMap": true
  },
  "include": [
    "src/**/*.ts"
  ],
  "exclude": [
    "node_modules"
  ]
}
Омер Гурарслан
источник
Это сработало для меня, я имел google map typesв typesварианте. После полного удаления опции все заработало нормально.
Прите Агравал
1

Я просто добавлю Ответ для того, что работает для меня в "typcript": "3.2.4" Я понял, что у jasmine в node_modules / @ types есть папка для ts3.1 под типом jasmine, так что вот шаги: -

  • Тип установки жасмин npm install -D @types/jasmine
  • Добавить в tsconfig.json Жасмин / ts3.1

    "typeRoots": [ ... "./node_modules/jasmine/ts3.1" ],

  • Добавить жасмин к типам

    "types": [ "jasmine", "node" ],

Примечание: в этомimport 'jasmine';большенет необходимости.

Эслам Махгуб
источник
1

В моем случае я получал эту ошибку при обслуживании приложения, а не при тестировании. Я не знал, что у меня был другой параметр конфигурации в моем файле tsconfig.app.json.

У меня ранее было это:

{
  ...
  "include": [
    "src/**/*.ts"
  ]
}

Он включал все мои .spec.tsфайлы при обслуживании приложения. Я изменил include property toexclude` и добавил регулярное выражение, чтобы исключить все тестовые файлы, например:

{
  ...
  "exclude": [
    "**/*.spec.ts",
    "**/__mocks__"
  ]
}

Теперь все работает как положено.

Король джеймс энехо
источник
0

Посмотрите на импорт, возможно, у вас есть зависимость цикла , в моем случае это была ошибка, использование import {} from 'jasmine';исправит ошибки в консоли и сделает код компилируемым, но не удалит корень дьявола (в моем случае зависимость цикла).

G.Vitelli
источник
0

Я на Angular 6, Typescript 2.7, и я использую Jest Framework для модульного тестирования. Я @types/jestустановил и добавилtypeRoots внутриtsconfig.json

Но все равно есть ошибка дисплея ниже (то есть: на терминале нет ошибок)

не могу найти название описать

И добавление импорта:

import {} from 'jest'; // in my case or jasmine if you're using jasmine

технически ничего не делает, поэтому я подумал, что где-то есть импорт, вызывающий эту проблему, то я обнаружил, что если удалить файл

tsconfig.spec.json

в src/папке, решил проблему для меня. Поскольку @types импортируется раньше внутри rootTypes.

Я рекомендую вам сделать то же самое и удалить этот файл, никакой необходимой конфигурации внутри. (пс: если вы в том же деле, что и я)

GetName
источник
0

если ошибка в файле .specs app / app.component.spec.ts (7,3): ошибка TS2304: невозможно найти имя beforeEach.

добавьте это в начало вашего файла и npm установите rxjs

import {range} из 'rxjs'; import {map, filter} из 'rxjs / operator';

cfphpflex
источник