test: tighten render assertions

This commit is contained in:
Erik Kotsiuba
2026-04-25 21:40:09 +02:00
parent 42f7092899
commit 8ea067dcde
4 changed files with 57 additions and 110 deletions
-1
View File
@@ -212,7 +212,6 @@ function wrapDelimitedFooterHints(footer: string, width: number): string[] {
lines.push(...wrappedChunk); lines.push(...wrappedChunk);
return lines; return lines;
} }
lines.push(current);
lines.push(...wrappedChunk); lines.push(...wrappedChunk);
return lines; return lines;
}, []); }, []);
-32
View File
@@ -1,32 +0,0 @@
import assert from "node:assert/strict";
import { readdirSync, readFileSync } from "node:fs";
import path from "node:path";
import test from "node:test";
const skillsDir = path.resolve("skills");
const SKILL_NAME_RE = /^name:\s*(.+)$/m;
function readDeclaredSkillName(skillPath: string): string | undefined {
const content = readFileSync(skillPath, "utf8");
const match = content.match(SKILL_NAME_RE);
return match?.[1]?.trim();
}
test("each bundled skill name matches its folder name", () => {
const skillFolders = readdirSync(skillsDir, { withFileTypes: true }).filter(
(entry) => entry.isDirectory()
);
assert.ok(skillFolders.length > 0);
for (const folder of skillFolders) {
const skillPath = path.join(skillsDir, folder.name, "SKILL.md");
const declaredName = readDeclaredSkillName(skillPath);
assert.equal(
declaredName,
folder.name,
`${skillPath} declares name "${declaredName}" but folder is "${folder.name}"`
);
}
});
+29 -40
View File
@@ -3,20 +3,6 @@ import test from "node:test";
import { createInitialState } from "../src/state/create.ts"; import { createInitialState } from "../src/state/create.ts";
import { renderAskScreen } from "../src/ui/render.ts"; import { renderAskScreen } from "../src/ui/render.ts";
function mockTheme() {
return {
fg(color: string, text: string) {
return `<${color}>${text}</${color}>`;
},
bg(color: string, text: string) {
return `{${color}}${text}{/${color}}`;
},
bold(text: string) {
return text;
},
} as never;
}
function mockEditor() { function mockEditor() {
return { return {
getText() { getText() {
@@ -42,7 +28,7 @@ function plainTheme() {
} as never; } as never;
} }
test("tab strip always shows dimmed framing arrows on wide screens", () => { test("wide header keeps all tabs and framing arrows on the tab row", () => {
const state = createInitialState({ const state = createInitialState({
title: "Demo", title: "Demo",
questions: [ questions: [
@@ -63,13 +49,12 @@ test("tab strip always shows dimmed framing arrows on wide screens", () => {
const lines = renderAskScreen({ const lines = renderAskScreen({
state, state,
theme: mockTheme(), theme: plainTheme(),
width: 120, width: 120,
editor: mockEditor(), editor: mockEditor(),
}); });
assert(lines.some((line) => line.includes("<dim>← </dim>"))); assert.equal(lines[3], " ← ☐ One ☐ Two ✔ Submit →");
assert(lines.some((line) => line.includes("<success> ✔ Submit </success>")));
}); });
test("narrow tab strip keeps active middle tab visible", () => { test("narrow tab strip keeps active middle tab visible", () => {
@@ -117,10 +102,7 @@ test("narrow tab strip keeps active middle tab visible", () => {
editor: mockEditor(), editor: mockEditor(),
}); });
const tabLine = lines.find((line) => line.includes("← ")); assert.equal(lines[3], " ← ☐ Three ☐ Four →");
assert.ok(tabLine);
assert(tabLine.includes("Three"));
assert(!tabLine.includes("One"));
}); });
test("narrow tab strip keeps submit tab visible when active", () => { test("narrow tab strip keeps submit tab visible when active", () => {
@@ -157,10 +139,7 @@ test("narrow tab strip keeps submit tab visible when active", () => {
editor: mockEditor(), editor: mockEditor(),
}); });
const tabLine = lines.find((line) => line.includes("Submit")); assert.equal(lines[3], " ← ✔ Submit →");
assert.ok(tabLine);
assert(tabLine.includes("Submit"));
assert(tabLine.includes("←") || tabLine.includes("→"));
}); });
test("tab strip avoids truncation at narrow boundary widths", () => { test("tab strip avoids truncation at narrow boundary widths", () => {
@@ -201,23 +180,26 @@ test("tab strip avoids truncation at narrow boundary widths", () => {
}); });
state.activeTabIndex = 2; state.activeTabIndex = 2;
for (const width of [28, 29, 30, 31, 32]) { const expectedByWidth = new Map([
[28, " ← ☐ Three ☐ Four →"],
[29, " ← ☐ Three ☐ Four →"],
[30, " ← ☐ Three ☐ Four →"],
[31, " ← ☐ Two ☐ Three ☐ Four →"],
[32, " ← ☐ Two ☐ Three ☐ Four →"],
]);
for (const [width, expected] of expectedByWidth) {
const lines = renderAskScreen({ const lines = renderAskScreen({
state, state,
theme: plainTheme(), theme: plainTheme(),
width, width,
editor: mockEditor(), editor: mockEditor(),
}); });
const tabLine = lines.find((line) => line.includes("← ")); assert.equal(lines[3], expected);
assert.ok(tabLine);
assert(tabLine.includes("Three"));
assert(!tabLine.includes("..."));
assert(!tabLine.includes("Fou..."));
assert(!tabLine.includes("Fi..."));
} }
}); });
test("footer hints wrap on narrow screens instead of truncating", () => { test("footer hints wrap into exact lines on narrow screens", () => {
const state = createInitialState({ const state = createInitialState({
questions: [ questions: [
{ {
@@ -237,12 +219,15 @@ test("footer hints wrap on narrow screens instead of truncating", () => {
editor: mockEditor(), editor: mockEditor(),
}); });
assert(lines.some((line) => line.includes("Space toggle"))); assert.deepEqual(lines.slice(-5, -1), [
assert(lines.some((line) => line.includes("Enter continue"))); "Space toggle",
assert(lines.some((line) => line.includes("N/Shift+N note"))); "Enter continue",
"N/Shift+N note",
"Esc dismiss",
]);
}); });
test("footer keeps earlier hint chunks when later chunks wrap", () => { test("footer keeps earlier hint chunk on the first wrapped line", () => {
const state = createInitialState({ const state = createInitialState({
questions: [ questions: [
{ {
@@ -261,6 +246,10 @@ test("footer keeps earlier hint chunks when later chunks wrap", () => {
editor: mockEditor(), editor: mockEditor(),
}); });
assert(lines.some((line) => line.includes("⇆ tab · ↑↓ select"))); assert.equal(lines.at(-5), " ⇆ tab · ↑↓ select");
assert(lines.some((line) => line.includes("Enter confirm"))); assert.deepEqual(lines.slice(-4, -1), [
"Enter confirm",
"N/Shift+N note",
"Esc dismiss",
]);
}); });
+28 -37
View File
@@ -24,7 +24,7 @@ function plainTheme() {
} as never; } as never;
} }
test("submit screen uses shorter action labels without extra prompt text", () => { test("submit screen renders the compact action labels without extra prompt copy", () => {
const state = createInitialState({ const state = createInitialState({
questions: [ questions: [
{ {
@@ -44,14 +44,14 @@ test("submit screen uses shorter action labels without extra prompt text", () =>
UI_DIMENSIONS.submitWideMinWidth + 16 UI_DIMENSIONS.submitWideMinWidth + 16
); );
assert(!lines.some((line) => line.includes("Submit answers?"))); assert.equal(lines[0], "❯ 1. Submit Review answers");
assert(lines.some((line) => line.includes("1. Submit"))); assert.equal(lines[1], " 2. Elaborate ");
assert(lines.some((line) => line.includes("2. Elaborate"))); assert.equal(lines[2], " 3. Cancel Single");
assert(lines.some((line) => line.includes("3. Cancel"))); assert(!lines.join("\n").includes("Submit answers?"));
assert(!lines.some((line) => line.includes("1. Submit answers"))); assert(!lines.join("\n").includes("Submit answers"));
}); });
test("submit screen uses side-by-side layout on wide screens", () => { test("submit screen keeps review and actions grouped side by side on wide screens", () => {
const state = createInitialState({ const state = createInitialState({
questions: [ questions: [
{ {
@@ -71,14 +71,12 @@ test("submit screen uses side-by-side layout on wide screens", () => {
UI_DIMENSIONS.submitWideMinWidth + 16 UI_DIMENSIONS.submitWideMinWidth + 16
); );
assert( assert.deepEqual(lines, [
lines.some( "❯ 1. Submit Review answers",
(line) => line.includes("1. Submit") && line.includes("Review answers") " 2. Elaborate ",
) " 3. Cancel Color",
); " → unanswered",
assert( ]);
lines.some((line) => line.includes("3. Cancel") && line.includes("Color"))
);
}); });
test("submit screen stacks review above actions on narrow screens", () => { test("submit screen stacks review above actions on narrow screens", () => {
@@ -101,19 +99,16 @@ test("submit screen stacks review above actions on narrow screens", () => {
UI_DIMENSIONS.submitWideMinWidth - 14 UI_DIMENSIONS.submitWideMinWidth - 14
); );
const reviewIndex = lines.findIndex((line) => assert.deepEqual(lines, [
line.includes("Review answers") " Review answers",
); "",
const actionIndex = lines.findIndex((line) => line.includes("1. Submit")); " Color",
" → unanswered",
assert.notEqual(reviewIndex, -1); "",
assert.notEqual(actionIndex, -1); "❯ 1. Submit",
assert(reviewIndex < actionIndex); " 2. Elaborate",
assert( " 3. Cancel",
!lines.some( ]);
(line) => line.includes("1. Submit") && line.includes("Review answers")
)
);
}); });
test("submit screen shows notes only for answered questions in submit mode", () => { test("submit screen shows notes only for answered questions in submit mode", () => {
@@ -280,7 +275,7 @@ test("submit screen renders multi-select option notes under their related answer
assert(secondAnswerIndex < secondNoteIndex); assert(secondAnswerIndex < secondNoteIndex);
}); });
test("submit action column fits all action labels at the wide breakpoint", () => { test("submit action column keeps all three actions on consecutive rows at the wide breakpoint", () => {
const state = createInitialState({ const state = createInitialState({
questions: [ questions: [
{ {
@@ -300,12 +295,8 @@ test("submit action column fits all action labels at the wide breakpoint", () =>
UI_DIMENSIONS.submitWideMinWidth UI_DIMENSIONS.submitWideMinWidth
); );
assert( assert.equal(lines[0], "❯ 1. Submit Review answers");
lines.some( assert.equal(lines[1], " 2. Elaborate ");
(line) => line.includes("1. Submit") && line.includes("Review answers") assert.equal(lines[2], " 3. Cancel Color");
) assert.equal(lines[3], " → unanswered");
);
assert(lines.some((line) => line.includes("2. Elaborate")));
assert(lines.some((line) => line.includes("3. Cancel")));
assert(!lines.some((line) => line.includes("Elaborat\n")));
}); });