renderHook (and rerender) doesn't properly infer overload type when using initialProps.
rnarcos opened this issue · 4 comments
@react-testing-library/reactversion (if applicable): 12.1.2@react-testing-library/react-hooksversion: 7.0.2reactversion: 15.4.2react-domversion (if applicable): 15.4.2nodeversion:npm(oryarn) version:
Relevant code or config:
function useFoo(foo: string): string;
function useFoo(foo: number): number;
function useFoo(foo: string | number): string | number {
return foo;
}
test('should allow hook overloading on re-renders', () => {
renderHook(useFoo, { initialProps: 'string' })
});What you did:
I have a react hook, that relies on overloading to solve different use-cases. Essentially, this hook has an overload that determines the appropriate way to resolve a value based on its parameter typeof.
What happened:
When faced with an overloadable hook, @react-testing-library/react-hooks isn't appropriately typing either the initialProps for the renderHook method, or the rerender method itself.
Reproduction:
Problem description:
Hook overloading only works when you explicitly call the hook and return it's value on the renderHook method, while when using the renderHook with the initialValue option, it doesn't properly generate the types to match the overload.
Also, render result does not update its type definition based on the rerender output.
We faced this issue even on the latest version (8.0.1), any idea?
Salutations !
I think you doesn't use renderHook well.
You need to do this :
const { rerender } = renderHook((nextProps) => useMyHook(nextProps || initialProps))
rerender(myNextProps)This solution work for me 👍
I think renderHook is not well designed to easily understand it and can be a good thing if in the future it can work like that :
const { render } = renderHook(useMyHook);
render(initialProps);
render(myNextProps);Sorry I'm a bit late to the party here. I believe this is a known limitation of generic type inference of overloaded functions in Typescript.