asPath in getInitialProps ignores query params in dev mode

What version of Next.js are you using?

10.0.5

What version of Node.js are you using?

12.18.3

What browser are you using?

Chrome

What operating system are you using?

macOS

How are you deploying your application?

npm run dev

Describe the Bug

When using dev mode, the value of asPath in getInitialProps is correct only when rendered by the server. When rendered by the browser, only the path is included, and the query portion is ignored.

In prod (npm start), everything works as expected. This leads me to believe that there is some kind of race condition that surfaces only when the app is slowed down due to being in dev mode.

Expected Behavior

The value of asPath should consistently include the query portion both on the server and in the browser, even in dev mode.

To Reproduce

/pages/test1.js:

import { useRouter } from "next/router";

const Test1 = ({ asPath }) => {
  const router = useRouter();
  return (
    <div onClick={() => router.push("/test2", "/test2?foo=bar")}>
      go to /test2?foo=bar
      <br />
      <br />
      asPath = {asPath}
    </div>
  );
};

Test1.getInitialProps = ({ asPath }) => {
  return { asPath };
};

export default Test1;

/pages/test2.js:

import Link from "next/link";

const Test2 = ({ asPath }) => {
  return (
    <Link href="/test1" as="/test1?foo=bar">
      <div>
        go to /test1?foo=bar
        <br />
        <br />
        asPath = {asPath}
      </div>
    </Link>
  );
};

Test2.getInitialProps = ({ asPath }) => {
  return { asPath };
};

export default Test2;

Upon initial SSR render, navigating to /test1?foo=bar will correctly display the entire asPath. But after clicking “go to /test2?foo=bar,” only /test2 is displayed, even though the actual path includes a query string.

Note that this happens both when using the Link component, as well as with router.push.

[ijjk]

Hi, this has been updated in the latest version of Next.js v10.0.6-canary.7, please upgrade and give it a try!

[kaykdm]

I can reproduce this issue. I think it was working fine before this

I think the reason that this issue happens in only dev is https://github.com/vercel/next.js/blob/699a7aeaaa48a6c3611ede7a35af2d9676421de0/packages/next/build/webpack-config.ts#L216 Since a rewirte flag is on in dev, it goes through here where a query is not applied to the path https://github.com/vercel/next.js/blob/699a7aeaaa48a6c3611ede7a35af2d9676421de0/packages/next/next-server/lib/router/router.ts#L934

I am not sure why a rewrite flag is always true in dev.