title: Jest/React mock scrollBy and .getBoundingClientRect function
body: <p>I have a function handleClick which uses scrollBy on an element which gets its first argument using getBoundingClientRect. I am trying to test this using jest/enzyme. </p>
  
  <pre><code>class myClass extends Component  {
      ...
      ...
      handleClick () {
          document.getElementById('first-id').scrollBy(document.getElementById('second-id').getBoundingClientRect().width, 0);
      }
  
      render() {
          return (
              &lt;button className="my-button" onClick={this.handleClick()}&gt;scroll&lt;/button&gt;
          );
      }
  }
  </code></pre>
  
  <p>My test:</p>
  
  <pre><code>it('calls scrollBy with correct params', () =&gt; {
      const props = {};
      myClassWrapper = mount(&lt;myClass {...props} /&gt;);
      const scrollBySpy = jest.fn();
      global.document.getElementById = jest.fn(() =&gt; ({ scrollBy: scrollBySpy }));
  
      myClassWrapper.find('my-button').simulate('click');
      // expect(scrollBySpy).toHaveBeenCalledWith()
  });
  </code></pre>
  
  <p>I am trying to test that scrollBy is getting called with correct params, but I get the following error when running this test:</p>
  
  <pre><code>Error: Uncaught [TypeError: document.getElementById(...).getBoundingClientRect is not a function] 
  </code></pre>
  
  <p>Sorry if this has been answered before but I could not see anything which answers my scenario. Thank you in advance.</p>