fix: bound sentinel dashboard panel heights

This commit is contained in:
Codex
2026-06-28 09:06:43 +00:00
parent 377e07c5a4
commit b57421560d
2 changed files with 66 additions and 5 deletions
@@ -549,11 +549,18 @@ select {
display: grid;
grid-template-columns: minmax(300px, 0.82fr) minmax(520px, 1.55fr);
gap: 10px;
align-items: stretch;
flex: 0 0 auto;
min-height: clamp(520px, calc(100dvh - 360px), 760px);
height: 80dvh;
max-height: 80dvh;
min-height: 0;
overflow: visible;
}
.workspace-grid > .pane {
height: 100%;
}
.pane {
position: relative;
isolation: isolate;
@@ -620,8 +627,9 @@ select {
.checks-panel {
flex: 0 0 auto;
max-height: none;
min-height: clamp(440px, 62dvh, 760px);
height: 80dvh;
max-height: 80dvh;
min-height: 0;
}
.checks-panel .filter-row select {
@@ -864,15 +872,23 @@ pre {
}
.workspace-grid {
height: auto;
max-height: none;
min-height: 0;
overflow: visible;
}
.workspace-grid > .pane {
height: auto;
}
.pane {
max-height: 72dvh;
max-height: 80dvh;
}
.checks-panel {
max-height: none;
height: 80dvh;
max-height: 80dvh;
}
.status-strip,
@@ -2320,6 +2320,35 @@ const dom = await page.evaluate(async ({ expectedRoutePrefix, expectedSentinelId
const latestDetailSummary = summarizeRows(latestDetailRows);
const workspaceRect = workspace?.getBoundingClientRect();
const checksRect = checksPanel?.getBoundingClientRect();
const heightSummary = (rect) => {
const viewportHeight = window.innerHeight || 1;
const heightPx = rect ? Math.round(rect.height) : null;
const ratio = rect ? Math.round((rect.height / viewportHeight) * 1000) / 1000 : null;
return {
present: Boolean(rect),
heightPx,
ratio,
targetPx: Math.round(viewportHeight * 0.8),
bounded80: Boolean(rect && rect.height <= viewportHeight * 0.82 + 1),
near80: Boolean(rect && rect.height >= viewportHeight * 0.74 && rect.height <= viewportHeight * 0.82 + 1),
};
};
const workspacePaneHeights = Array.from(document.querySelectorAll(".workspace-grid > .pane")).map((pane) => heightSummary(pane.getBoundingClientRect()));
const stackedWorkspace = window.matchMedia("(max-width: 1120px)").matches;
const panelHeights = {
viewportHeight: window.innerHeight,
stackedWorkspace,
workspace: heightSummary(workspaceRect),
checks: heightSummary(checksRect),
workspacePanes: workspacePaneHeights,
workspacePaneBounded: workspacePaneHeights.length >= 2 && workspacePaneHeights.every((item) => item.bounded80 === true),
workspaceOk: false,
checksOk: false,
};
panelHeights.workspaceOk = stackedWorkspace
? panelHeights.workspacePaneBounded === true
: panelHeights.workspace.near80 === true && panelHeights.workspacePaneBounded === true;
panelHeights.checksOk = panelHeights.checks.near80 === true;
const checkScope = {
present: Boolean(checksPanel),
scope: checksPanel?.getAttribute("data-check-scope") || null,
@@ -2439,6 +2468,7 @@ const dom = await page.evaluate(async ({ expectedRoutePrefix, expectedSentinelId
latestDetailSummary,
checkScope,
overviewSamples,
panelHeights,
scopeLabels: {
latestPointLegend: legendTexts.some((item) => item.includes("最新点")),
historicalSamples: legendTexts.some((item) => item.includes("历史样本累计")) || statusText.includes("历史错误样本"),
@@ -2629,6 +2659,8 @@ const ok = !navigationError
&& dom.scrollModel?.stickyHeader?.backgroundOpaque === true
&& dom.scrollModel?.stickyChecksHeader?.present === true
&& dom.scrollModel?.stickyChecksHeader?.backgroundOpaque === true
&& dom.panelHeights?.workspaceOk === true
&& dom.panelHeights?.checksOk === true
&& dom.layout?.horizontalOverflow !== true
&& pageErrors.length === 0;
@@ -4924,6 +4956,9 @@ function renderDashboardResult(result: Record<string, unknown>): string {
const runFilterObserved = record(runFilterProbe.observed);
const runFilterExpected = record(runFilterProbe.expected);
const overviewSamples = record(dom.overviewSamples);
const panelHeights = record(dom.panelHeights);
const workspaceHeight = record(panelHeights.workspace);
const checksHeight = record(panelHeights.checks);
const screenshot = record(result.screenshot);
const remote = record(result.remote);
const transport = record(result.transport);
@@ -4986,6 +5021,16 @@ function renderDashboardResult(result: Record<string, unknown>): string {
checkScope.fullWidth ?? "-",
]]),
"",
table(["WORKSPACE_H", "WORKSPACE_RATIO", "WORKSPACE_80", "CHECKS_H", "CHECKS_RATIO", "CHECKS_80", "PANES_80"], [[
`${workspaceHeight.heightPx ?? "-"}/${workspaceHeight.targetPx ?? "-"}`,
workspaceHeight.ratio ?? "-",
panelHeights.workspaceOk ?? "-",
`${checksHeight.heightPx ?? "-"}/${checksHeight.targetPx ?? "-"}`,
checksHeight.ratio ?? "-",
panelHeights.checksOk ?? "-",
panelHeights.workspacePaneBounded ?? "-",
]]),
"",
table(["FILTER_RUN", "FILTER_OPTION", "FILTER_TYPES", "FILTER_ALERT_TYPES", "FILTER_ERR", "FILTER_WARN", "FILTER_TOTAL", "FILTER_MATCH_DETAIL"], [[
runFilterProbe.targetRunId ?? "-",
runFilterProbe.requestedOptionPresent ?? "-",