Current behavior

When mocking a custom hook, the component is not updated when calling wrapper.update().

Example:

component.jsx

import React from 'react';
import useCustomHook from './custom-hook';

export function MyComponent() {
  const hookResult = useCustomHook();

  return <span>{hookResult}</span>;
}

component.test.jsx

import { shallow } from 'enzyme';
import React from 'react';
import { MyComponent } from './component';
import useCustomHook from './custom-hook';

jest.mock('./custom-hook', () => jest.fn(() => 'bananas'));

it('should update the component', () => {
  expect(wrapper.children().text()).toBe('bananas');

  useCustomHook.mockReturnValueOnce('apples');

  wrapper.update();

  expect(wrapper.children().text()).toBe('apples');
})

Expected behavior

The above test passes.

I can get it to work when I replace the wrapper.update() with a wrapper.setProps({}) (which is kinda weird).
So why is the component not re-rendering? According to the docs, wrapper.update() is forcing a re-render. But I guess some optimization kicks in here and prevents the re-render.

Your environment

API

• shallow
• mount
• render

Version

Adapter

• enzyme-adapter-react-16
• enzyme-adapter-react-16.3
• enzyme-adapter-react-16.2
• enzyme-adapter-react-16.1
• enzyme-adapter-react-15
• enzyme-adapter-react-15.4
• enzyme-adapter-react-14
• enzyme-adapter-react-13
• enzyme-adapter-react-helper
• others ( )