react-router-config matchRoutes does not match properly when query parameter is present

Created on 28 Jul 2017  路  1Comment  路  Source: ReactTraining/react-router

react-router-config's matchRoutes does not return all matches if the url contains a slash followed by a query string.

Version

[email protected]
[email protected]

Test Case

Steps to reproduce

export const routes = [
  {
    component: App,
    routes: [
      {
        path: '/',
        exact: true,
        component: Home
      }
    ]
  }
];

const matches = matchRoutes(routes, '/?foo=bar');

Expected Behavior

matches should contain matches for both App and Home. This is the case when we remove the query parameter.

[
  {
    route: { component: [Object], routes: [Object] },
    match: { path: '/', url: '/', params: {}, isExact: true }
  },
  {
    route: { path: '/', exact: true, component: [Object] },
    match: { path: '/', url: '/', isExact: true, params: {} }
  }
];

Actual Behavior

matches only contains a record for App

[
  {
    route: { component: [Object], routes: [Object] },
    match: { path: '/', url: '/', params: {}, isExact: true }
  }
]

The same happens for /foo. For /foo, or /foo?bar=baz, the expect behavior occurs. However, for /foo/?bar=baz, the actual behavior occurs.

Additional information: for root URLs, chrome (59.0.3071.115) automatically puts / between the host name and query parameters. i.e. localhost:3000?foo=bar becomes localhost:3000/?foo=bar.

Any ideas?

>All comments

Our underlying matching library does not handle query strings. So, you should put in only the pathname to matchRoutes().

Was this page helpful?
0 / 5 - 0 ratings

Related issues

andrewpillar picture andrewpillar  路  3Comments

ArthurRougier picture ArthurRougier  路  3Comments

wzup picture wzup  路  3Comments

maier-stefan picture maier-stefan  路  3Comments

nicolashery picture nicolashery  路  3Comments