mirror of
https://github.com/hanzoai/chat.git
synced 2026-09-30 20:51:17 +00:00
The rest of the Radix migration is gated on this. Before this commit, ANY test that rendered an 8.x primitive died before running a single assertion — so "swap the import, the build is green" would have been shipping blind on 56 Checkbox/Switch call sites. Four separate things were broken; each was found by running it, not by reading docs. 1. jest.config `transform` only claimed `.js/.jsx/.ts/.tsx`. @hanzo/gui's ESM entry is `dist/esm/index.mjs`, so NO transformer claimed it and the failure was `Cannot use import statement outside a module` — reported against the test's own import line, pointing nowhere near the cause. Now `\.[mc]?[jt]sx?$`. 2. `transformIgnorePatterns` was `['node_modules/?!@zattoo/use-double-click']` — a negative lookahead with the parentheses missing, so it read as the LITERAL text "!@zattoo/use-double-click" after an optional slash. Nothing matches that, so the list ignored nothing and everything in node_modules was already being transformed. That accident is load-bearing (the ESM-only Hanzo packages need transforming), so this keeps the behaviour and says so, rather than leaving a broken regex that looks deliberate. 3. `react-native-svg` resolved to `src/index.ts` via its `react-native` field — raw TypeScript in node_modules, then Flow-typed react-native source babel cannot parse. It is only in the graph because `@hanzogui/[email protected]` imports it from the file its own `browser` condition points at while declaring it in neither dependencies nor peerDependencies. test/ react-native-svg.stub.js renders plain SVG DOM instead; jsdom does SVG and no test here asserts on SVG internals. Delete it when that package is fixed. 4. @hanzo/gui refuses to render without `createGui`. setupTests.js now requires the SAME config App.jsx uses, so tests and production share one scale. A global GuiProvider wrapper on RTL's `render` was implemented, measured, and REJECTED: it regressed 8 previously-passing suites (SmartLoader, MemoryInfo, UIResourceCarousel, FileRow, SkillsCommand, FavoritesList, MCPUIResourceCarousel, SkillPills). Tempting, defensible in principle — production really does wrap everything — and wrong on the evidence. Tests wrap per file until those 8 are understood; the reason is written where someone would otherwise re-add it. src/__tests__/guiPrimitives.spec.tsx proves the harness works AND that the primitives behave: Checkbox and Switch both fire onCheckedChange on a real click. That is the first actual behavioural evidence on this branch that gui primitives work, not just compile. Verified per suite by name against main, same session: 0 passed->failed, 0 failed->passed, one net new passing suite. 117p/78f vs main's 116p/78f, 1766 vs 1764 passing tests — the delta is exactly the two new tests. Build green: 3m 22s. Co-authored-by: Hanzo Dev <[email protected]>
62 lines
2.2 KiB
JavaScript
62 lines
2.2 KiB
JavaScript
/**
|
|
* jsdom stand-in for `react-native-svg`.
|
|
*
|
|
* WHY THIS EXISTS — it is not a convenience, it routes around a packaging bug.
|
|
* `@hanzogui/[email protected]` imports `react-native-svg` from the very file
|
|
* its own `browser` export condition points at, while declaring it in neither
|
|
* `dependencies` nor `peerDependencies`. Every `@hanzo/ui` 8.x primitive that
|
|
* shows an icon (Checkbox's tick, Select's chevron, …) drags it in.
|
|
*
|
|
* In a browser bundle vite resolves that to the package's `.web.js` siblings and
|
|
* it works. Under jest it does not: `react-native-svg`'s `react-native` field
|
|
* points at `src/index.ts`, so jest walks into raw TypeScript inside
|
|
* node_modules and then into `react-native/Libraries/Utilities/
|
|
* codegenNativeComponent.js` — Flow-typed source babel-jest cannot parse. The
|
|
* failure surfaces as a SyntaxError blamed on the test's own import line.
|
|
*
|
|
* jsdom renders real SVG elements, and no unit test here asserts on SVG
|
|
* internals — they assert on labels, roles and handlers. So the honest fix for
|
|
* the TEST environment is to render plain SVG DOM and let the component under
|
|
* test be what is exercised. Delete this the day lucide-icons-2 stops importing
|
|
* a native-only module from its browser build.
|
|
*/
|
|
const React = require('react');
|
|
|
|
/** react-native-svg passes RN-flavoured props; SVG DOM wants the dashed names. */
|
|
const el =
|
|
(tag) =>
|
|
({ children, ...props }) =>
|
|
React.createElement(tag, props, children);
|
|
|
|
const Svg = ({ children, width, height, ...props }) =>
|
|
React.createElement('svg', { width, height, ...props }, children);
|
|
|
|
module.exports = {
|
|
__esModule: true,
|
|
default: Svg,
|
|
Svg,
|
|
Circle: el('circle'),
|
|
Ellipse: el('ellipse'),
|
|
G: el('g'),
|
|
Text: el('text'),
|
|
TSpan: el('tspan'),
|
|
TextPath: el('textPath'),
|
|
Path: el('path'),
|
|
Polygon: el('polygon'),
|
|
Polyline: el('polyline'),
|
|
Line: el('line'),
|
|
Rect: el('rect'),
|
|
Use: el('use'),
|
|
Image: el('image'),
|
|
Symbol: el('symbol'),
|
|
Defs: el('defs'),
|
|
LinearGradient: el('linearGradient'),
|
|
RadialGradient: el('radialGradient'),
|
|
Stop: el('stop'),
|
|
ClipPath: el('clipPath'),
|
|
Pattern: el('pattern'),
|
|
Mask: el('mask'),
|
|
Marker: el('marker'),
|
|
ForeignObject: el('foreignObject'),
|
|
};
|