vultr/openclaw
1
0
Fork 0
mirror of https://github.com/openclaw/openclaw.git synced 2026-05-06 05:40:44 +00:00
Code Issues Packages Projects Releases Wiki Activity

test: fold chat context browser check

Browse Source
This commit is contained in:
Peter Steinberger
2026-04-17 18:47:00 +01:00
parent aaf9064a75
commit bbac7773ff
2 changed files with 18 additions and 123 deletions
Download Patch File Download Diff File Expand all files Collapse all files

123
ui/src/ui/views/chat.browser.test.ts
View File

@@ -1,123 +0,0 @@
import { render } from "lit";
import { afterEach, describe, expect, it } from "vitest";
import "../../test-helpers/load-styles.ts";
import { renderChat, type ChatProps } from "./chat.ts";
const contextNoticeSessions: ChatProps["sessions"] = {
ts: 0,
path: "",
count: 1,
defaults: { modelProvider: "openai", model: "gpt-5", contextTokens: null },
sessions: [
{
key: "main",
kind: "direct",
updatedAt: null,
totalTokens: 3_800,
inputTokens: 3_800,
contextTokens: 4_000,
},
],
};
function createProps(overrides: Partial<ChatProps> = {}): ChatProps {
return {
sessionKey: "main",
onSessionKeyChange: () => undefined,
thinkingLevel: null,
showThinking: false,
showToolCalls: true,
loading: false,
sending: false,
canAbort: false,
compactionStatus: null,
fallbackStatus: null,
messages: [],
toolMessages: [],
streamSegments: [],
stream: null,
streamStartedAt: null,
assistantAvatarUrl: null,
draft: "",
queue: [],
connected: true,
canSend: true,
disabledReason: null,
error: null,
sessions: {
ts: 0,
path: "",
count: 1,
defaults: { modelProvider: "openai", model: "gpt-5", contextTokens: null },
sessions: [
{
key: "main",
kind: "direct",
updatedAt: null,
inputTokens: 3_800,
contextTokens: 4_000,
},
],
},
focusMode: false,
assistantName: "OpenClaw",
assistantAvatar: null,
onRefresh: () => undefined,
onToggleFocusMode: () => undefined,
onDraftChange: () => undefined,
onSend: () => undefined,
onQueueRemove: () => undefined,
onNewSession: () => undefined,
agentsList: null,
currentAgentId: "",
onAgentChange: () => undefined,
...overrides,
};
}
async function renderContextNoticeChat() {
const container = document.createElement("div");
document.body.append(container);
render(
renderChat(
createProps({
sessions: contextNoticeSessions,
}),
),
container,
);
await new Promise<void>((resolve) => requestAnimationFrame(() => resolve()));
return container;
}
describe("chat context notice", () => {
afterEach(() => {
document.body.innerHTML = "";
document.documentElement.style.removeProperty("--warn");
document.documentElement.style.removeProperty("--danger");
});
it("renders robust notice colors and badge-sized warning icon", async () => {
document.documentElement.style.setProperty("--warn", "rgb(1, 2, 3)");
document.documentElement.style.setProperty("--danger", "tomato");
const container = await renderContextNoticeChat();
const notice = container.querySelector<HTMLElement>(".context-notice");
expect(notice).not.toBeNull();
expect(notice?.style.getPropertyValue("--ctx-color")).toContain("rgb(");
expect(notice?.style.getPropertyValue("--ctx-color")).not.toContain("NaN");
expect(notice?.style.getPropertyValue("--ctx-bg")).not.toContain("NaN");
const icon = container.querySelector<SVGElement>(".context-notice__icon");
expect(icon).not.toBeNull();
if (!icon) {
return;
}
expect(icon.tagName.toLowerCase()).toBe("svg");
expect(icon.classList.contains("context-notice__icon")).toBe(true);
expect(icon.getAttribute("width")).toBe("16");
expect(icon.getAttribute("height")).toBe("16");
expect(icon.querySelector("path")).not.toBeNull();
});
});

18
ui/src/ui/views/chat.test.ts
View File

@@ -143,6 +143,8 @@ describe("chat view", () => {
it("renders the context notice only for fresh high current usage", () => {
const container = document.createElement("div");
document.documentElement.style.setProperty("--warn", "rgb(1, 2, 3)");
document.documentElement.style.setProperty("--danger", "tomato");
const renderWithSession = (session: NonNullable<ChatProps["sessions"]>["sessions"][number]) =>
render(
@@ -182,6 +184,22 @@ describe("chat view", () => {
expect(container.textContent).toContain("95% context used");
expect(container.textContent).toContain("190k / 200k");
expect(container.textContent).not.toContain("757.3k / 200k");
const notice = container.querySelector<HTMLElement>(".context-notice");
expect(notice).not.toBeNull();
expect(notice?.style.getPropertyValue("--ctx-color")).toContain("rgb(");
expect(notice?.style.getPropertyValue("--ctx-color")).not.toContain("NaN");
expect(notice?.style.getPropertyValue("--ctx-bg")).not.toContain("NaN");
const icon = container.querySelector<SVGElement>(".context-notice__icon");
expect(icon).not.toBeNull();
expect(icon?.tagName.toLowerCase()).toBe("svg");
expect(icon?.classList.contains("context-notice__icon")).toBe(true);
expect(icon?.getAttribute("width")).toBe("16");
expect(icon?.getAttribute("height")).toBe("16");
expect(icon?.querySelector("path")).not.toBeNull();
document.documentElement.style.removeProperty("--warn");
document.documentElement.style.removeProperty("--danger");
renderWithSession({
key: "main",