Routes change in browser location, but content does not change (even though found render fires)
rosskevin opened this issue · 2 comments
We have just upgraded an application that has been running successfully for years with found
.
It is now using react: 18.2.0, found: 1.3.0
and we did switch our build to vite
. I have tried this with and without strict mode based on @jquense comment in #968, but there is no change. I reviewed #961 but the only similarity there is we are both using vite
. I reviewed the changelog but did not spot anything I am missing.
Symptoms:
- any page you go to directly and hit
return
in the location bar renders fine - click any link and I have verified in the debugger it sends the correct information to
found
to change - url in the browser location changes
- I see the found renderFn and graphql queries fire; but
- it stays on the same page
Attempts include strict
mode on/off, add/remove hotRouteConfig
, remove found-scroll
(seems to be falling behind), but no changes. Each page works, it will just not render after click of a link (only browser location bar change).
I've boiled down my router config to:
import {
BrowserRouterOptions,
createBrowserRouter,
createRender,
makeRouteConfig,
RenderArgs,
} from 'found'
import * as React from 'react'
export function createRouter(routes: React.ReactNode, options?: BrowserRouterOptions) {
const renderFn = createRender({})
const defaultConfig = {
historyOptions: { useBeforeUnload: true },
render: (renderArgs: RenderArgs) => renderFn(renderArgs),
routeConfig: makeRouteConfig(routes),
}
const config = { ...defaultConfig, ...(options || {}) }
return createBrowserRouter(config)
}
I'm still looking but appreciate any pointers.
I'm going to close this for the moment - I just found a top level route that works and it is leading me to believe we are likely to have a problem in our route config.
Just to close this loop, we did some optimization of an <AppContent/>
and <AppFrame/>
components at the top level with React.memo
and a custom comparator. The condition was inverted and therefore caused the content from the Component
on the new route pushed to not render because it signaled no need to do so.