需要 angular 个用于 scrollIntoView 函数调用的 jasmine 测试用例

Question

这是我想测试但无法理解如何模拟 scrollIntoView 的方法。是否有任何文档可以帮助我理解茉莉花测试。我收到错误消息说 ele.scrollIntoView 不是一个函数。

scrollIntoViewMethod(): void {
    const offsetTopDiv = '.highlight';
    const ele = this.el.nativeElement.querySelector(`${offsetTopDiv}`);
    ele.scrollIntoView({
      behavior: 'smooth',
      block: 'center',
      inline: 'nearest',
    });
  }

Answer 1

据我了解el是一个ViewChild，那么你可以模拟它的querySelector。

it('test', () => {
  // assuming that env is set and ready
  fixture.detectChanges();

  // adding spy
  const querySelectorSpy = spyOn(component.el.nativeElement, 'querySelector');

  // creating a stub
  const eleSpy = {
    scrollIntoView: jasmine.crateSpy('eleSpy.scrollIntoView'),
  };

  // setting the return value
  querySelectorSpy.and.returnValue(eleSpy);

  // action
  component.scrollIntoViewMethod();

  // assertion
  expect(querySelectorSpy).toHaveBeenCalledWith('.highlight');
  expect(eleSpy.scrollIntoView).toHaveBeenCalledWith({
    behavior: 'smooth',
    block: 'center',
    inline: 'nearest',
  });
});

需要 angular 个用于 scrollIntoView 函数调用的 jasmine 测试用例

Need angular jasmine test case for scrollIntoView function call

unit-testing

jasmine

karma-jasmine

angular