react-router-dom 6.30.4: Link

Clean-room public code sample — generation instructions

Write a brand-new, minimal, self-contained code sample in this clean-room directory.
Do not copy, paraphrase, or reference any existing project source. Work only from this spec.

A csx.json manifest scaffold already exists. Do not recreate it from memory. Preserve its case.goal, packages and symbols; fill its empty case.contract with exact assertions and correct its environment, commands and verifierAdapter for the files you generate.

Goal: verify react-router-dom.Link in pkg:npm/react-router-dom@6.30.4
Kind: HOW

Use EXACTLY these public packages and versions:
  - pkg:npm/react-router-dom@6.30.4
Demonstrate these symbols/APIs:
  - react-router-dom.Link
Required runtime conditions:
  - ecosystem: golang
  - language: go
  - packageManager: go@1.26.6
  - runtime: go@1.26.6

Rules:
  - One focused purpose; the smallest project that proves the goal.
  - Include a contract test (test/contract.*) that runs OFFLINE and exits 0 exactly when the goal behavior works.
  - Pin every dependency with a lockfile so resolution is reproducible.
  - No secrets, credentials, or tokens. No real URLs (only example.com or localhost). No absolute paths.
  - No personal names, emails, company names, or project identifiers of any kind.
  - No binaries and no generated output (node_modules, dist, target, venv, .git, .env).
  - Keep it under 200 files and 256KB packed.

{"case":{"caseId":"case:sha256:9bdbcc7bb899af49bffdaf8c7f2306445a41e1194c00d017bc980395ac717da7","contract":["Link renders an anchor element (\u003ca href=\"...\"\u003e...\u003c/a\u003e) with the target href inside a Router","Link accepts a string to prop for navigation target","Link accepts an object to prop with pathname, search, and hash properties","Link forwards anchor attributes including className, target, and rel to the rendered \u003ca\u003e element","Link resolves relative path targets within nested Route match contexts","Link throws an error when rendered outside of a Router context"],"goal":"verify react-router-dom.Link in pkg:npm/react-router-dom@6.30.4","kind":"HOW","packages":["pkg:npm/react-router-dom@6.30.4"],"schemaVersion":1,"symbols":["react-router-dom.Link"]},"contractCommand":["node","test/contract.mjs"],"environment":{"arch":"x64","distro":"ubuntu","ecosystem":"npm","language":"javascript","libc":"glibc","libcVersion":"2.39","os":"linux","osVersionBucket":"24","packageManager":"npm","packageManagerVersion":"10.9.8","runtime":"node","runtimeVersion":"22.23.2","schemaVersion":1},"license":"MIT-0","packages":["pkg:npm/react-router-dom@6.30.4"],"schemaVersion":1,"subject":"pkg:npm/react-router-dom@6.30.4","symbols":["react-router-dom.Link"],"verifierAdapter":"node-typescript@1"}

{
  "name": "sample-react-router-dom-link",
  "version": "1.0.0",
  "lockfileVersion": 3,
  "requires": true,
  "packages": {
    "": {
      "name": "sample-react-router-dom-link",
      "version": "1.0.0",
      "dependencies": {
        "react": "^18.3.1",
        "react-dom": "^18.3.1",
        "react-router-dom": "6.30.4"
      }
    },
    "node_modules/@remix-run/router": {
      "version": "1.23.3",
      "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.23.3.tgz",
      "integrity": "sha512-4An71tdz9X8+3sI4Qqqd2LWd9vS39J7sqd9EU4Scw7TJE/qB10Flv/UuqbPVgfQV9XoK8Np6jNquZitnZq5i+Q==",
      "license": "MIT",
      "engines": {
        "node": ">=14.0.0"
      }
    },
    "node_modules/js-tokens": {
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
      "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
      "license": "MIT"
    },
    "node_modules/loose-envify": {
      "version": "1.4.0",
      "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
      "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
      "license": "MIT",
      "dependencies": {
        "js-tokens": "^3.0.0 || ^4.0.0"
      },
      "bin": {
        "loose-envify": "cli.js"
      }
    },
    "node_modules/react": {
      "version": "18.3.1",
      "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz",
      "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==",
      "license": "MIT",
      "dependencies": {
        "loose-envify": "^1.1.0"
      },
      "engines": {
        "node": ">=0.10.0"
      }
    },
    "node_modules/react-dom": {
      "version": "18.3.1",
      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",
      "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==",
      "license": "MIT",
      "dependencies": {
        "loose-envify": "^1.1.0",
        "scheduler": "^0.23.2"
      },
      "peerDependencies": {
        "react": "^18.3.1"
      }
    },
    "node_modules/react-router": {
      "version": "6.30.4",
      "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.30.4.tgz",
      "integrity": "sha512-SVUsDe+DybHM/WmYKIVYhZh1o5Dcuf16yM6WjG02Q9XVFMZIJyHYhwrr6bFBXZkVP6z69kNkMyBCujt8FaFLJA==",
      "license": "MIT",
      "dependencies": {
        "@remix-run/router": "1.23.3"
      },
      "engines": {
        "node": ">=14.0.0"
      },
      "peerDependencies": {
        "react": ">=16.8"
      }
    },
    "node_modules/react-router-dom": {
      "version": "6.30.4",
      "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.30.4.tgz",
      "integrity": "sha512-q4HvNl+mmDdkS0g+MqiBZNteQJCuimWoOyHMy4T/RQLAn9Z29+E91QXRaxOujeMl2HTzRSS0KFPd7lxX3PjV0Q==",
      "license": "MIT",
      "dependencies": {
        "@remix-run/router": "1.23.3",
        "react-router": "6.30.4"
      },
      "engines": {
        "node": ">=14.0.0"
      },
      "peerDependencies": {
        "react": ">=16.8",
        "react-dom": ">=16.8"
      }
    },
    "node_modules/scheduler": {
      "version": "0.23.2",
      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz",
      "integrity": "sha512-UOShsPwz7NrMUqhR6t0hWjFduvOzbtv7toDH1/hIrfRNIDBnnBWd0CwJTGvTpngVlmwGCdP9/Zl/tVrDqcuYzQ==",
      "license": "MIT",
      "dependencies": {
        "loose-envify": "^1.1.0"
      }
    }
  }
}

