开玩笑 - Mocking ES6 课程对我不起作用

Question

I'm following the documentation almost in detail (with some simple file and directory structure changes). Using the example offered by Jest to make 'manual mocks' in 'Es6 Class Mocks', I have the following files structure:

MyProjectExampleDirectory
│   sound-player-consumer.js
│
├───libs
│       sound-player.js
│
├───__mocks__
│       sound-player.js
│
└───__tests__
        sound-player-consumer.test.js

My script to test is as follows:

// sound-player-consumer.js
import SoundPlayer from './libs/sound-player';

export default class SoundPlayerConsumer {
  constructor() {
    this.soundPlayer = new SoundPlayer();
  }

  playSomethingCool() {
    const coolSoundFileName = 'song.mp3';
    this.soundPlayer.playSoundFile(coolSoundFileName);
  }
}

I am mocking the following way:

// __mocks__/sound-player.js
export const mockPlaySoundFile = jest.fn();

const mock = jest.fn().mockImplementation(() => {
  return { playSoundFile: mockPlaySoundFile };
});

export default mock;

and my test is the following:

// __tests__/sound-player-consumer.test.js
import SoundPlayer, { mockPlaySoundFile } from '../libs/sound-player';
import SoundPlayerConsumer from './../sound-player-consumer';

jest.mock('../libs/sound-player');

beforeEach(() => {
  // Clear all instances and calls to constructor and all methods:
  SoundPlayer.mockClear();
  mockPlaySoundFile.mockClear();
});

it('We can check if the consumer called the class constructor', () => {
  const soundPlayerConsumer = new SoundPlayerConsumer();
  expect(SoundPlayer).toHaveBeenCalledTimes(1);
});

I'm getting de following error:

What am I doing wrong?

Answer 1

I have managed to resolve the issue, however I am unable to get it to work in the __mocks__ directory:

const mockPlaySoundFile = jest.fn();
jest.mock('../libs/sound-player', () => {
  return jest.fn().mockImplementation(() => {
    return { playSoundFile: mockPlaySoundFile };
  });
});

The code above must be placed before any other code structure, after imports