revert(inspect-ui): drop HtmlPanel + html tab

Removes the iframe-based HTML viewer and its before/after tab wiring
from RunDetail.
This commit is contained in:
pj committed 2026-04-27 19:55:32 +07:00
1 parent 77ee3ef641
commit a597be9267
3 files changed
-164

No files matched your search

-60
View File
@@ -1,60 +0,0 @@
.html-panel {
display: flex;
flex-direction: column;
gap: 8px;
}
.html-toolbar {
display: flex;
gap: 4px;
}
.html-tab {
font-family: var(--font-mono);
font-size: 12px;
padding: 2px 10px;
background: var(--surface-1);
border: 1px solid var(--border);
color: var(--text-secondary);
cursor: pointer;
}
.html-tab-active {
color: var(--text-primary);
border-color: var(--border-strong, var(--border));
}
.html-frame {
width: 100%;
height: 480px;
border: 1px solid var(--border);
background: white;
}
.html-source {
font-family: var(--font-mono);
font-size: 11px;
color: var(--text-primary);
background: var(--surface-1);
border: 1px solid var(--border);
padding: 8px;
margin: 0;
max-height: 480px;
overflow: auto;
white-space: pre-wrap;
word-break: break-all;
}
.html-empty {
font-family: var(--font-mono);
font-size: 12px;
color: var(--text-secondary);
padding: 16px;
}
.html-error {
font-family: var(--font-mono);
font-size: 12px;
color: var(--text-violation, #c33);
padding: 16px;
}
-73
View File
@@ -1,73 +0,0 @@
import { useEffect, useState } from "react";
import { htmlUrl } from "../api";
import "./HtmlPanel.css";
interface HtmlPanelProps {
runId: string;
fileName: string;
available: boolean;
}
type ViewMode = "render" | "source";
export default function HtmlPanel({ runId, fileName, available }: HtmlPanelProps): JSX.Element {
const [mode, setMode] = useState<ViewMode>("render");
const [source, setSource] = useState<string | null>(null);
const [error, setError] = useState<string | null>(null);
const url = htmlUrl(runId, fileName);
useEffect(() => {
if (!available || mode !== "source") return;
let cancelled = false;
setSource(null);
setError(null);
fetch(url)
.then((response) => {
if (!response.ok) throw new Error(`${response.status} ${response.statusText}`);
return response.text();
})
.then((text) => {
if (!cancelled) setSource(text);
})
.catch((failure: unknown) => {
if (!cancelled) setError(failure instanceof Error ? failure.message : String(failure));
});
return () => {
cancelled = true;
};
}, [available, mode, url]);
if (!available) {
return <div className="html-empty">no html captured for this step</div>;
}
return (
<div className="html-panel">
<div className="html-toolbar">
<button
type="button"
className={mode === "render" ? "html-tab html-tab-active" : "html-tab"}
onClick={() => setMode("render")}
>
render
</button>
<button
type="button"
className={mode === "source" ? "html-tab html-tab-active" : "html-tab"}
onClick={() => setMode("source")}
>
source
</button>
</div>
{mode === "render" ? (
<iframe className="html-frame" src={url} sandbox="" title={fileName} />
) : error ? (
<div className="html-error">failed to load: {error}</div>
) : source === null ? (
<div className="html-empty">loading...</div>
) : (
<pre className="html-source">{source}</pre>
)}
</div>
);
}
-31
View File
@@ -4,7 +4,6 @@ import { getRun, getStep, screenshotUrl } from "../api";
import type { Run, Step } from "../types";
import ActionList from "../panels/ActionList";
import HierarchyPanel from "../panels/HierarchyPanel";
import HtmlPanel from "../panels/HtmlPanel";
import Screenshot from "../panels/Screenshot";
import SnapshotTable from "../panels/SnapshotTable";
import ViolationsPanel from "../panels/ViolationsPanel";
@@ -142,21 +141,6 @@ export default function RunDetail() {
label: "Hierarchy",
content: <HierarchyPanel hierarchy={currentStep?.hierarchy} />,
},
...(runId && currentStep?.html_available
? [
{
id: "html",
label: "HTML",
content: (
<HtmlPanel
runId={runId}
fileName={`step-${String(currentStep.step).padStart(5, "0")}.html`}
available
/>
),
} satisfies TabDefinition,
]
: []),
{
id: "properties",
label: "Properties",
@@ -213,21 +197,6 @@ export default function RunDetail() {
label: "Hierarchy",
content: <HierarchyPanel hierarchy={nextStep?.hierarchy ?? currentStep?.hierarchy} />,
},
...(runId && currentStep?.html_available
? [
{
id: "html",
label: "HTML",
content: (
<HtmlPanel
runId={runId}
fileName={`step-${String(currentStep.step).padStart(5, "0")}-after.html`}
available
/>
),
} satisfies TabDefinition,
]
: []),
{
id: "properties",
label: "Properties",