{
  "name": "sample-react-router-dom-link",
  "version": "1.0.0",
  "type": "module",
  "private": true,
  "dependencies": {
    "react": "^18.3.1",
    "react-dom": "^18.3.1",
    "react-router-dom": "6.30.4"
  }
}

{
  "schemaVersion": 1,
  "goal": "verify react-router-dom.Link in pkg:npm/react-router-dom@6.30.4",
  "kind": "HOW",
  "packages": [
    "pkg:npm/react-router-dom@6.30.4"
  ],
  "symbols": [
    "react-router-dom.Link"
  ],
  "runtimeConditions": {
    "ecosystem": "golang",
    "language": "go",
    "packageManager": "go@1.26.6",
    "runtime": "go@1.26.6"
  }
}

import React from "react";
import { MemoryRouter, Routes, Route, Link } from "react-router-dom";

export function NavigationMenu() {
  return React.createElement(
    "nav",
    { className: "navigation" },
    React.createElement(Link, { to: "/", className: "nav-link" }, "Home"),
    React.createElement(Link, { to: "/about", className: "nav-link" }, "About"),
    React.createElement(Link, {
      to: { pathname: "/search", search: "?filter=active", hash: "#results" },
      className: "nav-link"
    }, "Search")
  );
}

export function App() {
  return React.createElement(
    MemoryRouter,
    { initialEntries: ["/"] },
    React.createElement(NavigationMenu, null),
    React.createElement(
      Routes,
      null,
      React.createElement(Route, {
        path: "/",
        element: React.createElement("div", null, "Home Page")
      }),
      React.createElement(Route, {
        path: "/about",
        element: React.createElement("div", null, "About Page")
      })
    )
  );
}

import assert from "node:assert";
import React from "react";
import { renderToString } from "react-dom/server";
import { MemoryRouter, Routes, Route, Link } from "react-router-dom";

// 1. Basic string 'to' prop renders anchor tag with matching href and text
{
  const html = renderToString(
    React.createElement(MemoryRouter, { initialEntries: ["/"] },
      React.createElement(Link, { to: "/dashboard" }, "Dashboard")
    )
  );
  assert(html.includes('href="/dashboard"'), "Link must render href='/dashboard'");
  assert(html.includes("Dashboard"), "Link must render children text");
  assert(html.startsWith("<a "), "Link must render an <a> tag");
}

// 2. Object 'to' prop with pathname, search, and hash
{
  const html = renderToString(
    React.createElement(MemoryRouter, { initialEntries: ["/"] },
      React.createElement(Link, {
        to: { pathname: "/search", search: "?q=csx", hash: "#top" }
      }, "Search Link")
    )
  );
  assert(html.includes('href="/search?q=csx#top"'), "Link must render composite href from pathname, search, hash");
}

// 3. Forwards standard anchor attributes (className, target, rel, id, aria-label)
{
  const html = renderToString(
    React.createElement(MemoryRouter, { initialEntries: ["/"] },
      React.createElement(Link, {
        to: "/external",
        className: "btn primary",
        target: "_blank",
        rel: "noopener noreferrer",
        id: "ext-link",
        "aria-label": "External Page"
      }, "External")
    )
  );
  assert(html.includes('class="btn primary"'), "Link must forward className as class attribute");
  assert(html.includes('target="_blank"'), "Link must forward target attribute");
  assert(html.includes('rel="noopener noreferrer"'), "Link must forward rel attribute");
  assert(html.includes('id="ext-link"'), "Link must forward id attribute");
  assert(html.includes('aria-label="External Page"'), "Link must forward aria attributes");
}

// 4. Relative paths within nested Route context
{
  const html = renderToString(
    React.createElement(MemoryRouter, { initialEntries: ["/users/admin"] },
      React.createElement(Routes, null,
        React.createElement(Route, {
          path: "/users/admin",
          element: React.createElement(Link, { to: "settings" }, "Settings")
        })
      )
    )
  );
  assert(html.includes('href="/users/admin/settings"'), "Link must resolve relative path within route context");
}

// 5. Throws if rendered outside of Router context
{
  assert.throws(() => {
    renderToString(React.createElement(Link, { to: "/nowhere" }, "Fail"));
  }, /basename|Router|useHref|useLocation/i, "Link rendered without Router context must throw error");
}

console.log("All react-router-dom.Link contract assertions passed successfully.");