vercel / next.js

The React Framework
https://nextjs.org
MIT License
124.84k stars 26.65k forks source link

loading.tsx throws unique "key" prop warning when PPR is enabled #68634

Open jperezr21 opened 1 month ago

jperezr21 commented 1 month ago

Link to the code that reproduces this issue

https://codesandbox.io/p/devbox/flamboyant-darwin-njgn4r

To Reproduce

  1. npx create-next-app@latest
  2. npm i react@canary react-dom@canary next@canary babel-plugin-react-compiler
  3. Enable React Compiler and PPR in next.config.mjs
  4. Create loading.tsx file
  5. Start dev server & open in browser

Current vs. Expected behavior

Logs show Each child in a list should have a unique "key" prop. See https://react.dev/link/warning-keys for more information.

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 23.5.0: Wed May  1 20:13:18 PDT 2024; root:xnu-10063.121.3~5/RELEASE_ARM64_T6030
  Available memory (MB): 18432
  Available CPU cores: 11
Binaries:
  Node: 22.2.0
  npm: 10.7.0
  Yarn: 1.22.22
  pnpm: N/A
Relevant Packages:
  next: 15.0.0-canary.106 // Latest available version is detected (15.0.0-canary.106).
  eslint-config-next: 14.2.5
  react: 19.0.0-rc-e948a5ac-20240807
  react-dom: 19.0.0-rc-e948a5ac-20240807
  typescript: 5.5.4
Next.js Config:
  output: N/A

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

create-next-app, Partial Prerendering (PPR)

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

next dev (local)

Additional context

No response

rehatch-yoshimori-otsuka commented 1 month ago

similar https://github.com/vercel/next.js/discussions/68430

khuezy commented 2 weeks ago

Still happening on latest 15.0.0-canary.127

Edit by maintainer bot: Comment was automatically minimized because it was considered unhelpful. (If you think this was by mistake, let us know). Please only comment if it adds context to the issue. If you want to express that you have the same problem, use the upvote 👍 on the issue description or subscribe to the issue for updates. Thanks!

nayeem-klikit commented 2 weeks ago

Facing the exact same issue in latest nextjs canary release. Error vanished when marked the loading.tsx file to "use client", or set the ppr config to false in next.config.ts