test: tighten render assertions
This commit is contained in:
@@ -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;
|
||||||
}, []);
|
}, []);
|
||||||
|
|||||||
@@ -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
@@ -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
@@ -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")));
|
|
||||||
});
|
});
|
||||||
|
|||||||
Reference in New Issue
Block a user