wouter
wouter copied to clipboard
Memory location does not include a search hook
When using memory location for testing purposes, query params returned by useSearch
are ignored:
import { render, screen } from '@testing-library/react';
import { Router, useSearch, useLocation } from 'wouter';
import { memoryLocation } from 'wouter/memory-location';
function App() {
const [location] = useLocation();
const search = useSearch();
return (
<div data-testid="test">
search is {search}, location is {location}
</div>
);
}
test('Test router', () => {
const loc = memoryLocation({ path: '/foo?key=value' });
render(
<Router hook={loc.hook}>
<App />
</Router>,
);
// This fails -- we get 'search is , location is /foo?key=value' instead
expect(screen.getByTestId('test')).toEqual(
'search is ?key=value, location is /foo?key=value',
);
});
I assume this happens because no searchHook
is passed to Router
here, but memoryLocation
does not appear to have one.
As a temp workaround, I can swap useSearch()
with something like useLocation()[0].split('?')[1]
or specify my own search hook with the query param built in, but it'd be nice not to.