Bug: App stuck in Suspense "state" re-rendering loop after migrating to React v18.2 about react

[kwalk2108]

It looks like found a solution for my issue so I'll close this ticket. Thanks for all your help and suggestions!

[hansottowirtz]

This is likely because the promise that Suspense is waiting for is not stable (it changes every render). Can you try moving renderRoutes(routes) out of the App component?

const routeComponents = renderRoutes(routes);

const App = () => {
  ...
                  <ScrollReset />
                  {routeComponents}
                </AuthProvider>
  ...
}

[NIKHILNAIR21]

you can try move renderRoutes(routes) out of the App component it may work?

[kwalk2108]

This is likely because the promise that Suspense is waiting for is not stable (it changes every render). Can you try moving renderRoutes(routes) out of the App component?

const routeComponents = renderRoutes(routes);

const App = () => {
  ...
                  <ScrollReset />
                  {routeComponents}
                </AuthProvider>
  ...
}

@hansottowirtz @NIKHILNAIR21 I moved renderRoutes as you suggested but I'm still experiencing the same bug. I'm wondering if upgrading React Router to v6 might make a difference with this issue.

[gaearon]

Please provide a runnable small repro without third-party dependencies.

[guruprasadhns]

Hi, Could you provide more information on how you fixed it?