Angular 为什么下一行没有被单元测试覆盖？

我正在为下面的函数运行jasmin Karma测试

ExampleFunction(someParam) {
    let element = document.querySelector(`aSelectorId}`);
    if (element ) {
      element.classList.remove('disabled');
      element.classList.add('enabled');
    }
  }

这是我运行的测试

 describe('ExampleFunction', () => {
    it('it should enable and disable', () => {
      spyOn(document, "querySelector").and.callFake(function() {
        return {
              value: true
          }
      });
      componentInstance.ExampleFunction("params");
      expect(componentInstance.Somevalue).toBe(something);
    });
  });

现在的问题是代码覆盖率显示

 element.classList.remove('disabled');

如图所示，但不是这条线

  element.classList.add('enabled');

---

你们能告诉我为什么会这样吗？

您在spy中指定的返回值没有classList属性。这将导致最后一行代码无法执行

尝试在spy中添加两个remove and add方法：

return {
  value: true
  classList: {
    remove: () => {},
    add: () => {}
  }         
}

或者，您也可以为remove和add提供mock，这样您就可以测试是否也使用正确的属性调用了这些方法

这可以从这些方面看：

    it('it should enable and disable', () => {
      const removeSpy = jasmine.createSpy();
      const addSpy = jasmine.createSpy();

      spyOn(document, "querySelector").and.callFake(function() {
        return {
              value: true,
              classList: {
                 add: addSpy,
                 remove: removeSpy
              }
          }
      });
      componentInstance.ExampleFunction("params");
      expect(componentInstance.Somevalue).toBe(something);
      expect(addSpy).toHaveBeenCalledWith('enabled');
      expect(removeSpy).toHaveBeenCalledWith('disabled')
    });

请注意，这是伪代码，我没有正确地测试它，但它应该按照这些思路工作

---

看一看

非常感谢，你能告诉我关于添加和删除的MOC吗？试试jasmine.createSpy。看看我最新的答案。这纯粹是伪代码，所以您可能需要做一些更改，但它应该向您展示一般的想法，我只是错过了：）嘿@Erbsenkoenig，我又面临一些问题，您能帮我吗？我可以看看。你能分享一个问题的链接吗？