ci: add build/test pipeline and modernize the toolchain

[Eliav2]

Sets up CI for the first time. The repository had no workflows at all — .github/ contained only issue templates, so nothing has been built, linted or tested on push or PR since the project started.

Why this is more than a YAML file

The package could not be built from a clean checkout:

• typescript was not in devDependencies at all, so tsc only worked on machines that happened to have it globally.
• prepublishOnly ran pnpm run build, but there was no build script — only build:prod, build:dev and build:ts.
• start and clear:lib were Windows-only (del /q, for /d %x, backslash paths), so no contributor on macOS or Linux could run the repo as documented.
• The one existing test imported a component out of examples/ and had its only assertion commented out.

A workflow on top of that would have been red on the first run, so this PR fixes the underlying package before wiring the pipeline.

What is here

Toolchain

• pnpm lockfile (the scripts already shelled out to pnpm), pinned via packageManager
• ESLint 7 → ESLint 9 flat config with typescript-eslint 8
• Prettier added, using the settings already declared in package.json. The deprecated jsxBracketSameLine key was being silently ignored; corrected to bracketSameLine so the existing JSX style is preserved
• Jest 27 → Vitest, matching what the v3 branch already uses
• Real script set: build, clean, type-check, lint, format, test

Workflows

• ci.yml — format, lint, type-check, test, build across Node 22 and 24, then packs the tarball and asserts lib/index.js and lib/index.d.ts are present so a broken files field cannot reach npm unnoticed
• publish.yml — publishes on a version change in package.json, using npm Trusted Publishing (no NPM_TOKEN secret, provenance attached automatically), then cuts the matching GitHub release. No-op when the version is already on the registry, so it is safe to re-run
• dependabot.yml — monthly npm and github-actions updates, grouped

One source fix, because CI needs it

SVGGeometryElement.getTotalLength is not implemented by jsdom and is absent under SSR. Both call sites used optional chaining, which guards a null ref but not an element that exists without the method:

TypeError: lineRef.current?.getTotalLength is not a function

This is precisely why the project has no test suite — the component could not be mounted in one. Fixed with a small helper that falls back to 0. Closes #110.

Tests

Five smoke tests that actually mount the component, running against a bare jsdom with no SVG geometry polyfills, so the SSR-sensitive paths stay honest rather than being stubbed away.

Also included is a skipped regression test for the NaN geometry bug (#139, #171, #192), which reproduces reliably with curveness={0}:

d="M 16 16 C 16 16, NaN NaN, NaN NaN"
transform="translate(NaN,NaN) rotate(NaN) scale(24)"

It is skipped rather than deleted so the fix has a test already waiting for it.

Artifact diff against master

Master's src has moved on since 2.0.2 was published, so the npm tarball is the wrong baseline. Instead I built master HEAD with its own declared toolchain (TS 4.9 + @types/react 16) and diffed the emitted output against this branch, holding the compiler constant so source effects and toolchain effects could be told apart.

Typing — public surface unchanged. index.d.ts, Xarrow.d.ts, Xwrapper.d.ts, useXarrow.d.ts, constants.d.ts, anchors.d.ts, propTypes.d.ts, useXarrowProps.d.ts and privateTypes.d.ts are byte-identical. Three files change:

File	Change	Impact
types.d.ts	typeof cPaths[number] → (typeof cPaths)[number] ×4	Prettier adding explicit parens. Proven identical types by bidirectional assignability.
utils/GetPosition.d.ts	lineLength: any → lineLength: number	Strictly better. Not exported from the package entry.
utils/index.d.ts	adds getTotalLength	Additive. Not exported from the package entry.

Runtime — one intentional behaviour change. Comparing unminified tsc output (same compiler both sides) the entire delta is four items, three of which are provably equivalent:

Change	Equivalent?
animateDrawing hoisted out of the destructure	Yes — it was destructured then overwritten on the very next statement with no read in between
animDirection split out of a comma-declaration	Yes — same var, same value, never reassigned
path / startAnchorPosition split into their own statements	Yes — same plain object, same values, read immediately after
getTotalLength guard	No, and deliberately so. In a browser both forms are identical; they differ only where the method is absent, where the old code threw

Xwrapper.js is byte-identical.

One caveat, stated plainly: the shipped bundle is compiled by TypeScript 5.9 rather than 4.9, and TS changed its own __importStar helper in between (it now enumerates with Object.getOwnPropertyNames instead of for...in). That is TypeScript's runtime helper rather than this project's code, but it is genuinely different bytes in the published file.

Merging this PR publishes nothing. version stays at 2.0.2. publish.yml will run on merge because package.json changed, but the already-published check short-circuits it before any publish step.

Verification

Cloned the branch fresh and ran the full pipeline locally, and CI is green on the branch:

step	result
pnpm install --frozen-lockfile	pass
format:check	pass
lint	pass (0 errors, 22 warnings)
type-check	pass
test	5 passed, 1 skipped
build	pass

Notes

• The prefer-const sweep and Prettier pass touch src/. That is mechanical (auto-fix plus formatting) and is isolated in its own commits.
• Remaining 22 lint warnings are pre-existing any usage and unused vars, deliberately left as warnings rather than silently disabled.
• examples/ is untouched and still does not build (it has its own yarn.lock and a workspace: dependency with no workspace). Out of scope here; relates to Demo on codesandbox.io not working #172.
• Bumping @types/react 16 → 18 surfaced a genuine type error in Xwrapper, fixed by declaring children explicitly.
• Node 20 is not in the matrix: it reached end-of-life in April 2026 and jsdom 30 needs the undici that ships with Node 22+.
• No engines field was added. The published artifact is ES5 UMD with no runtime Node requirement, and the package never declared one, so adding it would newly constrain consumers.

Vulnerability cleanup

webpack-dev-server 3 was the only source of every remaining audit finding, and it was dead weight: referenced solely by webpack.exampleConfig.js, which has been commented out of webpack.config.js for years. The examples app builds with react-scripts and never used it.

Removing it along with html-webpack-plugin, style-loader and css-loader takes pnpm audit from 27 findings (12 high, 13 moderate, 2 low) to zero, for both --prod and dev. The library build only ever used babel-loader, ts-loader and file-loader, so the bundle is unaffected.

Follow-ups this unblocks

1. Merge the three ready PRs — Fix line SVG dotted animation in strict mode #174, Only import required lodash methods to reduce bundle size #175, Fixed undefined headRef when using animation without arrowheads #181 (12 lines, 3 issues)
2. Fix the NaN geometry bug and unskip the waiting test
3. Replace the UMD build with ESM + CJS, which is the real fix for the lodash bundle-size issue (Entirety of Lodash is Bundled (over 75% of package size) #118) since UMD cannot tree-shake

🤖 Generated with Claude Code

[codesandbox]

Review or Edit in CodeSandbox

Open the branch in Web Editor • VS Code • Insiders

Open Preview