📒

Mock 함수는 함수의 실제 구현을 지우고, 함수에 대한 호출(그리고 해당 호출에 전달된 매개변수)을 캡처하고, new연산자로 인스턴스화된 생성자 함수의 인스턴슬르 캡처하고, 반환값의 test-time configuration을 허용하여 코드 간 연결을 테스트할 수 있게 해준다.

모의 함수를 작성하는 방법은 두 가지가 있다.

✔️Using a mock function

forEach함수를 테스트 한다고 가정하자. 그리고 이 forEach함수는 각 요소마다 콜백함수를 호출한다.

export function forEach(items, callback) {
  for (let index = 0; index < items.length; index++) {
    callback(items[index]);
  }
}

이 함수를 테스트하기 위해 mock function을 사용한다. 그리고 mock 상태를 검사하여 콜백이 예상대로 호출되는지 확인할 수 있다.

const forEach = require('./forEach');

const mockCallback = jest.fn(x => 42 + x);

test('forEach mock function', () => {
  forEach([0, 1], mockCallback);

  // The mock function was called twice
  expect(mockCallback.mock.calls).toHaveLength(2);

  // The first argument of the first call to the function was 0
  expect(mockCallback.mock.calls[0][0]).toBe(0);

  // The first argument of the second call to the function was 1
  expect(mockCallback.mock.calls[1][0]).toBe(1);

  // The return value of the first call to the function was 42
  expect(mockCallback.mock.results[0].value).toBe(42);
});

다른 예제

function exampleFunction(callback) {
  // 여기에서 콜백이 예상대로 호출되는지 확인 필요
  callback();
}

import { exampleFunction } from './exampleFunction';

test('exampleFunction test', () => {
  const mockCallback = jest.fn(); // 모의 함수 생성

  exampleFunction(mockCallback); // 함수 호출

  // 콜백이 한 번 호출되었는지 검사
  expect(mockCallback).toHaveBeenCalledTimes(1);

  // 필요한 경우 다른 검사를 수행할 수 있음
  // 예: expect(mockCallback).toHaveBeenCalledWith(/* expectedParameters */);
});

✔️.mock property

모든 mock 함수는 .mock 프로퍼티를 가진다. .mock프로퍼티는 함수 호출 방식과 함수가 반환하는 값에 대한 정보가 저장되는 곳이다.

.mock프로퍼티는 각 호출에 대해 this값을 트래킹하기 때문에, 이 값을 검사할 수도 있다.

const myMock1 = jest.fn();
const a = new myMock1();
console.log(myMock1.mock.instances);
// > [ <a> ]

const myMock2 = jest.fn();
const b = {};
const bound = myMock2.bind(b);
bound();
console.log(myMock2.mock.contexts);
// > [ <b> ]

이러한 mock member들은 테스트에서 이러한 함수들이 어떻게 호출되고, 인스턴스화되며, 무엇을 반환하는지 확인하는데 매우 유용하다.

// The function was called exactly once
expect(someMockFunction.mock.calls).toHaveLength(1);

// The first arg of the first call to the function was 'first arg'
expect(someMockFunction.mock.calls[0][0]).toBe('first arg');

// The second arg of the first call to the function was 'second arg'
expect(someMockFunction.mock.calls[0][1]).toBe('second arg');

// The return value of the first call to the function was 'return value'
expect(someMockFunction.mock.results[0].value).toBe('return value');

// The function was called with a certain `this` context: the `element` object.
expect(someMockFunction.mock.contexts[0]).toBe(element);

// This function was instantiated exactly twice
expect(someMockFunction.mock.instances.length).toBe(2);

// The object returned by the first instantiation of this function
// had a `name` property whose value was set to 'test'
expect(someMockFunction.mock.instances[0].name).toBe('test');

// The first argument of the last call to the function was 'test'
expect(someMockFunction.mock.lastCall[0]).toBe('test');

✔️Mock Return Values

모의 함수들은 또한 테스트 중에 코드에 테스트 값을 주입하는 데 사용할 수도 있다.

const myMock = jest.fn();
console.log(myMock());
// > undefined

myMock.mockReturnValueOnce(10).mockReturnValueOnce('x').mockReturnValue(true);

console.log(myMock(), myMock(), myMock(), myMock());
// > 10, 'x', true, true

모의 함수는 연속 전달 스타일(continuation-passing style)로 작성된 코드에서도 매우 효과적이다.

이러한 스타일로 작성된 코드는 실제 구성 요소의 동작을 재현하는 복잡한 스텁을 사용할 필요 없게 해준다.

const filterTestFn = jest.fn();

// Make the mock return `true` for the first call,
// and `false` for the second call
filterTestFn.mockReturnValueOnce(true).mockReturnValueOnce(false);

const result = [11, 12].filter(num => filterTestFn(num));

console.log(result);
// > [11]
console.log(filterTestFn.mock.calls[0][0]); // 11
console.log(filterTestFn.mock.calls[1][0]); // 12

✔️Mocking Modules

API로부터 user 정보를 가져오는 클래스가 있다고 가정하자. 이 클래스는 API 호출을 위해 axios를 사용하고 모든 user들을 포함하고 있는 data attribute를 반환한다.

import axios from 'axios';

class Users {
  static all() {
    return axios.get('/users.json').then(resp => resp.data);
  }
}

export default Users;

이 메서드를 실제 API 호출 없이 테스트하기 위해서 axios 모듈을 자동으로 모킹 해주는 jest.mock(...) 함수를 쓸 수 있다.

모듈을 모킹한 후, .get을 위한 mockResolvedValue를 제공하여 테스트가 검증하려는 데이터를 반환하도록 설정할 수 있다.

