Four Weeks in Detail

April 20–26
Week 1 — E2E Marathon (HYP-363)
Extension 0.1.9 → 0.1.28
  • → Docker sharded E2E runs #4–#23 — parallel execution of ~2 200 tests, pass rate climbed from 86% to ~93%
  • → PreviewProxy hardening — retry budget up to 60 attempts, 403 retry for Vite/webpack cold compile, socket-error retry
  • → Recompile gate — extension now awaits a second webpack compile after patching the entry file before reporting dev-server ready
  • → Next.js promoted to FULL_EDIT — full style-write enabled for Next.js projects
  • → Runtime workspace switching — switch project without restarting the preview panel
  • → Fiber-based map item index resolution — canvas interaction fix for repeated-instance hosts
  • → Error boundary + global error capture — webview catches runtime errors and shows overlay
April 27 – May 3
Week 2 — Stabilisation + New Adapters
Extension 0.1.28 → 0.1.41
  • → Runs #24–#42 — final Tamagui fixes (App.web.tsx detection, style-object format, disk-first polling), cross-file AST undo
  • → Tamagui / React Native style adapter — direct JSX prop write for RN-style syntax; full E2E validated
  • → SSR mock adapter for Remix — Remix route components render in preview without a server context
  • → Multi-root scan + self-heal — preview generator recovers missing components, scans client/, src/, app/
  • → Fill color from iframe — inspector reads fill color from computed style of the iframe element
  • → Bulka screenshot delivery — HYP-363 proof screenshots captured and delivered via Telegram
  • → E2E harness cleanup — removed fake tests (expect(true).toBe(true)), added spec guardrail checks
v0.1.29 v0.1.33–v0.1.37 v0.1.41 ✓
May 4–11
Week 3 — Feature Week (8 features, 3 releases)
v0.1.44 → v0.1.46
  • → i18n Text Inspector — inspect i18n bindings directly in HyperCanvas: see the key, namespace, locale; switch locale inline
  • → Selection Survives i18n Write (selsurv) — element selection no longer resets on i18n key write; grace-cache + Vite HMR hook
  • → Move-any-to-any drag pipeline — cross-component cross-file element move; walk-up for nested targets; grid-aware drop indicator
  • → Locale switcher — onLocaleChange wired end-to-end, E2E GREEN
  • → Shift+Enter parent fix — itemIndex threaded through onSelectElement; only 1 parent instance highlighted
  • → Drag & Drop — 5 fixes: ghost background for transparent elements, Escape cancels drag, overlay updates on every pointer move, grace cache seeded after drag write, flex-indicator orientation
  • → i18n Key Inspector — 4 bugs fixed: sequential key changes, stale previousKey, repeated same-key selection, HMR rebind
  • → Entry file watcher — extension watches App.tsx/router entry; auto-repatches @hyperide-managed route if git-discard removes it
  • → Canvas crash on discard fix — TypeError null-push when entry file removed via SCM
May 12–20
Week 4 — NodePod + Toolchain Upgrade
Architecture week
  • → NodePod client-side runtime (HYP-368) — new feature: Pod for running the project on the client side, OPFS file store, ServiceWorker, useDockerRuntime vs useNodePodRuntime abstraction, staging deploy
  • → TypeScript strict mode — strict: true enabled across the entire codebase, zero TS errors (7 tasks: server/routes → services → client/pages → AnnotationsLayer → middleware)
  • → OXC / tsgo toolchain migration — Biome replaced by OXC linter, tsgo added as parallel type checker, lefthook.yml and CI workflow updated
  • → Chat hooks extraction — 4 hooks split from the monolith: useAutoScroll, useMessagesAppend, useChatHistory, useHandleStop; 49 tests GREEN
  • → Tailwind parser regression fix — parseTailwindClasses extended: padding (p-N/px-N/py-N), named colors, rounded variants
  • → E2E CLASS C/D/E/F fixes — MCP test setup (C), logs-panel devserver stop (D), delete element regression (E), ET-17 tree scroll (F)
  • → Preview Capabilities V2 spec — detailed design: 6-dimension stack detection (bundler, TS, CSS, router, pkg-manager, runtime), new readonly screen

E2E Testing Infrastructure

Separate repository ext-test-projects — 313 commits over the month

Test Suite
  • → ~2 000 tests across 20+ projects
  • → PI-5 (Drag), PI-7 (i18n), ET (Elements Tree), PD (Panel/DevServer)
  • → MCP Tools tests (hyper_duplicate_element, hyper_get_styles, etc.)
  • → Docker shards: 3 → 6 for full matrix coverage
Project Matrix
bulka-the-dog nextjs-sample remix-cssmodules tamagui-whatsapp vite-react-tw4 webpack-react bun-tw-shadcn monorepo-sample chakra-airbnb antd-jira daisyui-instagram +7 more
E2E Failure Classes Fixed (May)
Class Problem Fix
CLASS C MCP tools test setup — wrong parameter names Rewrote openExplorerAndSelect, correct tree indexes
CLASS D Logs panel cascade — devserver stop timing Close preview panel before teardown + timing diagnostics
CLASS E Delete element regression (PD-5-6/7/8) Disk-read in Monaco, duplicate index 0→1, delete diagnostics
CLASS F ET-17 tree scroll — DFS leaf selection Last DFS leaf instead of first icon-like label; Feed component as scroll target

