ms-ai-architect/docs/playground.md
Kjell Tore Guttormsen 7df2ff33db docs(ms-ai-architect): skriv inn DS-repoets svar - vendoring bestaar, source_commit er usann
playground-design-system svarte paa coord 20260826T125424Z-633311263 (deres
20260826T221726Z-1224320768). Alle fem baerende paastander er verifisert HER foer
de ble skrevet inn - en melding er premiss, ikke faktum:

1. c1b7bad LEVER i catalog-repoet (977 commits, pre-migrasjons-monorepohistorikk).
   Vaar egen slutning om at lineagen var kuttet var FEIL - den er kuttet fra vaart
   og deres repo, ikke fra catalog. Rettet.
2. Skriptet ligger i e84dffd^:scripts/sync-design-system.mjs - 225 linjer, og det
   tar allerede --source/--target/--check/--force. Restaurering, ikke nyutvikling.
3. source_commit c1b7bad er ikke bare unaabar, den er USANN: det vendorede treet
   inneholder components-tier4-project-view.css, som ikke fantes i den commiten.
   Kjent-positiv kontroll paa components-tier3.css i SAMME commit slaar opp fint,
   saa spoerringen kan finne. Syncen etikettmerket med marketplace-HEAD mens den
   kopierte et ukommittert arbeidstre.
4. 26 av 27 filer byte-identiske med DS-repoets naavaerende innhold. Merk: foerste
   maaling her ga 17/27 fordi generated-headeren ikke var trukket fra. Justert
   maaling matcher deres tall eksakt; kjent-positiv bekreftet at sammenligningen
   kan skille. Avviket er deres egen README.md.
5. 27/27 mot vaar egen MANIFEST - ingen lokal drift.

Skrevet inn: vendoring bestaar som anbefalt konsumentmodell, ingen avloesning.
Ingen kommando publisert ennaa - DS-repoet holder restaureringen til
kildeavgrensningen er valgt, fordi en naiv --source . over deres repo-rot ville
vendoret STATE.md og repo-apparatet inn hit. Vi rekonstruerer ingenting lokalt.
MANIFEST.json er LATT UROERT paa deres eksplisitte anbefaling: aa oversette stien
og beholde commiten ville gjort en aapenbart stale peker til en troverdig feil en.

Lagt til et punkt om hva en konsument kan sjekke uten skriptet, inkludert
header-fellen som ga min egen foerste maaling feil svar.

Verifisering: prosa, ingen test dekker den - hver erstatning er hel-linje-anker
med telt forekomst (alle unike). Diff-kontekst lest med -U4. Suite: 1070/1070.
2026-08-27 00:25:26 +02:00

68 lines
11 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

