Skip to content

Svelte app with OpenMS WebAssembly, running entirely on the user's machine - #411

Draft
t0mdavid-m wants to merge 3 commits into
mainfrom
claude/svelte-local-template-od1pp1
Draft

t0mdavid-m wants to merge 3 commits into
mainfrom
claude/svelte-local-template-od1pp1

Conversation

@t0mdavid-m

@t0mdavid-m t0mdavid-m commented Oct 20, 2026 •

Copy link
Copy Markdown
Member

Requested by Tom · project thread

Before: the template offered only the Streamlit app, which needs a Python server with pyOpenMS and the TOPP tools.

After: frontend/ is a Svelte single-page app that runs OpenMS itself in the browser as WebAssembly, the way prose-web does. There is no backend. Workspaces live in the browser's storage, and workflows run on the user's machine. Data leaves the machine only when the user clicks Share workspace. That button is optional: it uploads the workspace (input files only if a box is ticked) to share-server/share.py and returns a link that opens a copy.

How:

  • Engine. The @openms/openms-wasm-mt package is fetched and checksum-pinned on npm install. It runs in a module Web Worker, and each workflow run gets its own worker, so Stop terminates that worker.
  • Storage. Workspaces are stored in OPFS with the Streamlit layout and params.json format, so presets and exported workspace ZIPs carry over between the two apps.
  • Workflow framework. The workflow framework (WorkflowSpec, getFiles, runTool, runStep, the three log files and the outcome markers) mirrors WorkflowManager.
  • Example workflow. The example workflow ports src/Workflow.py:
    • FeatureFinderMetabo is built on MTD, EPD and FFM.
    • The feature linker is a TypeScript stand-in, because the build has no grouping algorithm.
    • The consensus TSV step is ported as well.
  • Pages. All toolbox, mzML and example pages are ported.
  • Launcher. frontend/serve.py serves the build on localhost with the COOP/COEP headers that threads need. On other hosts a service worker adds those headers.
  • Python server removed. The previous Python server (server/, requirements-svelte.txt, tests/svelte/) is removed.
  • CI. The CI job is Node only: svelte-check, vitest on the WebAssembly module (including the example workflow end to end), and the build.

Run it: cd frontend && npm install && npm run build && python3 serve.py. Parity status is in frontend/PARITY.md, and the guide is in docs/svelte_app.md.

Known gaps:

  • The linker does no RT alignment.
  • The isotope calculator has no oligonucleotide patterns.
  • There are no OpenMS-Insight components.
  • A run ends when its tab closes.

🤖 Generated with Claude Code

https://claude.ai/code/session_01FQ2PLCaTnA3oG5uyMXNU1U

A Svelte single-page app (frontend/) and a FastAPI server bound to
127.0.0.1 (server/) that reproduce the template's pages and the TOPP
Workflow Framework, running entirely on the user's machine. The server
reuses ParameterManager, FileManager, Logger and tasks.execute_workflow,
so workflows run their unchanged execution() and workspaces are shared
with the Streamlit app.

The isotope pattern and fragmentation logic moves into src/ so both
frontends use it. frontend/PARITY.md tracks feature parity.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01FQ2PLCaTnA3oG5uyMXNU1U
@t0mdavid-m t0mdavid-m self-assigned this Oct 20, 2026
Insight's Python bridge and Vue bundle run unchanged. server/insight.py
runs a dashboard function with Streamlit's session state, rerun and
component call replaced, looping until the components settle as
Streamlit's reruns would. InsightView.svelte loads the bundle in an iframe
per component and speaks the Streamlit component protocol to it.

The example workflow's results page gains an Insight feature table linked
to an intensity plot. openms-insight stays optional.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01FQ2PLCaTnA3oG5uyMXNU1U

t0mdavid-m commented Oct 20, 2026 •

Copy link
Copy Markdown
Member Author

Failing checks on 228aa60:

  • test-nginx (simple, amd64, ubuntu-latest)
  • test-traefik (simple, amd64, ubuntu-latest)
  • test-nginx (full, amd64, ubuntu-latest)

All three fail the same way as on 564a544. The client gets Remote I/O error on /workspaces-streamlit-template in the cross-node check, the stable-identity check and the seed-demos init container. The job then fails at the stable-identity assertion. On 42a426b, test-traefik (simple, amd64) and test-nginx (full, arm64) failed the same way.

Why it is not this PR's: the failures follow the GitHub runner image, not the commit.

Job Runner image NFS
failing test-nginx (simple, amd64) on 564a544 ubuntu-24.04 20261018.339.1 Remote I/O error
failing test-nginx (simple, amd64) on 228aa60 ubuntu-24.04 20261018.339.1 Remote I/O error
failing test-traefik (simple, amd64) on 228aa60 ubuntu-24.04 20261018.339.1 Remote I/O error
failing test-nginx (full, amd64) on 228aa60 ubuntu-24.04 20261018.339.1 Remote I/O error
passing test-traefik (simple, amd64) on 564a544 ubuntu-24.04 20261012.334.1 no errors
passing test-nginx (simple, arm64) on 228aa60 20261012.149.1 no errors
main's last green run (feae6a2, 19 Oct) 20261012.334.1 no errors

Each run, the jobs that land on the new image fail and the others pass, so the failure seems to move between jobs. This PR doesn't touch any of the files the failing check depends on:

  • k8s/
  • the Dockerfiles
  • the entrypoint
  • .github/scripts/ci-assertions.sh

I expect main to fail the same way once its kind jobs get the 20261018 image. The likely cause is that image's kernel NFS client running against the Ganesha server in k8s/storage/, but I haven't confirmed it.

Fix: none exists yet. It belongs in a separate change to the storage setup or CI, not in this PR. I'll re-run the failed jobs once when the run completes. They only go green if they land on the older image.


Generated by Claude Code

Replace the Python server with the OpenMS WebAssembly build (as prose-web):
an engine Web Worker, workspaces in the browser's file system, the workflow
framework, tools and steps in TypeScript, and an optional Share button that
uploads a workspace to share-server/share.py. Adds a local launcher with the
isolation headers, Node tests on the module and a Node-only CI job.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01FQ2PLCaTnA3oG5uyMXNU1U
@t0mdavid-m t0mdavid-m changed the title Svelte frontend with a local server, toward feature parity Svelte app with OpenMS WebAssembly, running entirely on the user's machine Oct 20, 2026
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.

2 participants