Extension Releases

37 versions of hypercanvas-preview shipped over 30 days

Version Date Key changes
0.1.9–0.1.17Apr 20–26Recompile gate, proxy retries, webview lifecycle, undo/redo fixes
0.1.18–0.1.28Apr 27–29Cross-file AST, SSR Remix mock, proxy 403 retry, project switching
0.1.29–0.1.41Apr 29–May 1Tamagui adapter, multi-root scan, fill color from iframe, Bulka proofs
0.1.44May 3–8i18n text inspector (first ship), drag ghost, selsurv
0.1.45May 9Drag bugs ×5, Shift+Enter fix, locale switcher, i18n key inspector ×4
0.1.46May 12Entry file watcher, i18n optimistic key, canvas crash fix, overlay HMR

Stack Detection — Preview Capabilities V2

Spec: docs/specs/2026-05-16-preview-capabilities-v2-design.md · Status: Approved

The single cssSystem detection field is replaced by 6 independent dimensions, each with its own support level. The readonly screen now shows the actual detected stack for the project instead of a static compatibility table.

Root causes fixed
  • → HyperIDE itself was detected as shadcn because class-variance-authority was used as a trigger — CVA is a utility, not a shadcn signal
  • → HyperIDE shown in readonly mode despite using fully supported tech (Tailwind + bun bundler); bun was in PreviewModeManager but absent from FULL_EDIT_BUNDLERS
  • → bun.lockb was treated as a bundler signal — it is a package manager lock file only
  • → Auto-start showed the "Start Dev Server" button instead of a spinner while the server was starting
① CSS Framework
Style-writing mechanism. Gates canWriteStyles.
tailwind, cssmodules,
styled-components,
emotion, sass
full
vanilla-extract,
pandacss, unocss, stylex
readonly
② Design System
Component layer. Detected separately from CSS.
shadcn, daisyui,
nextui, tamagui
full
mui, antd, chakra,
mantine, fluent
readonly
shadcn signal: @radix-ui/* in deps.
CVA alone is not a shadcn signal.
③ JS Framework
Meta-framework layer. Gates canRender.
react-*, preactfull
vue, svelte,
solidjs, astro
unsupported
New: TanStack Start, Gatsby, Preact, Astro all detected.
④ Bundler
Gates canRender and canWriteStyles.
vite, webpack, rspack,
cra, bun, parcel
full
unknownunsupported
bun as bundler: detected via bun-plugin-* in deps — not from bun.lockb. Rspack = webpack pipeline.
⑤ Router
Informational only. Does not gate editing.
nextjs-app · nextjs-pages
remix · react-router-jsx
react-router-file
tanstack-router · none
Derived from existing FrameworkType in framework-routing.ts.
⑥ Package Manager
Informational only. Never gates editing.
bun · npm · pnpm
yarn · yarn2
Detected via lock files. bun.lockb → package manager only, never bundler.
New ProjectCapabilities shape
// Detected stack
cssFramework:   CssFramework;     // tailwind | cssmodules | emotion | …
designSystem:   DesignSystem;     // shadcn | tamagui | mui | none | …
jsFramework:    JsFramework;      // react-vanilla | react-nextjs | preact | …
router:         RouterType;       // nextjs-app | remix | tanstack-router | …
bundler:        Bundler;          // vite | webpack | rspack | bun | parcel | …
packageManager: PackageManager;   // bun | npm | pnpm | yarn | yarn2

// Derived — no more redundant support* fields
canRender:      boolean;  // jsSupport !== 'unsupported' && bundlerSupport !== 'unsupported'
canWriteStyles: boolean;  // CSS_SUPPORT[cssFramework] === 'full' && BUNDLER_SUPPORT[bundler] === 'full'
readonly:       boolean;  // canRender && !canWriteStyles
Support maps (CSS_SUPPORT, DS_SUPPORT, JS_SUPPORT, BUNDLER_SUPPORT) exported from types.ts — usable by both extension host and webview. Also: uiKit → designSystem rename across AIBridge, StateHub, styling-tools.
Readonly Screen — Before vs After
Before
Static list of all possible CSS frameworks and design systems, regardless of what's actually in the project.

No indication of why the project is readonly.
After
Table of detected dimensions with per-row support badges:
JS FrameworkReact (vanilla)✅ Full
CSS FrameworkTailwind CSS✅ Full
Design Systemshadcn/ui✅ Full
BundlerVite✅ Full
Package Managernpmℹ️
Example: HyperIDE itself — after fixes
JS Framework
react-vanilla
CSS Framework
tailwind
Design System
none (no @radix-ui/*)
Bundler
bun (bun-plugin-tailwind)
Router
none
Package Manager
bun (bun.lockb)
→ Overall: full editing — readonly mode no longer shown for HyperIDE's own project