[Test] onUrlUpdate callback not being called in React test environment #1016
Answered
by
franky47
uniqueeest
asked this question in
Q&A
-
DescriptionI'm trying to test a component that uses Reproductionit('should increment the count when clicked', async () => {
const user = userEvent.setup();
const onUrlUpdate = vi.fn<OnUrlUpdateFunction>();
const CounterButton = () => {
const [searchParam, setSearchParam] = useQueryStates({
count: parseAsInteger.withDefault(42),
});
return (
<button onClick={() => setSearchParam({ count: searchParam.count + 1 })}>
count is {searchParam.count}
</button>
);
};
render(<CounterButton />, {
wrapper: withNuqsTestingAdapter({
searchParams: '?count=42',
onUrlUpdate
})
});
const button = screen.getByRole('button');
await user.click(button);
expect(button).toHaveTextContent('count is 43');
expect(onUrlUpdate).toHaveBeenCalledOnce(); // This fails
}); Expected BehaviorThe Actual BehaviorThe |
Beta Was this translation helpful? Give feedback.
Answered by
franky47
Jun 17, 2025
Replies: 1 comment 4 replies
-
The URL update is deferred, so you need to await all pending promises. You can do so with |
Beta Was this translation helpful? Give feedback.
4 replies
Answer selected by
uniqueeest
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
The URL update is deferred, so you need to await all pending promises. You can do so with
act
:https://github.com/47ng/nuqs/blob/next/packages/nuqs/src/useQueryState.test.ts#L58-L63