CODEWITHSUNDEEP
angularunit-testingjasminekarma-jasmine
nitinsingh9x
nitinsingh9x

Reputation: 696

Need angular jasmine test case for scrollIntoView function call

This is the method I wanted to test but not able to understand how to mock scrollIntoView. Is there any documentation which can help me to understand jasmine testing. I am getting error saying ele.scrollIntoView is not a function.

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

Upvotes: 2

Views: 2210

Answers (1)

satanTime
satanTime

Reputation: 13539

as I understand el is a ViewChild, then you can mock its 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',
  });
});

Upvotes: 1

Related Questions