feat(ui): render every application template except the loading screen as a Vue view

The scene chrome, cockpit, Display controls, command dock, layer panels,
Context rail, welcome card and Provider Settings move verbatim into
src/ui/views and mount into their hosts before the page is translated and
wired. Each view renders the same elements, attributes and text as its
template; Vue keeps whitespace between elements as one space, and no view
markup sits under a white-space: pre rule.

Template asset URLs stay literal, view files are left out of Prettier so
the markup is not reflowed, and the Node component loader moves to build/
and is exported as build/register-vue for host test runners. Hosts that do
not initialize Core's locale pass localePicker: false instead of editing
the markup.
This commit is contained in:
Sameh Khamis committed 2026-10-30 17:47:52 -07:00
1 parent 9d24945143
commit 6802c9c8b0
46 files changed
+258 -97

No files matched your search

+6 -4
View File
@@ -61,9 +61,11 @@ They contain no application state.
need no change. Views belong to the page and are never unmounted. The
loading screen stays static so it paints before any script runs. Markup
tests read `renderApplicationHtml()` from `src/testSupport`, which renders
the views on the server. Vue preserves template whitespace so a view's DOM
matches its template exactly. First the markup moves, unchanged;
then each view takes over its wiring. Order: Scenes, Weather, Recent imagery,
the views on the server. Vue keeps the whitespace between elements as a
single space, so a view renders as its template did; no view markup sits
under a `white-space: pre` rule. The markup has moved, unchanged: every
template except the loading screen is a view. Next each view takes over
its wiring. Order: Scenes, Weather, Recent imagery,
Street level, CCTV, Layers, Display, Context and Radio, the command dock,
the phone shell, then Cockpit. Layers that write into the right rail
directly gain a slot instead.
@@ -78,7 +80,7 @@ They contain no application state.
components are compiled by a test loader; component tests render with
`@vue/test-utils` and `happy-dom`. `npm test` registers the loader; to run
one file that reaches a component (including anything importing the
shell), use `node --import=./src/testSupport/registerVue.mjs --test <file>`.
shell), use `node --import=./build/registerVue.js --test <file>`.
- Visual parity: before/after screenshots of every panel at desktop and phone
widths, in the default and Cyber themes, with the rail as the only expected
difference.