즉, axios.get('/users.json')이 가짜 응답을 반환하도록 하는 것이다.

import axios from 'axios';
import Users from './users';

jest.mock('axios');

test('should fetch users', () => {
  const users = [{name: 'Bob'}];
  const resp = {data: users};
  axios.get.mockResolvedValue(resp);

  // or you could use the following depending on your use case:
  // axios.get.mockImplementation(() => Promise.resolve(resp))

  return Users.all().then(data => expect(data).toEqual(users));
});

✔️Mocking Partials

모듈의 일부는 모킹하고 나머지 부분은 실제 구현을 유지하도록 할 수 있다.

export const foo = 'foo';
export const bar = () => 'bar';
export default () => 'baz';

//test.js
import defaultExport, {bar, foo} from '../foo-bar-baz';

jest.mock('../foo-bar-baz', () => {
  const originalModule = jest.requireActual('../foo-bar-baz');

  //Mock the default export and named export 'foo'
  return {
    __esModule: true,
    ...originalModule,
    default: jest.fn(() => 'mocked baz'),
    foo: 'mocked foo',
  };
});

test('should do a partial mock', () => {
  const defaultExportResult = defaultExport();
  expect(defaultExportResult).toBe('mocked baz');
  expect(defaultExport).toHaveBeenCalled();

  expect(foo).toBe('mocked foo');
  expect(bar()).toBe('bar');
});

✔️Mocking implementations

반환 값 지정을 넘어서 모의 함수의 구현을 완전히 교체하는 것이 유용한 경우가 있다

이는 jest.fn 또는 mock function들에 있는 mockImplementationOnce 메서드를 사용하여 수행할 수 있다.

const myMockFn = jest.fn(cb => cb(null, true));

myMockFn((err, val) => console.log(val));
// > true

mockImplementation 메서드는 다른 모듈로부터 생성된 mock function의 기본 구현을 정의해야 할 때 유용합니다.

//foo.js
module.exports = function () {
  // some implementation;
};

//test.js
jest.mock('../foo'); // this happens automatically with automocking
const foo = require('../foo');

// foo is a mock function
foo.mockImplementation(() => 42);
foo();
// > 42

여러 함수 호출이 다른 결과를 생성하는 등 mock function의 복잡한 동작을 재현해야 할 때는 mockImplementationOnce 메서드를 사용하면 된다.

const myMockFn = jest
  .fn()
  .mockImplementationOnce(cb => cb(null, true))
  .mockImplementationOnce(cb => cb(null, false));

myMockFn((err, val) => console.log(val));
// > true

myMockFn((err, val) => console.log(val));
// > false

모의 함수가 mockImplementationOnce로 정의된 구현을 모두 소진하면, jest.fn으로 설정된 기본 구현을 실행한다(정의된 경우).

const myMockFn = jest
  .fn(() => 'default')
  .mockImplementationOnce(() => 'first call')
  .mockImplementationOnce(() => 'second call');

console.log(myMockFn(), myMockFn(), myMockFn(), myMockFn());
// > 'first call', 'second call', 'default', 'default'

보통 우리는 메서드 체이닝을 사용한다. 이는 항상 메서드의 반환값이 this이어야 하는 경우다.

모든 모의 객체에 적용되는 .mockReturnThis() 함수의 형태로 이를 단순화하는 API를 가지고 있습니다.

const myObj = {
  myMethod: jest.fn().mockReturnThis(),
};

// is the same as

const otherObj = {
  myMethod: jest.fn(function () {
    return this;
  }),
};

✔️Mock Names

선택적으로 모의 함수에 이름을 제공할 수 있으며, 이 이름은 테스트 오류 출력에서 'jest.fn()' 대신 표시된다.

테스트 결과에서 오류를 보고하는 모의 함수를 빠르게 식별하려면 .mockName()을 사용하자.

const myMockFn = jest
  .fn()
  .mockReturnValue('default')
  .mockImplementation(scalar => 42 + scalar)
  .mockName('add42');

✔️Custom Matchers

모의 함수가 어떻게 호출되었는지 확인하는 것을 덜 까다롭게 하기 위해, 사용자를 위한 몇 가지 맞춤형 매처 함수가 있다.

// The mock function was called at least once
expect(mockFunc).toHaveBeenCalled();

// The mock function was called at least once with the specified args
expect(mockFunc).toHaveBeenCalledWith(arg1, arg2);

// The last call to the mock function was called with the specified args
expect(mockFunc).toHaveBeenLastCalledWith(arg1, arg2);

// All calls and the name of the mock is written as a snapshot
expect(mockFunc).toMatchSnapshot();

이러한 matcher들은 .mock property를 검사하는 일반적인 방식에 대한 간단한 방법이다.

더 선호하는 방식이나 더 구체적인 작업이 필요한 경우에는 이 작업을 직접 수행하거나 수동으로 처리할 수 있습니다.

// The mock function was called at least once
expect(mockFunc.mock.calls.length).toBeGreaterThan(0);

// The mock function was called at least once with the specified args
expect(mockFunc.mock.calls).toContainEqual([arg1, arg2]);

// The last call to the mock function was called with the specified args
expect(mockFunc.mock.calls[mockFunc.mock.calls.length - 1]).toEqual([
  arg1,
  arg2,
]);

// The first arg of the last call to the mock function was `42`
// (note that there is no sugar helper for this specific of an assertion)
expect(mockFunc.mock.calls[mockFunc.mock.calls.length - 1][0]).toBe(42);

// A snapshot will check that a mock was invoked the same number of times,
// in the same order, with the same arguments. It will also assert on the name.
expect(mockFunc.mock.calls).toEqual([[arg1, arg2]]);
expect(mockFunc.getMockName()).toBe('a mock name');