推进 INI 面板 control view renderer helper

This commit is contained in:
2026-06-14 22:52:21 +08:00
parent 74617cc3fa
commit 27d2316f78
7 changed files with 263 additions and 41 deletions

View File

@@ -6,12 +6,10 @@
</head>
<body>
<pre id="status">running</pre>
<div id="control-view">
<div id="control-status"></div>
<div id="control-sections"></div>
</div>
<div id="control-view"></div>
<script type="module">
import { createLinuxCncIniSdk } from "../../runtime/sdk/src/index.js";
import { renderMachineSessionControlView } from "../../runtime/ui/ini-panel/control-view-renderer.js";
import { loadTextFile, saveTextFile } from "../../runtime/opfs/file-service.js";
import {
gcodeProgramPath,
@@ -80,34 +78,6 @@
return frame.contentDocument;
}
function renderControlView(containerDocument, view) {
const statusNode = containerDocument.getElementById("control-status");
const sectionsNode = containerDocument.getElementById("control-sections");
statusNode.textContent = [
view.status.lastAction ?? "-",
view.status.runStatus ?? "-",
view.status.error ?? "-",
].join(" | ");
sectionsNode.textContent = "";
for (const section of view.sections) {
const sectionNode = containerDocument.createElement("section");
sectionNode.dataset.sectionId = section.id;
const heading = containerDocument.createElement("h2");
heading.textContent = section.title;
sectionNode.appendChild(heading);
const list = containerDocument.createElement("dl");
for (const row of section.rows) {
const term = containerDocument.createElement("dt");
term.textContent = row.label;
const def = containerDocument.createElement("dd");
def.textContent = String(row.value ?? "-");
list.append(term, def);
}
sectionNode.appendChild(list);
sectionsNode.appendChild(sectionNode);
}
}
try {
const ini = await createLinuxCncIniSdk();
const wasmPath = "/work/browser-smoke.ini";
@@ -405,7 +375,8 @@ TOOL_TABLE = browser-tool.tbl
!uiApi?.getMachineSessionStateBundle ||
!uiApi?.getMachineSessionStateReport ||
!uiApi?.getMachineSessionStateReportExport ||
!uiApi?.getMachineSessionWorkflowStatus
!uiApi?.getMachineSessionWorkflowStatus ||
!uiApi?.renderMachineSessionControlView
) {
throw new Error("INI panel API namespace did not expose state getters");
}
@@ -864,7 +835,10 @@ TOOL_TABLE = browser-tool.tbl
"UI legacy machine session state bundle getter matches API namespace",
);
const machineSessionControlView = uiApi.getMachineSessionControlView();
renderControlView(document, machineSessionControlView);
const renderedControlView = renderMachineSessionControlView(
document.getElementById("control-view"),
machineSessionControlView,
);
assertEqual(
machineSessionControlView.status.runStatus,
"ok",
@@ -886,20 +860,33 @@ TOOL_TABLE = browser-tool.tbl
"UI machine session control view canonical event row",
);
assertEqual(
document.getElementById("control-status").textContent,
renderedControlView.statusNode.textContent,
"run-gcode | ok | -",
"UI machine session control view DOM status",
);
assertEqual(
document.getElementById("control-sections").querySelectorAll("section").length,
renderedControlView.sectionsNode.querySelectorAll("section").length,
3,
"UI machine session control view DOM section count",
);
assertEqual(
document.getElementById("control-sections").querySelector('section[data-section-id=\"run\"] dd:nth-of-type(2)').textContent,
renderedControlView.sectionsNode.querySelector('section[data-section-id=\"run\"] dd:nth-of-type(2)').textContent,
"2",
"UI machine session control view DOM canonical event row",
);
const uiRenderedControlView = uiApi.renderMachineSessionControlView(
uiDocument.getElementById("machine-session-control-view"),
);
assertEqual(
uiRenderedControlView.statusNode.textContent,
"run-gcode | ok | -",
"UI machine session built-in control view DOM status",
);
assertEqual(
uiRenderedControlView.sectionsNode.querySelector('section[data-section-id=\"run\"] dd:nth-of-type(2)').textContent,
"2",
"UI machine session built-in control view canonical event row",
);
assertEqual(
uiDocument.defaultView.getMachineSessionControlView().status.lastAction,
machineSessionControlView.status.lastAction,