Description

If I create a guard function that redirects to the same matched route, but with different params, the guard gets stuck in an infinite redirect loop and gives up eventually with an unrelated error.

Steps to reproduce

To the intermediate sample in src/router/index.tsx I added this GuardFunction:

const invalidName = (to, from, next) => {
  const { name } = to.match.params;
  if (name === 'test') {
    next.redirect('/charmander');
  }
};

and modified the GuardedRoute:

<GuardedRoute
            path="/:name"
            exact
            component={Detail}
            guards={[invalidName, waitOneSecond, detailBeforeEnter]}
          />

Expected result

When given the route localhost:3001/test, I will get redirected to localhost:3001/charmander.

Actual result

When we get to the point of resolving the result to render react-router-dom components, matchPath returns true and the cycle continues.

I'm guessing this was done to avoid infinite redirect loops, but here it's causing one.

Environment

• OS: macOS Catalina
• Browser and its version: Chrome 87.0.4280.141
• React Router DOM version: 5.2.0