feat(KB-255): remove 60-character truncation from task descriptions in dashboard

- Remove 60-character truncation from ListView component task descriptions
- Remove 60-character truncation from TaskCard component task descriptions
- Update ListView tests to verify full description display
- Add TaskCard tests for description rendering without truncation
- Remove unused CSS styles related to description truncation
This commit is contained in:
gsxdsm
2026-03-30 21:40:25 -07:00
parent 6a62c3cac6
commit fb123f289d
4 changed files with 79 additions and 6 deletions

View File

@@ -538,15 +538,16 @@ describe("ListView", () => {
});
});
it("truncates long descriptions in title cell", () => {
it("displays full description in title cell when no title exists", () => {
const longDescription = "A".repeat(100);
const tasks = [createMockTask({ id: "KB-001", title: undefined, description: longDescription })];
renderListView({ tasks });
const titleCell = screen.getByText(/A{60}/).closest("td")!;
expect(titleCell.textContent).toContain("");
expect(titleCell.textContent?.length).toBeLessThan(longDescription.length);
// The full 100-character description should be visible
const titleCell = screen.getByText(longDescription).closest("td")!;
expect(titleCell.textContent).toBe(longDescription);
expect(titleCell.textContent?.length).toBe(100);
});
// Grouped view tests

View File

@@ -2554,3 +2554,75 @@ describe("TaskCard touch gesture handling", () => {
});
});
});
/**
* Tests for TaskCard title/description display without truncation.
*/
describe("TaskCard title display", () => {
const noopToast = vi.fn();
const makeTask = (overrides: Partial<Task> = {}): Task => ({
id: "KB-001",
description: "Test task",
column: "todo",
dependencies: [],
steps: [],
currentStep: 0,
log: [],
createdAt: "2026-01-01T00:00:00Z",
updatedAt: "2026-01-01T00:00:00Z",
columnMovedAt: "2026-01-01T00:00:00Z",
...overrides,
} as Task);
it("displays full description when no title exists (no truncation)", () => {
const longDescription = "A".repeat(100);
const task = makeTask({ title: undefined, description: longDescription });
render(
<TaskCard
task={task}
onOpenDetail={vi.fn()}
addToast={noopToast}
/>
);
// The full 100-character description should be visible
const cardTitle = screen.getByText(longDescription);
expect(cardTitle).toBeDefined();
expect(cardTitle.textContent).toBe(longDescription);
expect(cardTitle.textContent?.length).toBe(100);
});
it("displays title when title exists", () => {
const task = makeTask({ title: "My Task Title", description: "Some description" });
render(
<TaskCard
task={task}
onOpenDetail={vi.fn()}
addToast={noopToast}
/>
);
expect(screen.getByText("My Task Title")).toBeDefined();
// Description should not be shown as title when title exists
expect(screen.queryByText("Some description")).toBeNull();
});
it("falls back to task id when no title and no description", () => {
const task = makeTask({ title: undefined, description: "" });
render(
<TaskCard
task={task}
onOpenDetail={vi.fn()}
addToast={noopToast}
/>
);
// Look for the task ID within the card-title element specifically
const cardTitle = screen.getByText("KB-001", { selector: ".card-title" });
expect(cardTitle).toBeDefined();
});
});