Strip queries before matching route on client (#7566)

packages/next-server/lib/router/router.ts

@@ -275,8 +275,9 @@ export default class Router implements BaseRouter {
 
       // detect dynamic routing
       if (route.indexOf('/$') !== -1) {
+        const { pathname: asPathname } = parse(as)
         const rr = getRouteRegex(route)
-        const routeMatch = getRouteMatcher(rr)(as)
+        const routeMatch = getRouteMatcher(rr)(asPathname)
         if (!routeMatch) {
           console.error(
             "Your `<Link>`'s `as` value is incompatible with the `href` value. This is invalid."

test/integration/dynamic-routing/pages/index.js

@@ -22,6 +22,10 @@ const Page = () => (
     <Link href='/blog/$post/comment/$id' as='/blog/321/comment/123'>
       <a id='view-nested-dynamic-cmnt'>View comment 123 on blog post 321</a>
     </Link>
+    <br />
+    <Link href='/$post?fromHome=true' as='/post-1?fromHome=true'>
+      <a id='view-post-1-with-query'>View post 1 with query</a>
+    </Link>
   </div>
 )
 

test/integration/dynamic-routing/test/index.test.js

@@ -58,6 +58,14 @@ function runTests () {
     expect(html).toMatch(/blog post.*321.*comment.*123/i)
   })
 
+  it('should render dynamic route with query', async () => {
+    const browser = await webdriver(appPort, '/')
+    await browser.elementByCss('#view-post-1-with-query').click()
+    await waitFor(1000)
+    const url = await browser.eval('window.location.search')
+    expect(url).toBe('?fromHome=true')
+  })
+
   it('should navigate to a dynamic page successfully', async () => {
     let browser
     try {