如何使用Karma-Jasmine模拟/存根$ JQuery调用？

Question

我使用jQuery在我们的页面上打开一个模式。在组件中，它说：

// @ts-ignore
$('#modal').modal('show');

ts-ignore是bc，我们没有将jQuery导入到组件中(不知道它应该如何工作，但它确实是这样做的)。

此代码片段位于组件的某个方法中。

当UnitTesting这个方法时，我显然想避免使用jQuery来选择Modal，因为没有可用的DOM。

所以我不得不嘲笑它。但是所有的尝试都失败了：

// @ts-ignore
spyOn($.fn, 'modal').and.callFake(() => true);

// @ts-ignore
spyOn($('#modal'), 'modal').and.callFake(() => true);

// @ts-ignore
spyOn($, 'modal').and.callFake(() => true);

都是错误的: modal()方法不存在。

这里我漏掉了什么？

Answer 1

我会在Angular https://stackoverflow.com/a/40355691/7365461中像这样使用和导入jQuery

在spec.ts文件中，尝试执行以下操作：

import * as $ from 'jquery';
....
spyOn(($.fn as any), 'modal').and.callFake(() => true);