Skip to content

Commit

Permalink
Dont call memo comparison function on initial render
Browse files Browse the repository at this point in the history
  • Loading branch information
Brandon Dail committed Feb 11, 2019
1 parent 858294b commit dfb74db
Show file tree
Hide file tree
Showing 2 changed files with 14 additions and 2 deletions.
3 changes: 2 additions & 1 deletion packages/react-test-renderer/src/ReactShallowRenderer.js
Expand Up @@ -583,7 +583,8 @@ class ReactShallowRenderer {
let shouldRender = true;
if (
isMemo(element.type) &&
elementType === this._previousComponentIdentity
elementType === this._previousComponentIdentity &&
previousElement !== null
) {
// This is a Memo component that is being re-rendered.
const compare = element.type.compare || shallowEqual;
Expand Down
Expand Up @@ -1510,6 +1510,17 @@ describe('ReactShallowRenderer', () => {
expect(renderCount).toBe(2);
});

it('should not call the comparison function with React.memo on the initial render', () => {
const areEqual = jest.fn(() => false);
const SomeComponent = React.memo(({foo}) => {
return <div>{foo}</div>;
}, areEqual);
const shallowRenderer = createRenderer();
shallowRenderer.render(<SomeComponent foo={1} />);
expect(areEqual).not.toHaveBeenCalled();
expect(shallowRenderer.getRenderOutput()).toEqual(<div>1</div>);
});

it('should handle memo(forwardRef())', () => {
const testRef = React.createRef();
const SomeComponent = React.forwardRef((props, ref) => {
Expand Down Expand Up @@ -1548,7 +1559,7 @@ describe('ReactShallowRenderer', () => {
'Warning: forwardRef requires a render function but received ' +
'a `memo` component. Instead of forwardRef(memo(...)), use ' +
'memo(forwardRef(...))',
{withoutStack: true}
{withoutStack: true},
);
}).toThrowError(
'forwardRef requires a render function but was given object.',
Expand Down

0 comments on commit dfb74db

Please sign in to comment.