Three things the unified Settings window was still missing next to v4's own, all found by looking at it next to v4 rather than in isolation: - The sidebar is a 52px icon rail now, expanding to a full list on hover/focus and overlaying the content instead of a splitPane's permanently-docked two-pane shape -- v4's own sidebar, not an approximation of it. Fixing this surfaced two real CSS bugs along the way: filterList's own min-width:220px silently defeated the collapse (clipping the search box to "Sear" instead of showing an icon), and .cx-filter-list's unset overflow-x (computed to auto once overflow-y was set) put a horizontal scrollbar under it. Centering the icon in the collapsed row needed the label's flex-basis AND the row's own gap to both go to zero -- an invisible label still claims its share of both otherwise, and the icon renders off-centre. - The modal now has a real height (v4's own 660px) rather than sizing to whichever section is showing, so switching between a short section (About) and a long one (Node packs) doesn't visibly resize the whole window. That exposed a THIRD latent bug: .cx-modal-body never had flex:1 1 auto, invisible until a modal had a real height to fill -- every prior modal shrink-wrapped its content, so head+body+foot always summed to exactly the card's height by accident. Fixed at the shared rule, not just for Settings. - About now shows what v4's does: commit and dirty state, a codename when the checkout has one, and the machine's real hardware/software facts (chip, memory, GPU or MPS, disk, OS, ComfyUI/Python/Torch/ attention-backend versions, hostname) -- a new core/sysinfo.py (ported from v4's own, individually guarded so a missing probe never takes the panel down) behind a new GET /funpack/api/system, injected into settings_window.js the same way every other network call here is. Also: a nav row's tone (the coloured icon chip) is now validated against its closed set the same way button.js already validates its own tone -- an unknown one used to render silently wrong instead of failing loudly.
42 lines
1.8 KiB
JavaScript
42 lines
1.8 KiB
JavaScript
/**
|
|
* Every settings surface (pipeline, updates, node packs, log, temp files)
|
|
* lives behind ONE Settings button now, found by name in its searchable list.
|
|
*/
|
|
export async function openSettingsSection(page, name) {
|
|
await page.getByRole("button", { name: "Settings" }).click();
|
|
await page.locator(".cx-filter-row", { hasText: name }).click();
|
|
// The sidebar is a hover-expanding rail now (v4's own behaviour): leaving
|
|
// the mouse where the click landed keeps it open, overlaying the content
|
|
// every caller is about to interact with -- exactly what a real person's
|
|
// mouse does NOT do once they move on to the thing they picked. Hovering
|
|
// the section's own head (never under the rail, whatever the viewport) is
|
|
// what actually collapses it, at any width a test runs at.
|
|
await page.locator(".cx-modal-head").hover();
|
|
}
|
|
|
|
/** The window moved into the unified Settings window when the app grew one. */
|
|
export async function openPipelineWindow(page) {
|
|
await openSettingsSection(page, "Models and pipeline");
|
|
}
|
|
|
|
/**
|
|
* The control that shows and hides a docked region.
|
|
*
|
|
* It used to be a glyph in a rail on the outer edge of the window; it is a
|
|
* named button in the timeline head now, which is where v4 keeps it. Written
|
|
* once here because six tests press it and none of them are about where it is.
|
|
*/
|
|
export const regionToggle = (page, name) =>
|
|
page.locator(".cx-panel-head").getByRole("button", { name, exact: true });
|
|
|
|
/**
|
|
* The same toggle from the menu bar, which nothing can cover.
|
|
*
|
|
* The way in and out at a width where the panels overlay the centre -- the
|
|
* named buttons live in the timeline head, and that is what gets covered.
|
|
*/
|
|
export const menuToggle = (page, region) => async () => {
|
|
await page.getByRole("button", { name: "View" }).click();
|
|
await page.getByRole("menuitem", { name: new RegExp(`(Show|Hide) ${region}`) }).click();
|
|
};
|