How to use deepCyclicCopyObject method in Jest

After hours of debugging, found out that the instance didn't have any methods bound. Since it is a connected component, using shallowWithIntl() and dive() resolved the error.

it('should validate remit codes on save', () => {
    const wrapper = shallowWithIntl(<RemitOptionsView
      {...testProps}
    />);
    const button = wrapper.dive().find('Button[text="Save"]'); //Not finding the button
    const instance = wrapper.dive().instance();
    const spy = jest.spyOn(instance, 'validateOnSave');
    instance.validateOnSave();
  });

File that exports a constant value that I want to mock:

// utils/deviceTypeUtils file
import DeviceInfo from 'react-native-device-info';

export const isTablet = DeviceInfo.isTablet();

In my test file, I use this code to mock the constant isTablet:

// file: deviceTypeUtils.spec
const DeviceTypeUtilsMock = jest.requireMock('../utils/deviceTypeUtils');
jest.mock('../utils/deviceTypeUtils', () => ({
  isTablet: false,
}));

describe('mock const example', () => {
  it('mock const `isTablet` to the value `true`', () => {
    DeviceTypeUtilsMock.isTablet = true;
  });

  it('mock const `isTablet` to the value `false`', () => {
    DeviceTypeUtilsMock.isTablet = false;
  });
});

Using jest.spyOn() is the proper Jest way of mocking a single method and leaving the rest be. Actually there are two slightly different approaches to this.

1. Modify the method only in a single object

import Person from "./Person";

test('Modify only instance', () => {
    let person = new Person('Lorem', 'Ipsum');
    let spy = jest.spyOn(person, 'sayMyName').mockImplementation(() => 'Hello');

    expect(person.sayMyName()).toBe("Hello");
    expect(person.bla()).toBe("bla");

    // unnecessary in this case, putting it here just to illustrate how to "unmock" a method
    spy.mockRestore();
});

2. Modify the class itself, so that all the instances are affected

import Person from "./Person";

beforeAll(() => {
    jest.spyOn(Person.prototype, 'sayMyName').mockImplementation(() => 'Hello');
});

afterAll(() => {
    jest.restoreAllMocks();
});

test('Modify class', () => {
    let person = new Person('Lorem', 'Ipsum');
    expect(person.sayMyName()).toBe("Hello");
    expect(person.bla()).toBe("bla");
});

And for the sake of completeness, this is how you'd mock a static method:

jest.spyOn(Person, 'myStaticMethod').mockImplementation(() => 'blah');

This warning refers to the fact that an error is happening in the test that isn't being handled. The real problem is that your test isn't testing anything - there's an expect without a matcher. Here's what it should be:

return expect(theFunctionFail()).rejects.toEqual(new Error());

See the Jest docs for .rejects: https://jestjs.io/docs/en/tutorial-async#rejects

Note: It's also possible to use try/catch, but you have to either await like this:

it('theFunctionFail', async () => {
  expect.assertions(1);
  try {
    await theFunctionFail();
  } catch (err) {
    expect(err).toEqual(new Error());
  }
});

Or return the async function and catch the error (make sure you return the function):

it('theFunctionFail', () => {
  expect.assertions(1);
  return theFunctionFail().catch(err => {
    expect(err).toEqual(new Error());
  });
});

expect.assertions(number) is a good way to make sure all of your expects are being called when testing asynchronous behavior.

Also, if you add an error message, e.g. new Error('oh no!'), you will know for sure that you're catching the right error, and will make it a bit easier to debug.

For those who are committed to using nodemon, nodemon -x "npm test" has worked for me.

A little explanation

nodemon --help says:

-x, --exec app ........... execute script with "app", ie. -x "python -v".

In our case npm test is set to run tests by configuring our package.json

For example:

"scripts": {
  "test": "mocha"
},

The highlight of this answer is jest.requireActual(), this is a very useful utility that says to jest that "Hey keep every original functionalities intact and import them".

jest.mock('./utilities.js', () => ({
  ...jest.requireActual('./utilities.js'),
  speak: jest.fn(),
}));

Let's take another common scenario, you're using enzyme ShallowWrapper and it doesn't goes well with useContext() hook, so what're you gonna do? While i'm sure there are multiple ways, but this is the one I like:

import React from "react";

jest.mock("react", () => ({
  ...jest.requireActual("react"), // import and retain the original functionalities
  useContext: jest.fn().mockReturnValue({foo: 'bar'}) // overwrite useContext
}))

The perk of doing it this way is that you can still use import React, { useContext } from "react" in your original code without worrying about converting them into React.useContext() as you would if you're using jest.spyOn(React, 'useContext')

Actually, you don't need to use Sinon to test debounces. Jest can mock all timers in JavaScript code.

Check out following code (it's TypeScript, but you can easily translate it to JavaScript):

import * as _ from 'lodash';

// Tell Jest to mock all timeout functions
jest.useFakeTimers();

describe('debounce', () => {

    let func: jest.Mock;
    let debouncedFunc: Function;

    beforeEach(() => {
        func = jest.fn();
        debouncedFunc = _.debounce(func, 1000);
    });

    test('execute just once', () => {
        for (let i = 0; i < 100; i++) {
            debouncedFunc();
        }

        // Fast-forward time
        jest.runAllTimers();

        expect(func).toBeCalledTimes(1);
    });
});

More information: Timer Mocks

You shouldn't need any configuration to get the running time for your tests

PASS  src/containers/Dashboard/Dashboard.test.tsx (12.902s)

That 12.902s in the brackets is the total time from when the test command was run.

If you want to see the running time per test you can run jest with the --verbose flag and it will show you the time for each test as well as the whole suite.

  Dashboard Container
    ✓ render without crashing (1090ms)

Change

describe('handlers.getSemesters', async () => {

To

describe('handlers.getSemesters', () => {

And then put asynchronous code inside of it block

it('should return an array of Semesters', async () => {
  // ...
})