# ms-ai-architect — Playground (v3 / v1.16.1)
Interaktiv decision-builder + rapport-viewer for Microsoft AI-beslutninger. Imported from `CLAUDE.md` via pointer.
Erstatter v2 5-stegs-pipelinen med en multi-surface-app som persisterer state og visualiserer importerte rapporter inline. Spec: v3-arkitektur dokumentert under `.claude/projects/2026-05-03-playground-v3-architecture/`. v1.10.0-utvidelser dokumentert under `.claude/projects/2026-05-03-ms-ai-architect-v1-10-playground/`. v1.11.0 leverer design-system 100%-adoption. v1.13.0/.1 patchet 10+ symptomatiske visuelle bugs. v1.14.0 leverer root-cause refaktor over 6 sesjoner (DS-konvensjon-adopsjon på 14 renderere, lokal CSS halvert).
**v1.15.0 (sesjon 5 av ~8 i v2-prosjektet):** Project-surface byttet fra v2 `renderProjectSurface` (screen-tabs + category-tabs + per-command paste-cards) til v3 `renderProjectView` (sidebar med 17 artifacts + main-area + import-modal overlay). `renderActive()` ruter `project`-surface til `renderProjectSurfaceV3()` som wrapper renderProjectView + topbar + app-shell. V2-surface helt fjernet: `renderProjectSurface` (152 linjer), `renderCommandSubCard` (87 linjer), `rehydratePasteImports` (15 linjer), `currentProjectScreen`, `ACTIONS['project-screen']`, 5 v2-CSS-klasser. Zombie-handlers beholdt for test-back-compat: `currentProjectTab`, `ACTIONS['project-tab']`, `ACTIONS['parse']`, `handlePasteImport`, `window.__handlePasteImport`. 2 fingerprint-gap lukket: requirements.headers + license.headers. `migrateDataVersion` utvidet med `parserFor` → demo-state (kun `raw_markdown`) auto-parses til `project.artifacts[cid]`. Ship-QA-bugfixes: `components-tier4-project-view.css` lagt til i `<link>`-kjeden (manglet → modal-overlay og two-column layout virket ikke); `renderImportModal` setter `data-open="true"` (DS-kontrakt).
- **Fil:** `playground/ms-ai-architect-playground.html` (~3870+ linjer, single-file v3-arkitektur)
- **4 surfaces:** Onboarding (18 felles felt — 4 strukturerte / 14 fritekst etter v1.10.0) → Home (prosjekt-liste + 3 entry-tracks) → Catalog (29 commands gruppert i 5 expansion-grupper med søk) → **Project v3** (sidebar med 17 artifacts gruppert i 4 kategorier + søk + main-area med per-artifact view eller overview med top-risks/next-actions + import-modal som DS-overlay)
- **Persistens:** IndexedDB-primær med localStorage-fallback. Schema-versjonert (`STATE_KEY = 'ms-ai-architect-state-v1'`) med eager `MIGRATIONS`-pipeline. v1.10.0 introduserer `dataVersion v1→v2`-migrasjon (idempotent) som backfill-er `verdict`+`keyStats`.
- **17 rapport-renderers (felles grunnskjelett):** Alle wrapper output via `renderPageShell()` med eyebrow + h1 + valgfri verdict-pill + valgfri key-stats-grid + arketype-spesifikk body. Parser → struktur → HTML rutet via kanonisk archetype-routing-tabell.
- **Foundation-helpers:** `renderPageShell`, `renderVerdictPill`, `renderKeyStatsGrid`, `inferVerdict`, `inferKeyStats`, `KEY_STATS_CONFIG`.
- **Tier 3-adopsjon:** kanban (conformity, review), mat-ladder (migrate, poc), screen-tabs (utredning, project surface), scenario-card-grid (license, compare), residual-pair (dpia, ros), top-risks (ros), recommendation-card (security, ros), suppressed-panel (review), critique-card (adr), read-more (utredning, summary), traffic-light (poc).
- **Theme:** Mørk default + lys theme-toggle med Aksel-tokens i begge moduser (lagt til i v1.10.0). Persistert i `localStorage('ms-ai-architect-theme')`. Theme-bootstrap-script i `<head>` unngår FOUC.
- **Eksport/import:** JSON Decision Record-envelope (Blob + FileReader), schema-versjon-bevisst på import.
## Validering (v1.16.0-tall, uendret i v1.16.1 — playground-koden uendret siden v1.15.0)
| Test | Kommando | Dekning |
|------|----------|---------|
| Statisk struktur | `bash tests/test-playground-v3.sh` | 223 PASS, 2 WARN (pre-eks.) — vendored CSS, surfaces, 29 commands, 14 parsere, 17 renderers via PROJECT_VIEW_CONFIG.renderers-routing, action-handlers |
| Parser-fixtures | `bash tests/test-playground-parsers.sh` | 70 PASS — 17 fixtures × parser-routing |
| Migrasjon | `bash tests/test-playground-migrations.sh` | 16 PASS — v1→v2 + v2→v3 idempotent migrasjon |
| Fingerprints | `bash tests/test-playground-fingerprints.sh` | 32 PASS — 17-fixture true-positive + 4 anti-match + API-sanity |
| Project-view | `bash tests/test-playground-projectview.sh` | 30 PASS — 4 view-states + nav-søk + null-guard |
| ACTIONS | `bash tests/test-playground-actions.sh` | 19 PASS — 6 pure-state-handlers + projectViewUiState |
| Kombinert (E2E) | `bash tests/run-e2e.sh --playground` | 390 PASS, 0 FAIL, 2 WARN |
| Plugin-validering | `bash tests/validate-plugin.sh` | 239 PASS |
| Manuell A11Y QA | Se `playground/MANUAL-CHECKLIST.md` | 10 seksjoner inkl. axe-core-kjøring per surface |
| A11Y-rapport | `playground/A11Y-RAPPORT.md` | Statisk vurdering klar — browser-axe-kjøring pending |
## Demo system (v1.11.0 → v1.15.0)
`scripts/build-demo-state.mjs` leser alle 17 fixture-filer fra `playground/test-fixtures/` og injiserer dem som en `<script type="application/json" id="demo-state-v1">`-blokk i playground HTML (idempotent — erstatter eksisterende blokk). "Last inn demo-data"-knappen på onboarding-overflaten kaller `ACTIONS['load-demo']` som leser blokken, erstatter alle state-grener via Proxy-mutasjon, kjører `migrateDataVersion` (v2→v3 auto-parser raw_markdown til artifacts), og navigerer til project-surface. Demo viser 17 artifacts gruppert i sidebar med severity-badges, aggregate verdict (BLOKKERT), top-risks-liste, og fungerende re-importer/slett-knapper per artifact.
`tests/screenshot/` inneholder en frittstående Playwright-runner med egen `package.json` (gitignored `node_modules`). `node run.mjs` produserer 24 PNG-er (12 surfaces × 2 tema) under `playground/screenshots/v1.15.0/`. v1.15.0-surfaces: onboarding-empty, project-overview, project-artifact-{classify,security,ros,cost,summary}, project-import-modal (viewport-only — modal er position:fixed overlay), project-search, home, catalog, onboarding-prefilled. v1.10.0/v1.11.0/v1.14.0 beholdt som historisk referanse. Disse committes så forkere ser pluginen uten å installere noe. Demo-org er "Acme Kommune" og demo-prosjekt er "Acme: Kunde-chatbot".
## Design-system 100%-adoption (v1.11.0 → v1.14.0)
Sesjon 3-5 la til inline CSS i `playground/ms-ai-architect-playground.html`. v1.11.0 hoisted alle generiske komponenter til `shared/playground-design-system/components-tier3-supplement.css` (DS v0.3.0):
- `.pyramide-desc` / `.pyramide-desc__item`
- `.scenario-card-grid` / `.scenario-card`
- `.residual-pair` / `__cell` / `__cell-label/__cell-value/__cell-meta` / `__arrow`
- `.read-more` / `.read-more__trigger` / `.read-more__chev` / `.read-more__body`
- `.top-risks` / `.top-risk[data-severity]`
- `.recommendation-card`
- `.suppressed-panel`
- `.screen-tabs` / `.screen-tab` / `.screen[data-active]`
v1.14.0 (DS v0.4.0): root-cause fix for tre DS-bugs som tidligere ble symptomatisk patchet i lokal CSS — `.kanban-card__name` (break-word + overflow-wrap; var break-all), `.expansion__title-main/sub` (display: block), `.matrix__bubble` (cursor + hover/focus). Fix-en re-syncet til vendored DS, og tilsvarende lokal-overrides slettet. Plus: 14 renderere refaktorert til DS-konvensjon (3 risk-renderere → DS-summary-grid + ros-layout, 6 compliance/govern-renderere → DS-konvensjon, renderMigrate + renderPoc → expansion-list per fase). Lokal `<style>`-blokk: 191 → 122 effektive linjer (~36% reduksjon siden v1.13.1).
Alle PARALLEL-CSS-navngrupper migrert til DS-konvensjon. `renderPageShell` + `renderKeyStatsGrid` refaktorert til DS markup. Severity-coded card-borders på rapport-cards, app-header-restruktur, `.stack-lg` body spacing på home/project/catalog, AI Act-pyramide bredde-fix, eyebrow-label på home-projects.
Ved videre hoisting: dette er endringer i et delt asset og krever drift-deteksjons-håndtering per `MANIFEST.json`. ⚠️ Det finnes fortsatt ingen re-sync-kommando å kjøre — se «Vendored design-system» under for hva som er avklart og hva som gjenstår oppstrøms.
## Vendored design-system
Playground laster CSS fra `playground/vendor/playground-design-system/` — en vendored kopi av det delte playground-designsystemet (27 filer + `MANIFEST.json`). Dette holder pluginen **standalone**: HTML-filen kan åpnes fra `file://` uavhengig av marketplace-roten.
- **⚠️ Ingen re-sync-kommando ennå — restaurering pågår oppstrøms.** Vendoring **består** som anbefalt konsumentmodell (designsystem-repoets beslutning 2026-08-27; ingen avløsning — en submodul eller npm-pakke ville brutt deres krav om ingen build, ingen bundler, `file://`). Skriptet er **ikke tapt**: det ligger komplett i catalog-repoets pre-migrasjonshistorikk — `git -C <marketplace>/catalog show e84dffd^:scripts/sync-design-system.mjs` (225 linjer, ingen npm-avhengigheter, og det tar allerede `--source`, `--target` og `--check`). Restaureringen er designsystem-repoets avgjørelse, og de holder den bevisst tilbake til kildeavgrensningen er valgt: deres repo-rot inneholder designsystemet **pluss** repo-apparatet, så en naiv `--source .` ville vendoret `STATE.md`, `LICENSE` og `docs/` inn hit. De publiserer en kommando når den er verifisert. **Ikke rekonstruer en lokalt.**
- **🔴 Ikke stol på `source_commit` i `MANIFEST.json`.** Feltet sier `c1b7bad`, som ikke bare er unåbar herfra — den er **usann**. Det vendorede treet inneholder `components-tier4-project-view.css`, og den fila fantes ikke i `c1b7bad` (kjent-positiv kontroll: `components-tier3.css` i samme commit slår opp fint). Syncen etikettmerket kopien med marketplace-HEAD mens den kopierte et ukommittert arbeidstre. **La feltet ligge:** å skrive om stien og beholde commiten ville gjort en åpenbart stale peker til en troverdig feil peker. En framtidig re-sync skriver et sant manifest.
- **Hva du kan sjekke i dag, uten skriptet:** re-hash det vendorede treet mot `MANIFEST.json`. Målt 2026-08-27 — **27/27 matcher**, så ingenting her er redigert lokalt, og **26 av 27 filer er byte-identiske** med designsystem-repoets nåværende innhold, 3,5 måned etter siste sync. Eneste avvik er deres egen `README.md`, som beskriver systemet framfor å være en del av det. Ved manuell sammenligning: se bort fra første linje i hver vendored CSS-fil — generated-headeren legges på av syncen, så en rå `diff` melder alle ni CSS-filer som avvikende når ingen av dem er det.
- **Drift-deteksjon:** `MANIFEST.json` lagrer SHA-256 per fil, så lokal endring av en vendored fil er detekterbar.
- **Lastes i HTML:** `<link>`-tags til `fonts.css`, `tokens.css`, `base.css`, `components.css`, `components-tier2.css`, `components-tier3.css`, `components-tier3-supplement.css` (i den rekkefølgen).
- **Aldri rediger** filer under `vendor/playground-design-system/` direkte. Oppstrøms-endringer hører hjemme i designsystem-repoet — men se punktene over: veien tilbake hit finnes ikke som kommando ennå.
> v2-spec under `docs/playground-v2-spec.md` er beholdt som historisk referanse, men er IKKE gjeldende kontrakt. v3-arkitekturen er dokumentert i `.claude/projects/2026-05-03-playground-v3-architecture/`.