[Bug] Routes: `redirect` does `pushState` instead of `replaceState`, breaking browser back buttons

[tonywu6]

What happens?

redirect routes now update window locations by doing a window.history.pushState instead of window.history.replaceState. This renders browsers' back buttons useless as trying to go to the previous page lands us in the location with redirect, bouncing us back to the most recent page.

Minimal Reproducible Example

https://github.com/tonywu6/umi-4-issue-redirect

How To Reproduce

1. Create a minimal umi app; in app config, in routes, provide the following

  routes: [
    { path: '/', component: 'index' },
    {
      path: '/lorem',
      routes: [
        {
          path: '',
          redirect: 'ipsum',
        },
        {
          path: 'ipsum',
          routes: [
            {
              path: '',
              redirect: 'dolor',
            },
            {
              path: 'dolor',
              component: 'main',
            },
          ],
        },
      ],
    },
  ],

2. Start the dev server, then navigate to /;
3. Navigate to /lorem;
4. Observe that the page is redirected to /lorem/ipsum/dolor;
5. Try returning to / using the back button;
6. Observe that it is impossible to return to /; observe that the address briefly changes to /lorem/ipsum, then changes back to /lorem/ipsum/dolor.

Screen.Recording.2022-07-25.at.8.33.41.PM.mov

Expected behavior

After landing on a page via redirects, I should still be able to visit whatever previous page was using the back button.

Current behavior

It is impossible to return to the previous page using the back button.

Context

• Umi Version: 4.0.8
• Node Version: v14.18.1
• Platform: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/103.0.0.0 Safari/537.36

Previously, with react-router@5, redirecting is done by the <Redirect> component. With that gone in react-router@6, redirecting is instead done by <Navigate>:

umi/packages/renderer-react/src/routes.tsx

Lines 55 to 57 in 591fa7c

	element: redirect ? (
	<NavigateWithParams to={redirect} />
	) : (

where <NavigateWithParams> is

umi/packages/renderer-react/src/routes.tsx

Lines 38 to 45 in 591fa7c

	function NavigateWithParams(props: { to: string }) {
	const params = useParams();
	const propsWithParams = {
	...props,
	to: generatePath(props.to, params),
	};
	return <Navigate {...propsWithParams} />;
	}

The replace prop is needed in <Navigate> for it to use replaceState.

[tonywu6]

See also #8651

EDIT: welp seems like this would be fixed by #8662

[sorrycc]

Fixed via #8662