diff --git a/packages/react-refresh/src/__tests__/ReactFreshIntegration-test.js b/packages/react-refresh/src/__tests__/ReactFreshIntegration-test.js index 093d164e70..d851d72eb4 100644 --- a/packages/react-refresh/src/__tests__/ReactFreshIntegration-test.js +++ b/packages/react-refresh/src/__tests__/ReactFreshIntegration-test.js @@ -430,6 +430,131 @@ describe('ReactFreshIntegration', () => { await patch(code); }); + // @gate __DEV__ && enableActivity + it('ignores ref for functional component in hidden subtree', async () => { + const code = ` + import {unstable_Activity as Activity} from 'react'; + + // Avoid creating a new component on Fast Refresh. + global.A = global.A ?? function A() { + return
; + } + const A = global.A; + + function hiddenRef() { + throw new Error('Unexpected hiddenRef() invocation.'); + } + + export default function App() { + return ( + + + + ); + }; + `; + + await render(code); + await patch(code); + }); + + // @gate __DEV__ && enableActivity + it('ignores ref for ref forwarding component in hidden subtree', async () => { + const code = ` + import { + forwardRef, + unstable_Activity as Activity, + } from 'react'; + + // Avoid creating a new component on Fast Refresh. + global.A = global.A ?? forwardRef(function A(props, ref) { + return
; + }); + const A = global.A; + + function hiddenRef() { + throw new Error('Unexpected hiddenRef() invocation.'); + } + + export default function App() { + return ( + + + + ); + }; + `; + + await render(code); + await patch(code); + }); + + // @gate __DEV__ && enableActivity + it('ignores ref for simple memo component in hidden subtree', async () => { + const code = ` + import { + memo, + unstable_Activity as Activity, + } from 'react'; + + // Avoid creating a new component on Fast Refresh. + global.A = global.A ?? memo(function A() { + return
; + }); + const A = global.A; + + function hiddenRef() { + throw new Error('Unexpected hiddenRef() invocation.'); + } + + export default function App() { + return ( + + + + ); + }; + `; + + await render(code); + await patch(code); + }); + + // @gate __DEV__ && enableActivity + it('ignores ref for memo component in hidden subtree', async () => { + // A custom compare function means this won't use SimpleMemoComponent. + const code = ` + import { + memo, + unstable_Activity as Activity, + } from 'react'; + + // Avoid creating a new component on Fast Refresh. + global.A = global.A ?? memo( + function A() { + return
; + }, + () => false, + ); + const A = global.A; + + function hiddenRef() { + throw new Error('Unexpected hiddenRef() invocation.'); + } + + export default function App() { + return ( + + + + ); + }; + `; + + await render(code); + await patch(code); + }); + it('reloads HOCs if they return functions', async () => { if (__DEV__) { await render(`