Review follow-up on #1983. Copilot was right, and about a hazard this repo had already proven and then documented away: the claim that ink's ">=19" peer "keeps npm from hoisting it next to a React the Inspector couldn't also use" is false. A consumer pinning React 19.0 satisfies ">=19" while `^19.2.4` nests underneath, so ink renders through their React and the bundle through ours — the #1952 crash, one level up, breaking TUI startup rather than just its forms. Bundling ink closes it (verified: with a `createRequire` banner for the inlined CJS, since react-reconciler calls `require("react")` and signal-exit@3 `require("assert")`), but costs ~1.4MB — react-reconciler and yoga-layout come along. The root `react` range closes it for free instead: `^19.0.0` is open to the whole major, so npm can satisfy our React and a consumer's pinned React 19 with one copy, and an external ink resolves the same copy the bundle does. Verified against both consumer trees — the reporter's (React 18 + ink 5) and a pinned React 19.0.0 + ink 6.8.0, which splits under `^19.2.4`. That makes the range load-bearing while looking like an ordinary version bump, so the tests pin it: the root range must equal ink's own declared peer floor. They also assert each exempt package is both external and a root dependency — external means consumers install it, the mirror image of the inlined ones, which must not be root-declared. The docs in all four places now say ink is exempt on cost and never on a peer range, and name that claim as one we got wrong. Closes #1952 Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01WLYmVPVLdeYpE6aMTUsCks
131 lines
5.5 KiB
TypeScript
131 lines
5.5 KiB
TypeScript
import { defineConfig, type Options } from "tsup";
|
|
import { readFile } from "node:fs/promises";
|
|
import path from "node:path";
|
|
import { fileURLToPath } from "node:url";
|
|
|
|
const dirname = path.dirname(fileURLToPath(import.meta.url));
|
|
const repoRoot = path.resolve(dirname, "../..");
|
|
|
|
/**
|
|
* `ink-form` hardcodes a misspelled hint under an incomplete form — "you have
|
|
* not competed yet" — with no prop to override it. It is upstream's string
|
|
* (`ink-form/lib/SubmitButton.js`), last published in 2024, but it renders in
|
|
* the Inspector's tool/prompt/resource test forms, so we correct it on the way
|
|
* into the bundle. Reported upstream as lukasbach/ink-form#14; drop this patch
|
|
* if a release ever carries the fix.
|
|
*
|
|
* This is only possible because `ink-form` is inlined (see `noExternal` below).
|
|
*/
|
|
export const INK_FORM_INCOMPLETE_HINT = {
|
|
typo: "There are still required inputs you have not competed yet.",
|
|
fixed: "There are still required inputs you have not completed yet.",
|
|
};
|
|
|
|
/**
|
|
* Applies the correction above, throwing if the string is no longer there.
|
|
*
|
|
* Failing loudly is the point: a silent no-op would let an `ink-form` upgrade
|
|
* (or a fixed upstream, or a reworded label) quietly retire this patch with
|
|
* nobody noticing it had stopped applying — or, worse, leave a patch here for a
|
|
* string that no longer exists. If this throws, check whether upstream fixed
|
|
* the typo; if so, delete this patch rather than re-targeting it.
|
|
*/
|
|
export function fixInkFormIncompleteHint(source: string, file: string): string {
|
|
if (!source.includes(INK_FORM_INCOMPLETE_HINT.typo)) {
|
|
throw new Error(
|
|
`${file} no longer contains the ink-form label this build patches ` +
|
|
`(${JSON.stringify(INK_FORM_INCOMPLETE_HINT.typo)}). If upstream fixed ` +
|
|
`the typo, remove fixInkFormIncompleteHint from tsup.config.ts.`,
|
|
);
|
|
}
|
|
return source.replaceAll(
|
|
INK_FORM_INCOMPLETE_HINT.typo,
|
|
INK_FORM_INCOMPLETE_HINT.fixed,
|
|
);
|
|
}
|
|
|
|
/**
|
|
* Which module the patch above is applied to.
|
|
*
|
|
* Exported so the tests can check it against the *resolved* path of the real
|
|
* `ink-form` module — a filter that stops matching is the one way this patch
|
|
* can silently no-op, since `fixInkFormIncompleteHint` would then never run.
|
|
*/
|
|
export const INK_FORM_SUBMIT_BUTTON = /ink-form[\\/]lib[\\/]SubmitButton\.js$/;
|
|
|
|
// The plugin type is derived from tsup rather than imported from `esbuild`:
|
|
// `esbuild` is tsup's transitive dependency, not a declared one of this client,
|
|
// so a direct import typechecks only while npm happens to hoist it.
|
|
type EsbuildPlugin = NonNullable<Options["esbuildPlugins"]>[number];
|
|
|
|
export const inkFormLabelPatch: EsbuildPlugin = {
|
|
name: "ink-form-label-patch",
|
|
setup(build) {
|
|
build.onLoad(
|
|
{ filter: INK_FORM_SUBMIT_BUTTON },
|
|
async ({ path: file }) => ({
|
|
contents: fixInkFormIncompleteHint(await readFile(file, "utf8"), file),
|
|
loader: "js",
|
|
}),
|
|
);
|
|
},
|
|
};
|
|
|
|
export default defineConfig({
|
|
entry: ["index.ts"],
|
|
format: ["esm"],
|
|
outDir: "build",
|
|
clean: true,
|
|
// No source maps in the published bundle — they roughly double the on-disk
|
|
// size and aren't needed at runtime (debug via `npm run dev` on the source).
|
|
sourcemap: false,
|
|
target: "node22",
|
|
platform: "node",
|
|
// Every package here renders React components, so it MUST share the one React
|
|
// instance the bundle imports. Bundling is what guarantees that: an inlined
|
|
// package's `import "react"` is emitted into build/index.js, so it resolves
|
|
// from *this* directory exactly like the bundle's own, and no consumer install
|
|
// layout can point it elsewhere (#1952).
|
|
//
|
|
// Left external, npm is free to place a package beside a *different* React,
|
|
// because it places one beside a version satisfying that package's own peer
|
|
// range — looser than ours in every case here. `ink-form` and
|
|
// `ink-scroll-view` accept ">=18", so a consumer's React 18 satisfies them
|
|
// while the Inspector's React 19 nests underneath: two React copies, and the
|
|
// first hook they call reads a null dispatcher ("Cannot read properties of
|
|
// null (reading 'useState')") the moment a tool test form or a scroll view
|
|
// mounts. That is the reported crash, and inlining them is its fix.
|
|
//
|
|
// `__tests__/tsupConfig.test.ts` guards this list.
|
|
noExternal: [/^@inspector\/core/, "ink-form", "ink-scroll-view"],
|
|
external: [
|
|
// `react` is deliberately external — the single instance every inlined
|
|
// package above resolves to, from this build directory.
|
|
"react",
|
|
// `ink` is external by a deliberate trade-off, NOT because a ">=19" peer
|
|
// makes it safe — it does not, and that claim was wrong here once already.
|
|
// Bundling it works (verified) but costs ~1.4MB, since react-reconciler and
|
|
// yoga-layout come with it, plus a `createRequire` banner for the inlined
|
|
// CJS. The smaller tarball won.
|
|
//
|
|
// What makes that tolerable is the root manifest's `react: ^19.0.0`: being
|
|
// open to the whole major lets npm satisfy our React and a consumer's
|
|
// pinned one with a single copy, so an external `ink` resolves *ours*. Narrow
|
|
// that range and this exemption turns back into the #1952 crash, one level
|
|
// up — `__tests__/tsupConfig.test.ts` guards it.
|
|
"ink",
|
|
"open",
|
|
"commander",
|
|
"pino",
|
|
"@modelcontextprotocol/client",
|
|
"@modelcontextprotocol/core",
|
|
"@napi-rs/keyring",
|
|
],
|
|
esbuildPlugins: [inkFormLabelPatch],
|
|
esbuildOptions(options) {
|
|
options.alias = {
|
|
"@inspector/core": path.join(repoRoot, "core"),
|
|
};
|
|
options.jsx = "automatic";
|
|
},
|
|
});
|