not-found.tsx shows a blank page when calling notFound() from a dynamic route with JavaScript disabled

[ericnishio]

Link to the code that reproduces this issue

https://github.com/ericnishio/not-found-js-disabled-dynamic-route

To Reproduce

1. Run the application in dev with npm run dev or run a production build with npm run build && npm start.
2. Disable JavaScript in your browser.
3. Navigate to http://localhost:3000/blog/foo

Current vs. Expected behavior

Current behavior: Displays a blank page.

Expected behavior: Renders the text "Not Found".

When notFound() is called from a dynamic route with JavaScript disabled, the not-found.tsx page turns out blank. If you have JavaScript enabled, it works correctly.

Verify canary release

• [X] I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 22.3.0: Mon Jan 30 20:38:37 PST 2023; root:xnu-8792.81.3~2/RELEASE_ARM64_T6000
Binaries:
  Node: 18.17.0
  npm: 9.6.7
  Yarn: 1.22.19
  pnpm: N/A
Relevant Packages:
  next: 14.0.1-canary.0
  eslint-config-next: N/A
  react: 18.2.0
  react-dom: 18.2.0
  typescript: 5.1.3
Next.js Config:
  output: N/A

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

App Router, Routing (next/router, next/navigation, next/link)

Additional context

No response

[ericnishio]

The problem is reproducible at https://nextjs.org/blog/foobar as well.

[Fredkiss3]

I've been noticing the same issue in my website : https://gh.fredkiss.dev/Fredkiss3/gh-next/issues/58248y

[apricot13]

We're also experiencing this issue with 14.2.8 - been trying to think of some workarounds, tried using a server action instead of NotFound(); but still leaves a blank page when js is disabled!

Only other workaround is using a <NotFound /> component

// src/app/[dynamicsegment]/(group)/page.tsx
if (response?.status?.code !== 200) {
    notFound();
  }