diff --git a/packages/enzyme-test-suite/test/ReactWrapper-spec.jsx b/packages/enzyme-test-suite/test/ReactWrapper-spec.jsx index 8e5c7cab8..fdf924633 100644 --- a/packages/enzyme-test-suite/test/ReactWrapper-spec.jsx +++ b/packages/enzyme-test-suite/test/ReactWrapper-spec.jsx @@ -31,6 +31,7 @@ import { Suspense, useEffect, useLayoutEffect, + useMemo, useState, } from './_helpers/react-compat'; import { @@ -1034,6 +1035,42 @@ describeWithDOM('mount', () => { done(); }, 100); }); + + it('get same value when using `useMemo` and rerender with same prop in dependencies', () => { + function Child() { + return false; + } + function ComponentUsingMemoHook(props) { + const { count } = props; + const memoized = useMemo(() => ({ result: count * 2 }), [count]); + return ( + + ); + } + const wrapper = mount(); + const initialValue = wrapper.find(Child).prop('memoized'); + wrapper.setProps({ unRelatedProp: '123' }); + const nextValue = wrapper.find(Child).prop('memoized'); + expect(initialValue).to.equal(nextValue); + }); + + it('get different value when using `useMemo` and rerender with different prop in dependencies', () => { + function Child() { + return false; + } + function ComponentUsingMemoHook(props) { + const { count, relatedProp } = props; + const memoized = useMemo(() => ({ result: count * 2 }), [count, relatedProp]); + return ( + + ); + } + const wrapper = mount(); + const initialValue = wrapper.find(Child).prop('memoized'); + wrapper.setProps({ relatedProp: '123' }); + const nextValue = wrapper.find(Child).prop('memoized'); + expect(initialValue).to.not.equal(nextValue); + }); }); itIf(is('>= 16.2'), 'supports fragments', () => { diff --git a/packages/enzyme-test-suite/test/ShallowWrapper-spec.jsx b/packages/enzyme-test-suite/test/ShallowWrapper-spec.jsx index 79b7945a8..26e8ec803 100644 --- a/packages/enzyme-test-suite/test/ShallowWrapper-spec.jsx +++ b/packages/enzyme-test-suite/test/ShallowWrapper-spec.jsx @@ -27,6 +27,7 @@ import { PureComponent, Suspense, useEffect, + useMemo, useLayoutEffect, useState, Profiler, @@ -1210,6 +1211,42 @@ describe('shallow', () => { done(); }, 100); }); + + it('get same value when using `useMemo` and rerender with same prop in dependencies', () => { + function Child() { + return false; + } + function ComponentUsingMemoHook(props) { + const { count } = props; + const memoized = useMemo(() => ({ result: count * 2 }), [count]); + return ( + + ); + } + const wrapper = shallow(); + const initialValue = wrapper.find(Child).prop('memoized'); + wrapper.setProps({ unRelatedProp: '123' }); + const nextValue = wrapper.find(Child).prop('memoized'); + expect(initialValue).to.equal(nextValue); + }); + + it('get different value when using `useMemo` and rerender with different prop in dependencies', () => { + function Child() { + return false; + } + function ComponentUsingMemoHook(props) { + const { count, relatedProp } = props; + const memoized = useMemo(() => ({ result: count * 2 }), [count, relatedProp]); + return ( + + ); + } + const wrapper = shallow(); + const initialValue = wrapper.find(Child).prop('memoized'); + wrapper.setProps({ relatedProp: '123' }); + const nextValue = wrapper.find(Child).prop('memoized'); + expect(initialValue).to.not.equal(nextValue); + }); }); itIf(is('>= 16.2'), 'does not support fragments', () => {