主页 / coding / 问题 / 78523876
Accepted
PaulBunion
Asked: 2024-05-23 22:36:25 +0800 CST

茉莉测试锚点元素点击而不打开标签页

  • 772
在我的Angular 17应用程序中，我有一些锚点元素，它们既有用于导航的href属性，也有点击事件处理器。我不担心测试href，但我正在尝试编写一个简单的“应该调用函数”的测试用例，用于点击事件处理器。 简单来说，代码如下： ```html 点击我! :) ``` 以及相关的测试代码： ```javascript it('should call click handler when link is clicked', fakeAsync(() => { const onClickSpy = spyOn(component, 'handleClick'); fixture.detectChanges(); const link = fixture.debugElement.query(By.css('#anchor-to-test')); link.click(); tick(); expect(onClickSpy).toHaveBeenCalled(); })); ``` 当我运行测试时，karma/jasmine窗口最终会每5秒左右重复打开新的标签页，消耗我的系统资源，并阻止任何测试实际运行（或至少完成）。 我已经尝试了这些讨论中的建议[这里](https://stackoverflow.com/questions/71087515/how-to-prevent-window-openurl-blank-to-actually-open-during-jasmine-unit-t)和[这里](https://stackoverflow.com/questions/54886794/unit-test-for-click-event-native-element-anchor-tag)，但都没有成功，我的搜索技巧也失效了。
html

1 个回答

  1. Best Answer

    尝试移除 href 属性，然后执行点击操作！

    it('应该在链接被点击时调用点击处理器', fakeAsync(() => {
  const onClickSpy = spyOn(component, 'handleClick');
  fixture.detectChanges();

  const link = fixture.debugElement.query(By.css('#anchor-to-test'));
  link.removeAttribute('href'); // <- 在这里修改！
  fixture.detectChanges(); // <- 如果不需要这行，可以移除它！
  link.click();
  fixture.detectChanges(); // <- 如果不需要这行，可以移除它！
  tick();

  expect(onClickSpy).toHaveBeenCalled();
}));
    • 1

相关问题