Angular 5 karma jasmine-jquery 匹配答案

【问题标题】：Angular 5 karma jasmine-jquery matchesAngular 5 karma jasmine-jquery 匹配
【发布时间】：2018-02-05 17:47:47
【问题描述】：

如何将 karma jasmine jquery 与 angular 5 匹配

请详细回答

我已经像这样在业力配置中成功加载了 jquery

module.exports = function (config) {
  config.set({
    basePath: '',

    frameworks: [ 'jasmine-jquery', 'jasmine', '@angular/cli'],
    plugins: [
      require('karma-jasmine'),
      require('karma-chrome-launcher'),
      require('karma-jasmine-html-reporter'),
      require('karma-coverage-istanbul-reporter'),
      require('@angular/cli/plugins/karma'),
      require('karma-jasmine-jquery'),
    ],

但我不知道如何将其导入规范运行器

这是我目前的导入工作正常

import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { MyComponent} from './my.component';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { exec } from 'child_process';
import { DebugElement } from '@angular/core/src/debug/debug_node';
import { By } from '@angular/platform-browser';

使用固定装置很好

  beforeEach(() => {
    fixture = TestBed.createComponent( MyComponent );
    component = fixture.componentInstance;
    contenTitleEL = fixture.
      debugElement.query( By.css('.contenTitle') ) ;
    fixture.detectChanges();
  });

测试很好用

  it('Should Display contenTitle', () => {
    expect( contenTitleEL ).toContain( contentTitle ) ;
  });

我想做的是

  it('Should Display contenTitle', () => {
    expect( contenTitleEL ).toHaveText( contentTitle ) ;
  });

请注意，我使用 angular-cli 生成项目

更新

看起来它正在工作，即使我认为我有

错误 TS2339：类型上不存在属性“toHaveText” '匹配者'。

关于如何解决此错误并在代码完成中具有功能的任何想法

ng 测试有时会因为这个 typescript 相关错误而拒绝加载

【问题讨论】：

karma-jasmine-jquery 自述文件说它预计将与 $j() 全局一起使用。你试过吗？ jasmine-jquery 说它预计将与 $() 全局一起使用。你试过了吗？
@estus $ 不是函数

标签： angular angular-cli karma-jasmine jasmine-jquery

【解决方案1】：

Finnaly 找到答案貌似你需要添加这个 npm 包

茉莉花-jquery-matchers

用

配置typestript包

{
  ....
  "compileOnSave": false,
  "compilerOptions": { 
    "types": [
      "jasmine",
      "jasmine-jquery-matchers"
    ], 
  ....
  }
}

然后最后导入spec.ts中的包

import {  } from 'jasmine-jquery/lib/jasmine-jquery';
import {  } from 'jasmine-jquery-matchers';

【讨论】：