Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Inconsistent behavior of usePathname with static rendering during build #73085

Open
amannn opened this issue Nov 22, 2024 · 0 comments
Open

Inconsistent behavior of usePathname with static rendering during build #73085

amannn opened this issue Nov 22, 2024 · 0 comments
Labels
bug Issue was opened via the bug report template. Middleware Related to Next.js Middleware.

Comments

@amannn
Copy link
Contributor

amannn commented Nov 22, 2024

Link to the code that reproduces this issue

amannn/nextjs-bug-repro-usepathnamessg@c6b084d

To Reproduce

Compare the output of usePathname in development vs during the static prerender when accessing the route /test which uses a rewrite in the middleware.

Current vs. Expected behavior

usePathname seems to pick up a request-time pathname from a middleware rewrite. However, as this information is not available during a static build, usePathname will return a different value in this case. Then again, when running the app in production, usePathname will return the pathname that's displayed in the browser (i.e. after a rewrite), but only on the client side.

In the reproduction this leads to a text content mismatch, but more generally this breaks a dev/prod guarantee. I'd expect a static prerender to only be a performance optimization and not to change application logic.

I guess some unification would be necessary here.

Note that this only applies for static prerendering, if you use SSR in production then the behavior is the same as in dev.

A more real world use case where this behavior was encountered: amannn/next-intl#1568

Provide environment information

Operating System:
  Platform: darwin
  Arch: x64
  Version: Darwin Kernel Version 23.6.0: Mon Jul 29 21:13:00 PDT 2024; root:xnu-10063.141.2~1/RELEASE_X86_64
  Available memory (MB): 16384
  Available CPU cores: 12
Binaries:
  Node: 20.11.1
  npm: 10.2.4
  Yarn: 1.22.22
  pnpm: 9.14.2
Relevant Packages:
  next: 15.0.4-canary.23 // Latest available version is detected (15.0.4-canary.23).
  eslint-config-next: 15.0.4-canary.23
  react: 19.0.0-rc-380f5d67-20241113
  react-dom: 19.0.0-rc-380f5d67-20241113
  typescript: 5.6.3
Next.js Config:
  output: N/A

Which area(s) are affected? (Select all that apply)

Middleware

Which stage(s) are affected? (Select all that apply)

next dev (local), next build (local), next start (local)

Additional context

Maybe a hook like useInternalPathname() (naming TBD) could help that always reliably returns the pathname that renders in Next.js, regardless of any rewrites—essentially matching the directory structure in src/app.

@amannn amannn added the bug Issue was opened via the bug report template. label Nov 22, 2024
@github-actions github-actions bot added the Middleware Related to Next.js Middleware. label Nov 22, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Issue was opened via the bug report template. Middleware Related to Next.js Middleware.
Projects
None yet
Development

No branches or pull requests

1 participant