Driver Spec Runner UI
June 10, 2026 ยท View on GitHub
Angular frontend for the PlaceOS Driver Spec Runner. The app lets a developer select a driver, select the matching spec file, choose commits for each, run the spec, and watch the compiler/test output stream back in the browser.
What the App Talks To
The UI is a browser client for the Crystal runner in the repository root. It calls the runner through same-origin endpoints:
GET /build/repositorieslists available driver repositories.GET /buildlists drivers for the selected repository.GET /build/:driver/commitslists driver commit history.GET /testlists availabledrivers/**/*_spec.crfiles.GET /test/:spec/commitslists spec commit history.POST /testruns a spec without live streaming.WS /test/run_specruns a spec and streams live output.
During local development, ng serve uses proxy.conf.js to forward /build
and /test traffic to localhost:8085. Run the backend there, or update the
proxy target if your runner is bound to another port.
Prerequisites
- Node.js and npm compatible with Angular 22.
- A running Driver Spec Runner backend with access to the PlaceOS driver repository and the PlaceOS Build service.
- Frontend dependencies installed with
npm install.
Local Development
From this directory:
npm install
npm start
Open http://localhost:4200/.
Useful routes:
/opens the workbench with the default repository selected./:repoopens the workbench for a repository./:repo/:driveropens the workbench with a driver selected.
Example:
http://localhost:4200/Public/drivers/example/example.cr
The app will reload when files under src/ change.
Backend Setup
The frontend proxy expects the runner on port 8085. From the repository root,
one local option is:
shards install
crystal run src/app.cr -- --port=8085
If the backend aborts with a PlaceOS Build connection error, follow the driver repository setup linked from the root README and confirm the build service is healthy before starting the UI.
Running Tests
npm test
Tests run through Angular's @angular/build:unit-test builder with Vitest.
Building
npm run build
The production build is written to dist/spec-runner-ui/browser.
To serve the built app from the Crystal runner, point PUBLIC_WWW_PATH at that
directory before starting the backend:
PUBLIC_WWW_PATH=frontend/dist/spec-runner-ui/browser crystal run src/app.cr -- --port=8085
Project Layout
src/app/workbench.component.tswires repository and driver route params into the workbench.src/app/workbench-form.component.tsrenders repository, driver, spec, commit, and debug-symbol controls.src/app/workbench-output.component.tsruns specs, cancels active websocket runs, and renders terminal output.src/app/services/build.service.tsowns repository, driver, commit, and test status state.src/app/services/test.service.tsowns spec selection, spec commits, settings, and test execution.public/assets/locales/contains runtime translation files.proxy.conf.jscontrols local API and websocket proxying.
Troubleshooting
- Empty repository or driver lists usually mean the Angular dev server cannot
reach the backend target configured in
proxy.conf.js. - A websocket run that closes immediately usually means the backend could not compile either the selected driver or the selected spec.
DEBUG_WITH_API=1in browser local storage makes the output panel use the non-streamingPOST /testpath instead of the websocket path.- Test status badges are stored in browser local storage under
HARNESS.statuses.