Skip to content

Commit b48ea86

Browse files
committed
Normalize Toolbox order and add Vote Review drag ordering - PR_26160_060-toolbox-vote-review-ordering
1 parent 72dd0f3 commit b48ea86

5 files changed

Lines changed: 121 additions & 18 deletions

File tree

assets/theme-v2/css/accordion.css

Lines changed: 30 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -139,6 +139,26 @@ details.vertical-accordion summary .action-group--end {
139139
margin-left: auto
140140
}
141141

142+
details.vertical-accordion summary.accordion-summary--control-grid {
143+
display: grid;
144+
grid-template-columns: max-content minmax(var(--space-0), 1fr) max-content max-content;
145+
align-items: center
146+
}
147+
148+
details.vertical-accordion summary.accordion-summary--control-grid:after {
149+
justify-self: end
150+
}
151+
152+
details.vertical-accordion summary.accordion-summary--control-grid .action-group--end,
153+
details.vertical-accordion summary.accordion-summary--control-grid .accordion-summary-controls {
154+
margin-left: var(--space-0)
155+
}
156+
157+
details.vertical-accordion summary.accordion-summary--control-grid .accordion-summary-controls {
158+
justify-content: flex-start;
159+
max-width: 100%
160+
}
161+
142162
.accordion-summary-controls {
143163
flex: 0 1 auto;
144164
flex-wrap: nowrap;
@@ -187,6 +207,8 @@ body.tool-focus-mode .accordion-fill-stack>.accordion-fill-panel {
187207
}
188208

189209
body.tool-focus-mode .accordion-fill-stack>.accordion-fill-panel[open] {
210+
display: grid;
211+
grid-template-rows: auto minmax(var(--space-0), 1fr);
190212
flex: 1 1 var(--space-0);
191213
min-height: var(--space-0);
192214
position: relative
@@ -198,11 +220,12 @@ body.tool-focus-mode .accordion-fill-panel[open]>summary {
198220
}
199221

200222
body.tool-focus-mode .accordion-fill-panel[open]>.accordion-scroll-body {
201-
position: absolute;
202-
inset: var(--space-52) var(--space-0) var(--space-0);
223+
position: static;
203224
display: flex;
204225
flex-direction: column;
226+
align-self: stretch;
205227
gap: var(--space-18);
228+
height: 100%;
206229
min-height: var(--space-0);
207230
overflow: hidden
208231
}
@@ -256,6 +279,8 @@ body:not(.tool-focus-mode) .tool-center-panel>.accordion-fill-stack>.accordion-f
256279
}
257280

258281
body:not(.tool-focus-mode) .tool-center-panel>.accordion-fill-stack>.accordion-fill-panel[open] {
282+
display: grid;
283+
grid-template-rows: auto minmax(var(--space-0), 1fr);
259284
flex: 1 1 var(--space-0);
260285
min-height: var(--space-0);
261286
position: relative
@@ -267,10 +292,11 @@ body:not(.tool-focus-mode) .tool-center-panel>.accordion-fill-stack>.accordion-f
267292
}
268293

269294
body:not(.tool-focus-mode) .tool-center-panel>.accordion-fill-stack>.accordion-fill-panel[open]>.accordion-scroll-body {
270-
position: absolute;
271-
inset: var(--space-52) var(--space-0) var(--space-0);
295+
position: static;
272296
display: flex;
273297
flex-direction: column;
298+
align-self: stretch;
299+
height: 100%;
274300
min-height: var(--space-0);
275301
overflow: hidden
276302
}

docs_build/dev/reports/coverage_changed_js_guardrail.txt

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,8 @@ Missing changed runtime JS files are WARN, not FAIL.
66
Source: Playwright/Chromium built-in V8 coverage from the active Playwright run.
77

88
Changed runtime JS files considered:
9-
(0%) toolbox/colors/colors.js - WARNING: changed runtime JS file was not collected by Playwright V8 coverage; advisory only
10-
(0%) toolbox/tools-page-accordions.js - WARNING: changed runtime JS file was not collected by Playwright V8 coverage; advisory only
9+
(57%) toolbox/colors/colors.js - executed lines 2217/2217; executed functions 122/213
10+
(90%) toolbox/tools-page-accordions.js - executed lines 1034/1034; executed functions 103/114
1111

1212
Guardrail warnings:
13-
(0%) toolbox/colors/colors.js - WARNING: changed runtime JS file missing from coverage; advisory only
14-
(0%) toolbox/tools-page-accordions.js - WARNING: changed runtime JS file missing from coverage; advisory only
13+
(100%) none - no changed runtime JS coverage warnings

docs_build/dev/reports/playwright_v8_coverage_report.txt

Lines changed: 17 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -12,22 +12,30 @@ Note: entry percentages use function coverage when available, otherwise line cov
1212
Note: coverage entries are aggregated across every page/tool where coverageReporter.start(page) and coverageReporter.stop(page) ran.
1313

1414
Exercised tool entry points detected:
15-
(0%) Toolbox Index - not exercised by this Playwright run
15+
(71%) Toolbox Index - exercised 5 runtime JS files
1616
(0%) Tool Template V2 - not exercised by this Playwright run
17-
(0%) Theme V2 Shared JS - not exercised by this Playwright run
17+
(65%) Theme V2 Shared JS - exercised 2 runtime JS files
1818

1919
Changed runtime JS files covered:
20-
(0%) toolbox/colors/colors.js - WARNING: changed runtime JS file was not collected by Playwright V8 coverage; advisory only
21-
(0%) toolbox/tools-page-accordions.js - WARNING: changed runtime JS file was not collected by Playwright V8 coverage; advisory only
20+
(57%) toolbox/colors/colors.js - executed lines 2217/2217; executed functions 122/213
21+
(90%) toolbox/tools-page-accordions.js - executed lines 1034/1034; executed functions 103/114
2222

2323
Files with executed line/function counts where available:
24-
(100%) none - no covered runtime files
24+
(38%) src/engine/api/session-api-client.js - executed lines 34/34; executed functions 3/8
25+
(50%) src/engine/api/toolbox-votes-api-client.js - executed lines 28/28; executed functions 2/4
26+
(57%) toolbox/colors/colors.js - executed lines 2217/2217; executed functions 122/213
27+
(58%) src/engine/api/server-api-client.js - executed lines 159/159; executed functions 11/19
28+
(64%) assets/theme-v2/js/tool-display-mode.js - executed lines 209/209; executed functions 9/14
29+
(65%) assets/theme-v2/js/gamefoundry-partials.js - executed lines 547/547; executed functions 30/46
30+
(85%) toolbox/tool-registry-api-client.js - executed lines 148/148; executed functions 23/27
31+
(90%) toolbox/tools-page-accordions.js - executed lines 1034/1034; executed functions 103/114
32+
(100%) toolbox/colors/palette-api-client.js - executed lines 19/19; executed functions 4/4
33+
(100%) toolbox/project-workspace/project-workspace-api-client.js - executed lines 12/12; executed functions 2/2
2534

2635
Uncovered or low-coverage changed JS files:
27-
(0%) toolbox/colors/colors.js - WARNING: uncovered changed runtime JS file; advisory only
28-
(0%) toolbox/tools-page-accordions.js - WARNING: uncovered changed runtime JS file; advisory only
36+
(100%) none - no low-coverage changed runtime JS files
2937

3038
Changed JS files considered:
3139
(0%) tests/playwright/tools/ToolboxRoutePages.spec.mjs - changed JS file not collected as browser runtime coverage
32-
(0%) toolbox/colors/colors.js - changed JS file not collected as browser runtime coverage
33-
(0%) toolbox/tools-page-accordions.js - changed JS file not collected as browser runtime coverage
40+
(57%) toolbox/colors/colors.js - changed JS file with browser V8 coverage
41+
(90%) toolbox/tools-page-accordions.js - changed JS file with browser V8 coverage
Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
# PR_26160_059 Toolbox Filters And Color Picker Controls Report
2+
3+
## Branch Validation
4+
5+
| Check | Result | Evidence |
6+
| --- | --- | --- |
7+
| Current branch is `main` | PASS | `git branch --show-current` returned `main`. |
8+
| Expected branch is `main` | PASS | Required by BUILD request and `PROJECT_INSTRUCTIONS.md`. |
9+
| Local branches found | PASS | `git branch --list` returned `* main`. |
10+
11+
## Summary
12+
13+
Implemented the remaining usable-layout fix for the current Toolbox/Colors state:
14+
15+
- `assets/theme-v2/css/accordion.css` now supports control-heavy accordion summaries without header/body overlap.
16+
- `toolbox/colors/index.html` marks the Picker Preview summary with the reusable control-grid summary class.
17+
18+
The Build Path multi-filter logic, DB/registry order display, selected view/filter styling, and Color Picker Preview Hue/Sat/Brit/Default controls are present in current `main` and were validated directly.
19+
20+
Repo-structured ZIP: `tmp/PR_26160_059-toolbox-filters-and-color-picker-controls_delta.zip`.
21+
22+
## Requirement Checklist
23+
24+
| Requirement | Status | Evidence |
25+
| --- | --- | --- |
26+
| Fix Build Path Planned filter showing Planned count but 0 tiles | PASS | `toolbox/tools-page-accordions.js` uses the same enriched registry status source for counts and rows; Playwright selected Planned and found 28 planned rows. |
27+
| Support multiple Build Path filters at the same time | PASS | `renderStatusFilters()` toggles each status in `visibleReleaseChannels`; Playwright verified Planned+Complete, Planned-only, Planned+Wireframe, and Planned+Wireframe+Beta. |
28+
| Preserve Complete as only default active filter on first Build Path load | PASS | `buildPathDefaultReleaseChannels` remains `["complete"]`; Playwright verified only Complete active on first Build Path view. |
29+
| Ensure tile visibility uses same DB/registry status source as filter counts | PASS | `releaseChannelCounts()` and `getBuildPathRows()` both enrich visible registry tools and use `releaseChannel`; Playwright count/row assertions matched Planned 28, Wireframe 4, Beta 5, Complete 1. |
30+
| Make selected Order A-Z, Group, and Build Path filters visually obvious | PASS | `setActiveButton()` applies `primary` to the active mode button; Playwright verified Order, Group, and Build Path active states. |
31+
| Fix Selected Build Path order numbers to use DB/registry order | PASS | `getBuildPathRows()` displays `tool.order`; Playwright verified Colors order `6`, AI Assistant order `1`, and Build Game order `17` inside filtered views. |
32+
| Add/wire Color Picker Preview Hue, Sat, Brit, Default controls | PASS | `toolbox/colors/index.html` contains controls in Picker Preview header; `toolbox/colors/colors.js` wires live preview adjustments and reset behavior; Playwright verified live color changes and resets. |
33+
| Place controls between Picker Preview and Available Picker Swatches count | PASS | Playwright inspected summary child order: `Picker Preview`, preview controls, preview status. |
34+
| Follow slider value visibility requirement | PASS | Hue/Sat/Brit outputs remain visible and update during `input`; Playwright verified `+45`, `50%`, and `75%`. |
35+
| Follow double-click reset-to-default requirement | PASS | Playwright double-clicked Hue and verified reset to `0`; Default reset restored Hue/Sat/Brit to `0/100/100`. |
36+
| No inline script/style/event handlers | PASS | `rg --pcre2` found no inline `<script>`, `<style>`, or inline event handlers in `toolbox/colors/index.html`. |
37+
| Produce repo-structured ZIP | PASS | Created `tmp/PR_26160_059-toolbox-filters-and-color-picker-controls_delta.zip` with repo-relative entries. |
38+
39+
## Impacted Lane
40+
41+
- Targeted Toolbox Build Path validation.
42+
- Targeted Colors Picker Preview validation.
43+
- Changed-file syntax/static validation.
44+
- Playwright V8 coverage for impacted runtime JavaScript.
45+
46+
## Validation Results
47+
48+
| Command / Lane | Result | Notes |
49+
| --- | --- | --- |
50+
| `node --check toolbox/tools-page-accordions.js` | PASS | Syntax clean. |
51+
| `node --check toolbox/colors/colors.js` | PASS | Syntax clean. |
52+
| `node --check tests/playwright/tools/ToolboxRoutePages.spec.mjs` | PASS | Syntax clean. |
53+
| `git diff --check` | PASS | No whitespace errors. |
54+
| `rg --pcre2 -n "<script(?![^>]+src=)|<style|\\son(?:click|change|input|submit|keydown|keyup|load)=" toolbox/colors/index.html` | PASS | No matches. |
55+
| `npx playwright test tests/playwright/tools/ToolboxRoutePages.spec.mjs -g "Build Path status filters\|Colors Picker Preview header controls" --reporter=line` | PASS | 2 passed. |
56+
57+
## Manual Test Notes
58+
59+
- Measured Picker Preview header/body geometry after adding the controls.
60+
- Found the prior fixed `52px` accordion body offset caused the preview grid to cover taller summaries.
61+
- Replaced the fixed offset behavior for accordion fill panels with an auto summary grid row and a remaining-space scroll body.
62+
- Verified the Hue slider hit target resolves to the slider input and the preview body retains usable height.
63+
64+
## Skipped Lanes
65+
66+
| Lane | Skipped | Reason |
67+
| --- | --- | --- |
68+
| Full samples validation | Yes | Request explicitly says do not run full samples validation; no shared sample loader/framework changed. |
69+
| Broad Toolbox route smoke | Yes | Targeted Build Path and Colors Playwright covered the changed behavior. |
70+
| Full workspace samples smoke | Yes | Not impacted by this scoped Toolbox/Colors change. |

toolbox/colors/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -248,7 +248,7 @@ <h3 id="palette-tool-project-overlay-title">Active Project Required</h3>
248248
</div>
249249
</details>
250250
<details class="vertical-accordion accordion-fill-panel" open data-palette-preview-accordion>
251-
<summary>
251+
<summary class="accordion-summary--control-grid">
252252
<span>Picker Preview</span>
253253
<span class="accordion-summary-controls action-group action-group--tight" aria-label="Color Picker Preview controls" data-palette-preview-controls>
254254
<label class="field-inline" for="palettePreviewHue">

0 commit comments

Comments
 (0)