Skip to content

Finish the @sema-lang/ui migration: notebook + playground on 0.2.0, e2e restored (#69) - #97

Merged
HelgeSverre merged 5 commits into
mainfrom
feat/notebook-ui-migration
Jul 10, 2026
Merged

HelgeSverre merged 5 commits into
mainfrom
feat/notebook-ui-migration

Conversation

@HelgeSverre

Copy link
Copy Markdown
Member

Summary

Completes #69 — the notebook (and playground) now consume @sema-lang/ui for every primitive the issue mapped, and the verification loop around them is restored.

Notebook: buttons/tooltips, insert dropdown (popover+menu), reset dialog, toast feedback, sema-input title — plus fixes for the three regressions the original slice shipped: the markdown-rendered testid contract, Escape-blur (edits now commit), and persist-on-focusout (script-mutated values like Tab-indent never arm the native dirty flag). Design tokens are served and the palette uses the library's token names.

Playground: Stop button finally reads destructive, Clear VFS gets a confirm dialog, toasts for transient feedback, in-place sema-tree updates, ~230 lines of dead CSS deleted, debugger specs modernized onto the editor's new gutter part tokens (they had silently rotted since the editor dogfood — the old .gutter-line class hasn't existed in any published bundle), and the ascii-art.sema example no longer crashes on string/repeat with a float.

Tests/infra: the e2e suite serves a temp copy of its fixture (runs were mutating the git-tracked demo notebook and compounding failures), a PW_CHANNEL escape hatch for machines with broken Playwright downloads, a new notebook-e2e CI workflow (this suite has never run in CI), the restored notebook-ui-vendor jake recipe (lost with the Makefile), and a test.playground-e2e recipe.

Verification (all run against this exact tree)

  • Notebook e2e: 49/49, three consecutive runs, fixture stays clean between runs
  • Playground e2e: 76 passed / 1 skipped / 0 failed (was 53/23 before the spec modernization)
  • cargo check + cargo test -p sema-notebook (50 tests) green; jake -l parses
  • @sema-lang/ui at the vendored build: 299/299 component tests, lint/typecheck/build clean

Dependencies

Closes #69.

Sema Coder moved out of the monorepo into the standalone
sema-lisp/sema-coder repo (a workspace member). It's no longer an
example; it depends only on the sema binary and runs via a shebang.
All remaining hand-rolled primitives move onto library components:
- toolbar/cell/pill buttons -> sema-button wrapped in sema-tooltip
- insert dropdown -> sema-popover + sema-menu (activation via sema-select,
  covering keyboard and mouse in one path)
- reset confirm -> sema-dialog; save feedback/failure -> toast()
- title input -> sema-input with testid forwarding
- markdown-rendered testid moves to the component's testid prop so the
  forwarded shadow node carries it (innerHTML assertions see rendered HTML)
- Escape blurs the editor again (new blur() delegate) and edits persist on
  focusout — change alone misses script-mutated values (Tab indent)
- notebook.js is an ES module importing toast directly; no window bridge
- tokens.css vendored + served (new asset route + test); style.css keeps
  only warm-palette overrides on the library's token names
- vendored bundle refreshed to the locally built @sema-lang/ui 0.2.0

Cell focus for new cells waits on customElements.whenDefined instead of
racing element upgrade.
- webServer serves a copy of the demo notebook (runs are idempotent; the
  suite used to save through to the git-tracked fixture and compound
  failures across runs)
- PW_CHANNEL env escape hatch for machines where the managed chromium
  download stalls
- reset flow drives the sema-dialog instead of window.confirm; save
  feedback asserts a toast; Tab test sets the caret explicitly (the
  component parks it at the end on programmatic value assignment);
  disabled checks assert the reflected property (aria-disabled is
  role-gated in Playwright and the host deliberately has no role)
…nization

- Run->Stop uses the run+danger at-rest styling (dead .stop-btn class
  removed); Clear VFS gated behind a sema-dialog confirm; transient
  feedback routed through toast() (steady-state status text unchanged)
- sema-tree updates in place (reconcile by name+kind) instead of full
  innerHTML rebuilds per interaction
- tokens.css vendored via build.mjs (shared vendorFromSemaUi helper) and
  linked before style.css; ~230 lines of dead pre-component CSS deleted;
  text tokens renamed onto the library namespace
- debugger specs target the editor's gutter part tokens through a shared
  tests/gutter.ts helper module (the old .gutter-line class no longer
  exists); infinite-loop test asserts the step-limit self-termination the
  VM actually performs; Run tooltip opens below like its siblings
- ascii-art example: string/repeat needs an int; wrap the rounded bar
  length (examples.js regenerated)
- notebook-ui-vendor recipe (lost when the Makefile was retired) fetches
  the pinned @sema-lang/ui bundle + tokens.css from unpkg
- new notebook-e2e workflow (pre-builds the sema binary so the playwright
  webServer's 60s startup timeout survives a cold cache; uploads
  test-results on failure)
- test.playground-e2e recipe alongside the other browser suites
@HelgeSverre
HelgeSverre merged commit dcee4f3 into main Jul 10, 2026
8 of 9 checks passed
@HelgeSverre
HelgeSverre deleted the feat/notebook-ui-migration branch July 10, 2026 20:04
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Migrate notebook UI primitives to @sema/ui (Lit web components) [deferred]

1 participant