title: React: how to test if method is called when updating props?
body: <p>I'm trying to write a test which checks if a method is called when updating the props of the component.</p>
  
  <p>This is the component (removed unnecessary stuff):</p>
  
  <pre><code>import React from 'react';
  import styled from 'styled-components';
  
  const Video = styled.video`
    display: block;
    width: 100%;
  `;
  
  export default class VideoPlayer extends React.Component {
    componentWillReceiveProps(nextProps) {
      if (this.props.isPaused !== nextProps.isPaused) {
        this.togglePlayPause(nextProps.isPaused);
      }
    }
  
    togglePlayPause(isPaused) {
      if (isPaused) {
        this.video.pause();
      } else {
        this.video.play();
      }
    }
  
    render() {
      return (
        &lt;Video /&gt;
      );
    }
  }
  </code></pre>
  
  <p>This is the test I've written:</p>
  
  <pre><code>import React from 'react';
  import Enzyme, { mount } from 'enzyme';
  import renderer from 'react-test-renderer';
  import Adapter from 'enzyme-adapter-react-16';
  import 'jest-styled-components';
  import sinon from 'sinon';
  import VideoPlayer from './../src/app/components/VideoPlayer/VideoPlayer';
  
  Enzyme.configure({ adapter: new Adapter() });
  
  test('Checks if togglePlayPause gets called', () =&gt; {
    const spy = sinon.spy(VideoPlayer.prototype, 'togglePlayPause');
    const Component = mount(&lt;VideoPlayer videoURL="http://localhost:3001/vid/local-video.mp4" volume={100} isPaused={false} /&gt;);
  
    Component.setProps({ isPaused: true });
    expect(spy).toBeCalled();
  });
  </code></pre>
  
  <p>However, when I run this test I get the following error:</p>
  
  <pre><code>expect(jest.fn())[.not].toBeCalled()
  
  jest.fn() value must be a mock function or spy.
  Received:
    function: [Function proxy]
  
    21 |
    22 |   Component.setProps({ isPaused: true });
  &gt; 23 |   expect(spy).toBeCalled();
    24 | });
    25 |
  
    at Object.&lt;anonymous&gt; (__tests__/VideoPlayer.react-test.js:23:15)
  </code></pre>
  
  <p>How can I write a test which checks if a method is called when the props are updated? Been googling for hours now, can't find any articles/tutorials/help/issues on this.</p>
  
  <p>Don't hesitate to ask for additional information. Thanks!</p>