refactor(*): 代码质量 - 优化前后端实现并完善协议与画布验证

This commit is contained in:
ddcat666
2026-10-08 19:38:57 +08:00
parent 9be3aa8235
commit 87ecb3000c
724 changed files with 3046 additions and 3885 deletions

View File

@@ -44,28 +44,52 @@ test("选择模型保留菜单及行内焦点,仍可通过 Escape 和外部点
expect(component).toContain('window.addEventListener("pointerdown", closeOnOutsidePointer, true)');
});
test("ModelPicker 样式独立加载,并保留模型列表的视口边界", async () => {
const [application, globals, pickerStyles] = await Promise.all([
test("ModelPicker 样式独立加载,所有入口继承可用高度约束", async () => {
const [application, globals, pickerStyles, component] = await Promise.all([
Bun.file(new URL("../src/application.tsx", import.meta.url)).text(),
Bun.file(new URL("../src/styles/globals.css", import.meta.url)).text(),
Bun.file(new URL("../src/styles/shared/model-picker.css", import.meta.url)).text(),
Bun.file(new URL("../src/components/model-picker.tsx", import.meta.url)).text(),
]);
expect(application).toContain('import "./styles/shared/model-picker.css";');
expect(globals).not.toContain("canvas-model-picker");
expect(pickerStyles).toContain(".canvas-model-picker-menu {");
expect(pickerStyles).toContain("max-height: min(420px, calc(100vh - 32px));");
const creationMenu = pickerStyles.match(/\.creation-model-picker-menu \{([\s\S]*?)\}/)?.[1] || "";
expect(creationMenu).toContain("max-height: min(460px, calc(100vh - 24px));");
expect(creationMenu).toContain("overflow-y: auto;");
expect(pickerStyles).toContain(".app-user-workspace .creation-model-picker-menu.is-brand-list");
expect(pickerStyles).toContain(".creation-model-picker-surface .creation-model-picker-menu.is-model-list");
expect(pickerStyles).toContain(".creation-model-picker-surface .creation-model-picker-menu.is-brand-list");
const menu = pickerStyles.match(/\.canvas-model-picker-menu\s*\{([^}]+)\}/)?.[1] || "";
expect(menu).toMatch(/display:\s*flex\s*;/);
expect(menu).toMatch(/flex-direction:\s*column\s*;/);
const maxHeight = menu.match(/max-height:\s*([^;]+);/)?.[1] || "";
expect(maxHeight).toContain("min(");
expect(maxHeight).toContain("100dvh");
expect(maxHeight).toContain("var(--canvas-model-picker-available-height)");
expect(menu).toMatch(/overflow-y:\s*auto\s*;/);
expect(component).toContain('"--canvas-model-picker-available-height": `${availableHeight}px`');
const modelList = pickerStyles.match(/\.creation-model-picker-surface \.creation-model-picker-menu\.is-model-list \{([\s\S]*?)\}/)?.[1] || "";
expect(modelList).toContain("max-height: min(460px, calc(100vh - 24px)) !important;");
expect(modelList).toContain("overflow-y: auto !important;");
expect(pickerStyles).not.toContain(".app-user-workspace .creation-model-picker-menu {");
expect(pickerStyles).not.toContain(".creation-model-picker-surface .creation-model-picker-menu {");
// portal 和工作区覆盖只负责外观,不能重新取消共享菜单的高度或滚动限制。
const overrides = [...pickerStyles.matchAll(/[^{}]*\.creation-model-picker-menu(?:\.is-(?:brand|model)-list)?\s*\{([^}]+)\}/g)];
expect(overrides.length).toBeGreaterThan(0);
for (const [, declarations] of overrides) {
expect(declarations).not.toMatch(/(?:max-)?height\s*:/);
expect(declarations).not.toMatch(/overflow(?:-y)?\s*:\s*visible/);
}
});
test("模型和渠道分别滚动,外层双栏不被长列表撑高", async () => {
const pickerStyles = await Bun.file(new URL("../src/styles/shared/model-picker.css", import.meta.url)).text();
const modelList = pickerStyles.match(/\.canvas-model-picker-menu\.is-model-list\s*\{([^}]+)\}/)?.[1] || "";
expect(modelList).toMatch(/overflow:\s*hidden\s*;/);
const twoPane = pickerStyles.match(/\.canvas-model-picker-two-pane\s*\{([^}]+)\}/)?.[1] || "";
expect(twoPane).toMatch(/grid-template-rows:\s*minmax\(0,\s*1fr\)\s*;/);
expect(twoPane).toMatch(/min-height:\s*0\s*;/);
expect(twoPane).toMatch(/overflow:\s*hidden\s*;/);
expect(twoPane).not.toMatch(/align-items:\s*(?:start|flex-start)/);
const brandRail = pickerStyles.match(/\.canvas-model-picker-menu\.is-model-list\s+\.canvas-model-picker-brand-rail\s*\{([^}]+)\}/)?.[1] || "";
const modelPane = pickerStyles.match(/\.canvas-model-picker-model-pane\s*\{([^}]+)\}/)?.[1] || "";
for (const pane of [brandRail, modelPane]) {
expect(pane).toMatch(/min-height:\s*0\s*;/);
expect(pane).toMatch(/overflow-x:\s*hidden\s*;/);
expect(pane).toMatch(/overflow-y:\s*auto\s*;/);
}
});