Clean Toolbox card status display, add port guard, and add wireframe tool pages - PR_26160_055-toolbox-wireframe-and-port-guard

Author: ToolboxAid

assets/theme-v2/css/status.css

@@ -48,3 +48,10 @@
   padding: var(--space-3) var(--space-10);
   text-shadow: 0 1px 2px var(--shadow-color-strong)
 }
+
+.swatch-label.swatch-cyan,
+.swatch-label.swatch-gold,
+.swatch-label.swatch-green {
+  color: var(--bg);
+  text-shadow: none
+}

assets/theme-v2/js/gamefoundry-partials.js

@@ -1,4 +1,28 @@
 (function () {
+    const localDevExpectedPort = "5501";
+    const localDevHostnames = new Set(["127.0.0.1", "localhost", "::1"]);
+
+    function shouldRedirectLocalDevPort() {
+        return window.location.protocol === "http:" &&
+            localDevHostnames.has(window.location.hostname) &&
+            window.location.port !== localDevExpectedPort &&
+            window.navigator?.webdriver !== true;
+    }
+
+    function redirectLocalDevPort() {
+        if (!shouldRedirectLocalDevPort()) {
+            return false;
+        }
+        const target = new URL(window.location.href);
+        target.port = localDevExpectedPort;
+        window.location.replace(target.href);
+        return true;
+    }
+
+    if (redirectLocalDevPort()) {
+        return;
+    }
+
     const routeMap = {
         home: "index.html",
         toolbox: "toolbox/index.html",

assets/theme-v2/js/tool-display-mode.js

@@ -26,6 +26,15 @@
             return publicAssetRoot + "/image-missing.svg";
         }
 
+        const cleanPath = source.split("#")[0].split("?")[0].replace(/\\/g, "/");
+        const assetIndex = cleanPath.indexOf("/assets/theme-v2/images/");
+        if (assetIndex >= 0) {
+            return cleanPath.slice(assetIndex);
+        }
+        if (cleanPath.indexOf("assets/theme-v2/images/") === 0) {
+            return "/" + cleanPath;
+        }
+
         return publicAssetRoot + "/" + folder + "/" + fileName;
     }
 

docs_build/dev/reports/coverage_changed_js_guardrail.txt

@@ -6,10 +6,10 @@ Missing changed runtime JS files are WARN, not FAIL.
 Source: Playwright/Chromium built-in V8 coverage from the active Playwright run.
 
 Changed runtime JS files considered:
-(0%) src/dev-runtime/persistence/mock-db-store.js - WARNING: changed runtime JS file was not collected by Playwright V8 coverage; advisory only
 (0%) toolbox/toolRegistry.js - WARNING: changed runtime JS file was not collected by Playwright V8 coverage; advisory only
-(75%) toolbox/tools-page-accordions.js - executed lines 991/991; executed functions 72/96
+(65%) assets/theme-v2/js/gamefoundry-partials.js - executed lines 545/545; executed functions 30/46
+(75%) toolbox/tools-page-accordions.js - executed lines 1054/1054; executed functions 77/103
+(93%) assets/theme-v2/js/tool-display-mode.js - executed lines 209/209; executed functions 13/14
 
 Guardrail warnings:
-(0%) src/dev-runtime/persistence/mock-db-store.js - WARNING: changed runtime JS file missing from coverage; advisory only
 (0%) toolbox/toolRegistry.js - WARNING: changed runtime JS file missing from coverage; advisory only

docs_build/dev/reports/playwright_v8_coverage_report.txt

@@ -12,36 +12,36 @@ Note: entry percentages use function coverage when available, otherwise line cov
 Note: coverage entries are aggregated across every page/tool where coverageReporter.start(page) and coverageReporter.stop(page) ran.
 
 Exercised tool entry points detected:
-(67%) Toolbox Index - exercised 8 runtime JS files
+(80%) Toolbox Index - exercised 8 runtime JS files
 (0%) Tool Template V2 - not exercised by this Playwright run
-(64%) Theme V2 Shared JS - exercised 2 runtime JS files
+(72%) Theme V2 Shared JS - exercised 2 runtime JS files
 
 Changed runtime JS files covered:
-(0%) src/dev-runtime/persistence/mock-db-store.js - WARNING: changed runtime JS file was not collected by Playwright V8 coverage; advisory only
 (0%) toolbox/toolRegistry.js - WARNING: changed runtime JS file was not collected by Playwright V8 coverage; advisory only
-(75%) toolbox/tools-page-accordions.js - executed lines 991/991; executed functions 72/96
+(65%) assets/theme-v2/js/gamefoundry-partials.js - executed lines 545/545; executed functions 30/46
+(75%) toolbox/tools-page-accordions.js - executed lines 1054/1054; executed functions 77/103
+(93%) assets/theme-v2/js/tool-display-mode.js - executed lines 209/209; executed functions 13/14
 
 Files with executed line/function counts where available:
 (38%) src/engine/api/session-api-client.js - executed lines 34/34; executed functions 3/8
-(55%) toolbox/colors/colors.js - executed lines 2147/2147; executed functions 114/206
-(58%) src/engine/api/server-api-client.js - executed lines 159/159; executed functions 11/19
-(64%) assets/theme-v2/js/gamefoundry-partials.js - executed lines 525/525; executed functions 28/44
-(64%) assets/theme-v2/js/tool-display-mode.js - executed lines 201/201; executed functions 9/14
+(53%) src/engine/api/server-api-client.js - executed lines 159/159; executed functions 10/19
+(65%) assets/theme-v2/js/gamefoundry-partials.js - executed lines 545/545; executed functions 30/46
 (71%) toolbox/project-workspace/project-workspace.js - executed lines 264/264; executed functions 17/24
-(75%) toolbox/tools-page-accordions.js - executed lines 991/991; executed functions 72/96
-(89%) toolbox/tool-registry-api-client.js - executed lines 148/148; executed functions 24/27
+(75%) toolbox/tools-page-accordions.js - executed lines 1054/1054; executed functions 77/103
+(78%) toolbox/game-configuration/game-configuration.js - executed lines 169/169; executed functions 14/18
 (91%) toolbox/game-design/game-design.js - executed lines 242/242; executed functions 20/22
-(100%) toolbox/colors/palette-api-client.js - executed lines 19/19; executed functions 4/4
+(93%) assets/theme-v2/js/tool-display-mode.js - executed lines 209/209; executed functions 13/14
+(96%) toolbox/tool-registry-api-client.js - executed lines 148/148; executed functions 26/27
+(100%) toolbox/game-configuration/game-configuration-api-client.js - executed lines 10/10; executed functions 2/2
 (100%) toolbox/game-design/game-design-api-client.js - executed lines 12/12; executed functions 2/2
 (100%) toolbox/project-workspace/project-workspace-api-client.js - executed lines 12/12; executed functions 2/2
 
 Uncovered or low-coverage changed JS files:
-(0%) src/dev-runtime/persistence/mock-db-store.js - WARNING: uncovered changed runtime JS file; advisory only
 (0%) toolbox/toolRegistry.js - WARNING: uncovered changed runtime JS file; advisory only
 
 Changed JS files considered:
-(0%) src/dev-runtime/persistence/mock-db-store.js - changed JS file not collected as browser runtime coverage
-(0%) tests/playwright/tools/RootToolsFutureState.spec.mjs - changed JS file not collected as browser runtime coverage
 (0%) tests/playwright/tools/ToolboxRoutePages.spec.mjs - changed JS file not collected as browser runtime coverage
 (0%) toolbox/toolRegistry.js - changed JS file not collected as browser runtime coverage
+(65%) assets/theme-v2/js/gamefoundry-partials.js - changed JS file with browser V8 coverage
 (75%) toolbox/tools-page-accordions.js - changed JS file with browser V8 coverage
+(93%) assets/theme-v2/js/tool-display-mode.js - changed JS file with browser V8 coverage

docs_build/dev/reports/toolbox-wireframe-and-port-guard-report.md

@@ -0,0 +1,56 @@
+# PR_26160_055 Toolbox Wireframe And Port Guard Report
+
+## Branch Validation
+
+| Check | Expected | Actual | Status |
+| --- | --- | --- | --- |
+| Current git branch before changes | `main` | `main` | PASS |
+
+## Requirement Checklist
+
+| Requirement | Status | Evidence |
+| --- | --- | --- |
+| Correct Toolbox item states to exactly `planned`, `wireframe`, `beta`, `complete` | PASS | `toolbox/toolRegistry.js` defines `TOOL_RELEASE_CHANNELS` as `planned`, `wireframe`, `beta`, `complete`; `toolbox/tools-page-accordions.js` renders filters in that order. Node audit found no active release channels outside the allowed set. |
+| Keep existing groupings such as AI, Design, Audio, Assets, Build, System, Community, and Admin | PASS | `toolbox/tools-page-accordions.js` keeps group badges via `data-toolbox-group-badge` and separate state badges via `data-toolbox-state-badge`. |
+| Toolbox card content order is badge/action, group/state, feedback, then plan details | PASS | `tests/playwright/tools/ToolboxRoutePages.spec.mjs` asserts the Build Game action row order and card body order. |
+| Remove incorrect state treatment for group labels such as Play, AI, Design, and Audio while preserving them as groups | PASS | Group labels remain rendered through `createGroupLabel`; state labels are rendered separately through `createStateLabel`. Playwright asserts Design group label and Complete state badge coexist separately. |
+| Feedback Up/Down vote counts render and each user can vote one direction | PASS | `createToolVoteControls` stores per-tool voter direction and updates Up/Down counts; Playwright verifies Up -> Down changes the same user vote instead of adding both. |
+| Add dev-only port guard redirecting non-5501 localhost access to port 5501 | PASS | `assets/theme-v2/js/gamefoundry-partials.js` redirects localhost/127.0.0.1/::1 HTTP pages to port `5501` for non-Playwright human sessions; Playwright validates the redirect with `navigator.webdriver` set to false. |
+| Create wireframe-only pages for Achievements, Build Game, Saved Data, and Languages | PASS | Added full wireframe pages at `toolbox/achievements/index.html`, `toolbox/build-game/index.html`, `toolbox/saved-data/index.html`, and `toolbox/languages/index.html`. |
+| New wireframe pages include left, center, and right accordion panels with required controls | PASS | Playwright verifies each page has left/center/right columns, center accordions, and visible form controls. |
+| New wireframe controls are not wired to runtime code | PASS | Wireframe pages use static HTML controls and only shared Theme V2 scripts. No page-specific runtime wiring was added. |
+| No inline script, inline style, or inline event handlers | PASS | `rg -n "<script(?![^>]+src=)|<style[\\s>]|\\son(?:click|change|input|submit|keydown|keyup|load)=" -P ...` returned no matches. |
+
+## Impacted Lane
+
+- Toolbox/page validation.
+- Toolbox navigation/display behavior.
+- Shared Theme V2 display-mode image resolution.
+
+## Validation Evidence
+
+| Command | Result |
+| --- | --- |
+| `node --check assets/theme-v2/js/gamefoundry-partials.js; node --check assets/theme-v2/js/tool-display-mode.js; node --check toolbox/toolRegistry.js; node --check toolbox/tools-page-accordions.js; node --check tests/playwright/tools/ToolboxRoutePages.spec.mjs` | PASS |
+| `node scripts/validate-tool-registry.mjs` | PASS |
+| `rg -n "<script(?![^>]+src=)|<style[\\s>]|\\son(?:click|change|input|submit|keydown|keyup|load)=" -P toolbox/achievements/index.html toolbox/build-game/index.html toolbox/saved-data/index.html toolbox/languages/index.html toolbox/index.html` | PASS, no matches |
+| `git diff --check -- assets/theme-v2/css/status.css assets/theme-v2/js/gamefoundry-partials.js assets/theme-v2/js/tool-display-mode.js tests/playwright/tools/ToolboxRoutePages.spec.mjs toolbox/achievements/index.html toolbox/build-game/index.html toolbox/index.html toolbox/languages/index.html toolbox/saved-data/index.html toolbox/toolRegistry.js toolbox/tools-page-accordions.js` | PASS, line-ending warnings only |
+| `npx playwright test tests/playwright/tools/ToolboxRoutePages.spec.mjs --reporter=line` | PASS, 5/5 |
+| `npx playwright test tests/playwright/tools/ToolDisplayModeNavigation.spec.mjs --reporter=line` | PASS, 5/5 |
+
+## Skipped Lanes
+
+| Lane | Reason |
+| --- | --- |
+| Full samples validation | Explicitly skipped per request; no sample loader or shared sample framework changed. |
+| Full test suite | Not required for this targeted Toolbox/page PR. |
+| Non-Toolbox runtime lanes | Not affected; the PR only changes Toolbox registry/rendering, four static wireframe pages, Theme V2 display-mode image resolution, and the shared local dev port guard. |
+
+## Manual Test Notes
+
+- Verified branch before changes was `main`.
+- Verified effective active release-channel values with a Node registry audit: `planned`, `wireframe`, `beta`, and `complete` only.
+- Verified group labels remain separate from state badges by DOM/data attributes.
+- Verified the port guard is dev/local only and redirects human localhost sessions to `5501`; automated Playwright sessions are not redirected unless the test explicitly simulates a human browser.
+- The shared display-mode image resolver now respects explicit Theme V2 image paths such as `/assets/theme-v2/images/tools/build-game.png` before falling back to legacy folder resolution.
+