Something went wrong. Try again.
[READ-ONLY] Mirror of https://github.com/wojtekmaj/react-hooks. A collection of React Hooks.
hooks react react-hooks
Something went wrong. Try again.
react-hooks test-utils.tsx
1.3 kB · 61 lines
TSX
at main
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162import { act } from 'react';import { hydrateRoot } from 'react-dom/client';import { renderToString } from 'react-dom/server';
import type { ReactNode } from 'react';
// biome-ignore lint/suspicious/noExplicitAny: Too complex to typeexport const renderHookServer = <Hook extends () => any>( useHook: Hook, { wrapper: Wrapper, }: { wrapper?: ({ children }: { children: ReactNode }) => React.ReactElement; } = {},): { result: { current: ReturnType<Hook> | undefined }; hydrate: () => void;} => { // Store hook return values const results: ReturnType<Hook>[] = [];
const result = { get current() { return results.slice(-1)[0]; }, };
const setValue = (value: ReturnType<Hook>) => { results.push(value); };
const Component = ({ useHook }: { useHook: Hook }) => { setValue(useHook()); return null; };
const component = Wrapper ? ( <Wrapper> <Component useHook={useHook} /> </Wrapper> ) : ( <Component useHook={useHook} /> );
// Render hook on server const serverOutput = renderToString(component);
// Render hook on client const hydrate = () => { const root = document.createElement('div'); root.innerHTML = serverOutput; act(() => { hydrateRoot(root, component); }); };
return { result, hydrate: hydrate, };};