hookrouter
hookrouter copied to clipboard
"location is not defined" Error after importing A
I don't understand why this would even bomb out, I'm simply trying to import the A
(link) component to my test.
I'm not even exercising this yet in code, why does it ask for location? If It needs it for tests, how do I provide that?
import { A } from 'hookrouter';
it('image links to their profile page', () => {
...
const image = isolateComponent(<GravatarImage user={user} />)
...
expect(profileLink.props.href).to.equal(routeToProfile);
});
Error:
node_modules/hookrouter/src/queryParams.js:55
queryParamObject = queryStringToObject(location.search.substr(1));
^
ReferenceError: location is not defined
at Object.<anonymous> (/node_modules/hookrouter/src/queryParams.js:55:41)
It's not even my test, I get this same exact problem when I import this into production code, what gives? The docs don't even talk about location.
Here's what I'm trying to do in the corresponding child component:
import { A } from 'hookrouter';
...
return (
<div>
<A href={`/company/${company.id}`} >
<img alt="company profile image" />
</A>
</div>
);
So when I click it, it should navigate to that route and render the Company Profile page.
Here's my App.tsx:
export const routes = {
'/company/:id': ({ id }) => <CompanyProfile companyId={id} />
};
const RenderRoute = () => {
const routeResult = useRoutes(routes);
return (
<>{routeResult}</>
);
};
const App = () => <RenderRoute />
export default App;
All your examples show the Root App component but no examples show child components. I don't see a need to have routeResult
in a child component when if they click a link, it should do a redirect completely out of the current rendered component they are currently in. So how do we get this error resolved and this redirect working here?
Can anyone help me with this error?
Is this repo dead? Seems like all new issues have gotten no response.
I think you have to mock the location object with something like:
global.window = Object.create(window);
const url = "http://dummy.com";
Object.defineProperty(window, 'location', {
value: {
href: url
}