angular 7中的单元测试jquery单击事件

我有一个angular应用程序，其中有一个

标签，看起来像这样

<a class="add-new-item" href="javascript:void(0);" >Add Item</a>

我编写了以下测试

  it("add new item link should add a new item", () => {
    const elementDe: DebugElement = fixture.debugElement;
    const addNewDe = elementDe.query(By.css(".add-new-item"));
    const newWrapperItem = elementDe.query(By.css(".item-wrapper"));

    expect(newWrapperItem.childNodes.length).toEqual(1);
    addNewDe.nativeElement.click();
    expect(newWrapperItem.childNodes.length).toEqual(2);
  });

但这不会调用上面提到的

jquery click事件

，导致

预期1等于2。

错误。现在我不知道该怎么做。

解决了这个问题

我必须在

karma.config.js

中包含javascript文件才能正常运行

---

这对我来说是一个很好的开始。

为什么你要用jQuery绑定而不是

ng click

，为什么你要用jQuery创建标记而不是让angular生成它？我使用的是一个用javascript和html编写的主题，我将主题转换成angular，改动最小。这就是为什么它在javascript中。只是吹毛求疵，但你的意思是在“jQuery”中。这都是javascript:）我的意思是“jQuery”。你的单元测试可以访问jQuery吗？我会尝试将其更改为

$（addNewDe.nativeElement）.trigger（'click'）

，以强制创建事件。如果没有，那么应该有一篇关于在vanilla javascript中生成和调度事件的帖子。

  it("add new item link should add a new item", () => {
    const elementDe: DebugElement = fixture.debugElement;
    const addNewDe = elementDe.query(By.css(".add-new-item"));
    const newWrapperItem = elementDe.query(By.css(".item-wrapper"));

    expect(newWrapperItem.childNodes.length).toEqual(1);
    addNewDe.nativeElement.click();
    expect(newWrapperItem.childNodes.length).toEqual(2);
  });