title: How to mock a directly-imported function using Jest?
body: <p>I'm trying to verify that my method is correctly invoking another, imported method.  For the life of me, I can't figure out how to mock the imported method using Jest.</p>
  
  <h2>Method I want to test</h2>
  
  <p><em>LandingPageManager.ts</em></p>
  
  <pre><code>import {getJSON} from './getJSON';
  
  public fetchData(url: string) {
      getJSON(url);
  }
  </code></pre>
  
  <h2>Method I want to mock</h2>
  
  <p><em>getJSON.ts</em></p>
  
  <pre><code>export function getJSON(url: string) {
      // XHR requests logic 
  }
  </code></pre>
  
  <h2>Test method</h2>
  
  <p><em>LandingPageManager.test.ts</em></p>
  
  <pre><code>import 'jest';
  import {getJSON} from '../../../src/web/getJSON';
  import {LandingPageManager} from '../../../src/web/LandingPageManager';
  
  describe('fetchData', () =&gt; {
    let manager = new LandingPageManager();
    it('passes the correct URL to getJSON', () =&gt; {
      const getJsonSpy = jest.mock('../../../src/web/getJSON', jest.fn());
  
      manager.fetchData('sampleValue');
      expect(getJsonSpy).toHaveBeenCalledWith('sampleValue');
  
      getJsonSpy.restoreAllMocks();
    });
  });
  </code></pre>
  
  <h2>Error I'm getting</h2>
  
  <pre><code> jest.fn() value must be a mock function or spy
  </code></pre>
  
  <p>I've tried setting up the mock a variety of different ways.  But I can't seem to get the syntax right.  </p>
  
  <p>Can anyone help point me in the right direction?  I feel like this should be possible.</p>