Jest mock window.scrollTo

For me, mock window.scrollTo in each test case. Or, put the mock code into a window.setup.js file and add the path of this file into jest setupFiles configuration, both of these two ways work fine.

For example,

index.spec.tsx:

import React, { Component } from 'react';

class SomeComponent extends Component {
  constructor(props) {
    super(props);
    this.handleClick = this.handleClick.bind(this);
  }

  handleClick(e) {
    e.preventDefault();
    window.scrollTo(0, 0);
  }

  render() {
    return (
      <div>
        <button onClick={this.handleClick}>Click Me!</button>
      </div>
    );
  }
}

export default SomeComponent;

index.spec.tsx, mock window.scrollTo in each test case.

import React from 'react';
import { shallow } from 'enzyme';
import SomeComponent from './';

describe('SomeComponent', () => {
  test('should handle click', () => {
    const wrapper = shallow(<SomeComponent></SomeComponent>);
    const mEvent = { preventDefault: jest.fn() };
    window.scrollTo = jest.fn();
    wrapper.find('button').simulate('click', mEvent);
    expect(mEvent.preventDefault).toBeCalled();
    expect(window.scrollTo).toBeCalledWith(0, 0);
  });
});

jest.config.js:

module.exports = {
  preset: 'ts-jest',
  testEnvironment: 'enzyme',
  // setupFiles: ['/Users/ldu020/workspace/github.com/mrdulin/jest-codelab/src/stackoverflow/58585527/window.setup.js'],
  setupFilesAfterEnv: ['jest-enzyme'],
  testEnvironmentOptions: {
    enzymeAdapter: 'react16'
  },
  coverageReporters: ['json', 'text', 'lcov', 'clover']
};

Unit test result:

 PASS  src/stackoverflow/58585527/index.spec.tsx (6.114s)
  SomeComponent
    ✓ should handle click (12ms)

Test Suites: 1 passed, 1 total
Tests:       1 passed, 1 total
Snapshots:   0 total
Time:        6.947s

Or, create a window.setup.js file and put the path of the file in jest setupFiles:

window.setup.js:

window.scrollTo = jest.fn();

jest.config.js:

module.exports = {
  preset: 'ts-jest',
  testEnvironment: 'enzyme',
  setupFiles: ['/Users/ldu020/workspace/github.com/mrdulin/jest-codelab/src/stackoverflow/58585527/window.setup.js'],
  setupFilesAfterEnv: ['jest-enzyme'],
  testEnvironmentOptions: {
    enzymeAdapter: 'react16'
  },
  coverageReporters: ['json', 'text', 'lcov', 'clover']
};

Unit test result:

 PASS  src/stackoverflow/58585527/index.spec.tsx
  SomeComponent
    ✓ should handle click (12ms)

Test Suites: 1 passed, 1 total
Tests:       1 passed, 1 total
Snapshots:   0 total
Time:        3.33s, estimated 7s

Both of them work fine.

Source code: https://github.com/mrdulin/jest-codelab/tree/master/src/stackoverflow/58585527

Setting window.scrollTo = jest.fn(); should be working and if you want to define it for the entire project instead of each test file separately you can define it in setupFilesAfterEnv

Or when using react-scripts you can define it in ./src/setupTests.js