karma angular 2 应用程序中的单元测试事件答案

【问题标题】：Unit Testing events in karma angular 2 applicationkarma angular 2 应用程序中的单元测试事件
【发布时间】：2017-05-19 10:33:09
【问题描述】：

我正在尝试使用 karma 对方法 abc(Event) 进行单元测试。我的视图页面中有一个下拉菜单，其中有 4 个选项，在更改时将触发 abc(Event) 方法。

这是我的查看页面：

<div class="myClass">
<select (change)="abc($event)" id="my">
    <option value="one">One</option>
    <option value="two">Two</option>
    <option value="three">Three</option>
    <option value="four">Four</option>
</select>

我的 component.ts 文件包含方法 abc 的定义。

import {Component,OnInit} from '@angular/core';
import { LocaleService } from '../../../services/locale.service';
@Component({
selector: 'app-localeselector',
templateUrl: './localeselector.component.html',
styleUrls: ['./localeselector.component.scss']
})


export class LocaleselectorComponent implements OnInit{

 private localeService: any;
 private language;
 constructor() { }

 ngOnInit() { }

}

abc(ev: Event) {
    //something...
}
}

如何测试方法 abc？还有如何模拟 $event？提前致谢。

【问题讨论】：

您可以创建一个LocaleselectorComponent 组件实例并调用abc。此外，您的构造函数可以被删除。
@AluanHaddad：如何在调用方法 abc 时模拟事件？
@AmitChigadani：尝试模拟 Event 对象。但没有积极的结果:(
你只需要传入一个对象

标签： angular events mocking karma-jasmine

【解决方案1】：

谢谢，成功了！！！ :) 我找到了解决方案。能够通过发送一个对象来模拟事件。

it('should work', () => {
    component.abc({ srcElement: { value: 'xyz' } });
    expect(someMethod.getValue()).toEqual('xyz');
});

我还将component.ts文件中的abc方法更改为

abc($event){
    //do something...
}

【讨论】：