Skip to content

SegmentViewNode produces "unique key" error when passing shared object reference #90099

@ceolinwill

Description

@ceolinwill

SegmentViewNode produces "unique key" error when passing shared object reference:

## Error Type
Console Error

## Error Message
Each child in a list should have a unique "key" prop.

Check the top-level render call using <SegmentViewNode>. It was passed a child from Page. See https://react.dev/link/warning-keys for more information.

Next.js version: 16.2.0-canary.48 (Turbopack)

Link to the code that reproduces this issue

https://github.com/ceolinwill/nextjs-cache-segmentview-key

To Reproduce

When the same object reference (containing a non-empty array property) is passed in multiple positions of the props to a client component from a "use cache" page, React produces a "unique key" error.

Minimal reproduction

app/page.tsx

"use cache";

import { Display } from "./client";

export default async function Page() {
  const item = { id: "1", name: "Apple", tags: ["fruit"] };
  return <Display item={item} items={[item]} />;
}

app/client.tsx

"use client";

type Item = { id: string; name: string; tags: string[] };

export function Display({ item, items }: { item: Item; items: Item[] }) {
  return (
    <p>
      {item.name}: {items.length} items
    </p>
  );
}

Steps

  1. Run npm run dev in the terminal
  2. Open the browser and navigate to http://localhost:3000

Current vs. Expected behavior

Current Behavior

React produces a "unique key" error at the SegmentViewNode boundary.

Expected Behavior

No React warning. The data is plain props, not a list of React elements. There is no list rendering at the page level.

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 25.3.0: Wed Jan 28 20:48:41 PST 2026; root:xnu-12377.81.4~5/RELEASE_ARM64_T6041
  Available memory (MB): 65536
  Available CPU cores: 16
Binaries:
  Node: 24.12.0
  npm: 11.6.2
  Yarn: N/A
  pnpm: 10.28.2
Relevant Packages:
  next: 16.2.0-canary.48 // Latest available version is detected (16.2.0-canary.48).
  eslint-config-next: N/A
  react: 19.2.4
  react-dom: 19.2.4
  typescript: 5.9.3

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

cacheComponents

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

next dev (local)

Additional context

Workaround

Deep-copy the shared objects before passing them through the "use cache" boundary:

return (
  <Display item={{ ...item, tags: [...item.tags] }} items={[{ ...item, tags: [...item.tags] }]} />
);

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions