612 lines
20 KiB
TypeScript
612 lines
20 KiB
TypeScript
import fs from "node:fs";
|
|
import { loadAllAppCss } from "../../test/cssFixture";
|
|
import path from "node:path";
|
|
import { render, screen, fireEvent, waitFor } from "@testing-library/react";
|
|
import type { Task, TaskDetail, Settings } from "@fusion/core";
|
|
import { beforeEach, describe, expect, it, vi } from "vitest";
|
|
import { fetchTaskDetail } from "../../api";
|
|
import { InlineCreateCard } from "../InlineCreateCard";
|
|
import { TaskCard } from "../TaskCard";
|
|
|
|
vi.mock("../../api", () => ({
|
|
fetchTaskDetail: vi.fn(),
|
|
uploadAttachment: vi.fn(),
|
|
fetchMission: vi.fn(),
|
|
fetchAgent: vi.fn(),
|
|
fetchModels: vi.fn().mockResolvedValue({ models: [], favoriteProviders: [], favoriteModels: [] }),
|
|
fetchSettings: vi.fn().mockResolvedValue({
|
|
modelPresets: [],
|
|
autoSelectModelPreset: false,
|
|
defaultPresetBySize: {},
|
|
maxConcurrent: 2,
|
|
maxWorktrees: 4,
|
|
pollIntervalMs: 30_000,
|
|
groupOverlappingFiles: true,
|
|
autoMerge: true,
|
|
} satisfies Partial<Settings>),
|
|
updateGlobalSettings: vi.fn(),
|
|
fetchAgents: vi.fn().mockResolvedValue([]),
|
|
}));
|
|
|
|
vi.mock("../../hooks/useBadgeWebSocket", () => ({
|
|
useBadgeWebSocket: () => ({
|
|
badgeUpdates: new Map(),
|
|
isConnected: false,
|
|
subscribeToBadge: vi.fn(),
|
|
unsubscribeFromBadge: vi.fn(),
|
|
}),
|
|
}));
|
|
|
|
vi.mock("../../hooks/useSessionFiles", () => ({
|
|
useSessionFiles: () => ({ files: [], loading: false }),
|
|
}));
|
|
|
|
vi.mock("../../hooks/useTaskDiffStats", () => ({
|
|
useTaskDiffStats: () => ({ stats: null, loading: false }),
|
|
}));
|
|
|
|
|
|
function getMainMobileSection(css: string): string {
|
|
// Mobile rules now live across many co-located component CSS files (each
|
|
// owns its own @media (max-width: 768px) block) instead of one monolith
|
|
// section in styles.css. Concatenate every <=768px media block in the
|
|
// bundle so these assertions remain location-agnostic.
|
|
const re = /@media\s*\([^)]*max-width:\s*768px[^)]*\)\s*\{/g;
|
|
const blocks: string[] = [];
|
|
|
|
for (const match of css.matchAll(re)) {
|
|
const start = match.index! + match[0].length;
|
|
let depth = 1;
|
|
let i = start;
|
|
while (i < css.length && depth > 0) {
|
|
const ch = css[i];
|
|
if (ch === "{") depth++;
|
|
else if (ch === "}") depth--;
|
|
i++;
|
|
}
|
|
blocks.push(css.slice(start, i - 1));
|
|
}
|
|
|
|
expect(blocks.length).toBeGreaterThan(0);
|
|
return blocks.join("\n");
|
|
}
|
|
|
|
function expectRuleToContain(section: string, selectorFragment: string, declaration: string): void {
|
|
const pattern = /([^{}]+)\{([\s\S]*?)\}/g;
|
|
let foundSelector = false;
|
|
let foundDeclaration = false;
|
|
|
|
for (const match of section.matchAll(pattern)) {
|
|
const selector = match[1];
|
|
const block = match[2];
|
|
|
|
if (!selector.includes(selectorFragment)) {
|
|
continue;
|
|
}
|
|
|
|
foundSelector = true;
|
|
if (block.includes(declaration)) {
|
|
foundDeclaration = true;
|
|
break;
|
|
}
|
|
}
|
|
|
|
expect(foundSelector).toBe(true);
|
|
expect(foundDeclaration).toBe(true);
|
|
}
|
|
|
|
function expectRuleNotToContain(section: string, selectorFragment: string, declaration: string): void {
|
|
const pattern = /([^{}]+)\{([\s\S]*?)\}/g;
|
|
let foundSelector = false;
|
|
|
|
for (const match of section.matchAll(pattern)) {
|
|
const selector = match[1];
|
|
const block = match[2];
|
|
|
|
if (!selector.includes(selectorFragment)) {
|
|
continue;
|
|
}
|
|
|
|
foundSelector = true;
|
|
expect(block.includes(declaration)).toBe(false);
|
|
}
|
|
|
|
expect(foundSelector).toBe(true);
|
|
}
|
|
|
|
function createTask(overrides: Partial<Task> & { id?: string } = {}): Task {
|
|
return {
|
|
id: overrides.id ?? "FN-1139",
|
|
title: overrides.title,
|
|
description: overrides.description ?? "Mobile board test task",
|
|
column: overrides.column ?? "todo",
|
|
dependencies: overrides.dependencies ?? [],
|
|
steps: overrides.steps ?? [],
|
|
currentStep: overrides.currentStep ?? 0,
|
|
log: overrides.log ?? [],
|
|
createdAt: overrides.createdAt ?? "2026-04-08T00:00:00.000Z",
|
|
updatedAt: overrides.updatedAt ?? "2026-04-08T00:00:00.000Z",
|
|
...overrides,
|
|
} as Task;
|
|
}
|
|
|
|
beforeEach(() => {
|
|
vi.clearAllMocks();
|
|
if (typeof window !== "undefined") {
|
|
window.localStorage.clear();
|
|
}
|
|
});
|
|
|
|
describe("Board desktop column width CSS", () => {
|
|
it("keeps desktop board columns equal width via 6x minmax(300px, 1fr) grid", () => {
|
|
const css = loadAllAppCss();
|
|
|
|
expectRuleToContain(css, ".board", "grid-template-columns: repeat(6, minmax(300px, 1fr));");
|
|
});
|
|
|
|
it("constrains header content so actions cannot stretch column width", () => {
|
|
const css = loadAllAppCss();
|
|
|
|
expectRuleToContain(css, ".column-header", "min-width: 0;");
|
|
expectRuleToContain(css, ".column-header h2", "min-width: 0;");
|
|
expectRuleToContain(css, ".column-header h2", "overflow: hidden;");
|
|
expectRuleToContain(css, ".column-header h2", "text-overflow: ellipsis;");
|
|
expectRuleToContain(css, ".column-header h2", "white-space: nowrap;");
|
|
});
|
|
});
|
|
|
|
describe("Board and Column mobile CSS", () => {
|
|
it("contains .board scroll-snap-type: x proximity in the mobile media block (FN-001)", () => {
|
|
const css = loadAllAppCss();
|
|
const mobileSection = getMainMobileSection(css);
|
|
|
|
expectRuleToContain(mobileSection, ".board", "scroll-snap-type: x proximity;");
|
|
});
|
|
|
|
it("contains .board scroll-behavior: smooth in the mobile media block", () => {
|
|
const css = loadAllAppCss();
|
|
const mobileSection = getMainMobileSection(css);
|
|
|
|
expectRuleToContain(mobileSection, ".board", "scroll-behavior: smooth;");
|
|
});
|
|
|
|
it("contains .board > .column width: 300px in the mobile media block", () => {
|
|
const css = loadAllAppCss();
|
|
const mobileSection = getMainMobileSection(css);
|
|
|
|
expectRuleToContain(mobileSection, ".board > .column", "width: 300px;");
|
|
});
|
|
|
|
it("contains .board > .column min-width: 300px in the mobile media block", () => {
|
|
const css = loadAllAppCss();
|
|
const mobileSection = getMainMobileSection(css);
|
|
|
|
expectRuleToContain(mobileSection, ".board > .column", "min-width: 300px;");
|
|
});
|
|
|
|
it("does not force .column-header min-height in the mobile media block", () => {
|
|
const css = loadAllAppCss();
|
|
const mobileSection = getMainMobileSection(css);
|
|
|
|
// Column headers use natural height from padding/font — no forced min-height
|
|
const pattern = /([^{}]+)\{([\s\S]*?)\}/g;
|
|
for (const match of mobileSection.matchAll(pattern)) {
|
|
const selector = match[1].trim();
|
|
const block = match[2];
|
|
// Match exactly ".column-header" (not ".column-header .btn-icon" etc.)
|
|
if (selector !== ".column-header") continue;
|
|
// No rule targeting .column-header should set min-height
|
|
expect(block).not.toContain("min-height");
|
|
}
|
|
});
|
|
|
|
it("hides board scrollbars in the mobile media block", () => {
|
|
const css = loadAllAppCss();
|
|
const mobileSection = getMainMobileSection(css);
|
|
|
|
expectRuleToContain(mobileSection, ".board", "scrollbar-width: none;");
|
|
expectRuleToContain(mobileSection, ".board::-webkit-scrollbar", "display: none;");
|
|
});
|
|
|
|
it("uses simple padding-bottom on .board (safe-area handled by parent)", () => {
|
|
const css = loadAllAppCss();
|
|
const mobileSection = getMainMobileSection(css);
|
|
|
|
// Board padding-bottom is just var(--space-md) to avoid double-counting safe-area-inset-bottom
|
|
// which is already handled by .project-content--with-mobile-nav padding
|
|
expectRuleToContain(mobileSection, ".board", "padding-bottom: var(--space-md);");
|
|
});
|
|
});
|
|
|
|
describe("TaskCard mobile", () => {
|
|
it("sets .card-archive-btn opacity: 1 in the mobile media block", () => {
|
|
const css = loadAllAppCss();
|
|
const mobileSection = getMainMobileSection(css);
|
|
|
|
expectRuleToContain(mobileSection, ".card-archive-btn", "opacity: 1;");
|
|
});
|
|
|
|
it("keeps archive/unarchive/send-back visible without min-height overrides in the mobile media block", () => {
|
|
const css = loadAllAppCss();
|
|
const mobileSection = getMainMobileSection(css);
|
|
|
|
const selectors = [
|
|
".card-archive-btn",
|
|
".card-unarchive-btn",
|
|
".card-send-back-btn",
|
|
];
|
|
const pattern = /([^{}]+)\{([\s\S]*?)\}/g;
|
|
|
|
for (const selector of selectors) {
|
|
let found = false;
|
|
for (const match of mobileSection.matchAll(pattern)) {
|
|
const blockSelector = match[1];
|
|
const block = match[2];
|
|
if (!blockSelector.includes(selector)) continue;
|
|
found = true;
|
|
expect(block).toContain("opacity: 1;");
|
|
expect(block).not.toContain("min-height:");
|
|
}
|
|
expect(found).toBe(true);
|
|
}
|
|
});
|
|
|
|
it("FN-4351: archive/unarchive/send-back buttons have no min-height in the mobile media block", () => {
|
|
const css = loadAllAppCss();
|
|
const mobileSection = getMainMobileSection(css);
|
|
|
|
const selectors = [
|
|
".card-archive-btn",
|
|
".card-unarchive-btn",
|
|
".card-send-back-btn",
|
|
];
|
|
const pattern = /([^{}]+)\{([\s\S]*?)\}/g;
|
|
|
|
for (const selector of selectors) {
|
|
let found = false;
|
|
for (const match of mobileSection.matchAll(pattern)) {
|
|
const blockSelector = match[1];
|
|
const block = match[2];
|
|
if (!blockSelector.includes(selector)) continue;
|
|
found = true;
|
|
expect(block).not.toContain("min-height:");
|
|
}
|
|
expect(found).toBe(true);
|
|
}
|
|
|
|
expectRuleToContain(mobileSection, ".card-edit-btn", "width: 28px;");
|
|
expectRuleToContain(mobileSection, ".card-edit-btn", "height: 28px;");
|
|
expectRuleToContain(mobileSection, ".card-delete-btn", "width: 28px;");
|
|
expectRuleToContain(mobileSection, ".card-delete-btn", "height: 28px;");
|
|
});
|
|
|
|
it("does not force .card-steps-toggle min-height in the mobile media block", () => {
|
|
const css = loadAllAppCss();
|
|
const mobileSection = getMainMobileSection(css);
|
|
|
|
// Steps toggle uses natural height from content and padding
|
|
const pattern = /([^{}]+)\{([\s\S]*?)\}/g;
|
|
for (const match of mobileSection.matchAll(pattern)) {
|
|
const selector = match[1].trim();
|
|
const block = match[2];
|
|
if (selector !== ".card-steps-toggle") continue;
|
|
expect(block).not.toContain("min-height");
|
|
}
|
|
});
|
|
|
|
it("does not force .card-session-files min-height in the mobile media block", () => {
|
|
const css = loadAllAppCss();
|
|
const mobileSection = getMainMobileSection(css);
|
|
|
|
// Session files button uses natural height
|
|
const pattern = /([^{}]+)\{([\s\S]*?)\}/g;
|
|
for (const match of mobileSection.matchAll(pattern)) {
|
|
const selector = match[1].trim();
|
|
const block = match[2];
|
|
if (selector !== ".card-session-files") continue;
|
|
expect(block).not.toContain("min-height");
|
|
}
|
|
});
|
|
|
|
it("keeps TaskCard footer row on one line", () => {
|
|
const css = loadAllAppCss();
|
|
expectRuleToContain(css, ".card-footer-row", "flex-wrap: nowrap;");
|
|
});
|
|
|
|
it("keeps TaskCard timer chip in-flow and right-aligned in footer metadata row", () => {
|
|
const css = loadAllAppCss();
|
|
expectRuleToContain(css, ".card-time-indicator", "margin-left: auto;");
|
|
expectRuleToContain(css, ".card-header-actions", "margin-left: auto;");
|
|
});
|
|
|
|
it("FN-4365: keeps .card-header-actions on the same row as the title in the mobile media block", () => {
|
|
const css = loadAllAppCss();
|
|
const mobileSection = getMainMobileSection(css);
|
|
const pattern = /([^{}]+)\{([\s\S]*?)\}/g;
|
|
|
|
let foundHeaderActions = false;
|
|
|
|
for (const match of mobileSection.matchAll(pattern)) {
|
|
const selector = match[1];
|
|
const block = match[2];
|
|
|
|
if (selector.includes(".card-header-actions")) {
|
|
foundHeaderActions = true;
|
|
expect(block).not.toContain("width: 100%");
|
|
expect(block).not.toContain("margin-left: 0");
|
|
expect(block).not.toContain("flex-wrap");
|
|
expect(block).not.toContain("justify-content: flex-end");
|
|
}
|
|
|
|
if (selector.trim() === ".card-header") {
|
|
expect(block).not.toContain("flex-wrap: wrap");
|
|
}
|
|
}
|
|
|
|
expect(foundHeaderActions).toBe(true);
|
|
});
|
|
|
|
it("truncates TaskCard files-changed text instead of wrapping", () => {
|
|
const css = loadAllAppCss();
|
|
expectRuleToContain(css, ".card-session-files span", "text-overflow: ellipsis;");
|
|
expectRuleToContain(css, ".card-session-files span", "white-space: nowrap;");
|
|
});
|
|
|
|
it("uses compact 28px touch targets for TaskCard action buttons in the mobile media block", () => {
|
|
const css = loadAllAppCss();
|
|
const mobileSection = getMainMobileSection(css);
|
|
|
|
expectRuleToContain(mobileSection, ".card-edit-btn", "width: 28px;");
|
|
expectRuleToContain(mobileSection, ".card-edit-btn", "height: 28px;");
|
|
expectRuleToContain(mobileSection, ".card-delete-btn", "width: 28px;");
|
|
expectRuleToContain(mobileSection, ".card-delete-btn", "height: 28px;");
|
|
});
|
|
|
|
it("opens task detail on quick tap", async () => {
|
|
const task = createTask({ id: "FN-200", column: "todo" });
|
|
|
|
const onOpenDetail = vi.fn();
|
|
const { container } = render(
|
|
<TaskCard task={task} onOpenDetail={onOpenDetail} addToast={vi.fn()} />,
|
|
);
|
|
|
|
const card = container.querySelector(`[data-id="${task.id}"]`) as HTMLElement;
|
|
expect(card).toBeTruthy();
|
|
|
|
fireEvent.touchStart(card, {
|
|
touches: [{ clientX: 100, clientY: 100 }],
|
|
});
|
|
fireEvent.touchEnd(card, {
|
|
changedTouches: [{ clientX: 100, clientY: 100 }],
|
|
});
|
|
|
|
// TaskCard calls onOpenDetail directly with the task - no fetchTaskDetail needed for card taps
|
|
expect(onOpenDetail).toHaveBeenCalledWith(task);
|
|
});
|
|
|
|
it("does not open task detail when touch gesture indicates scroll", async () => {
|
|
const task = createTask({ id: "FN-201", column: "todo" });
|
|
vi.mocked(fetchTaskDetail).mockResolvedValueOnce({
|
|
...task,
|
|
prompt: "",
|
|
attachments: [],
|
|
} as TaskDetail);
|
|
|
|
const { container } = render(
|
|
<TaskCard task={task} onOpenDetail={vi.fn()} addToast={vi.fn()} />,
|
|
);
|
|
|
|
const card = container.querySelector(`[data-id="${task.id}"]`) as HTMLElement;
|
|
expect(card).toBeTruthy();
|
|
|
|
fireEvent.touchStart(card, {
|
|
touches: [{ clientX: 100, clientY: 100 }],
|
|
});
|
|
fireEvent.touchMove(card, {
|
|
touches: [{ clientX: 150, clientY: 100 }],
|
|
});
|
|
fireEvent.touchEnd(card, {
|
|
changedTouches: [{ clientX: 150, clientY: 100 }],
|
|
});
|
|
|
|
await new Promise((resolve) => setTimeout(resolve, 0));
|
|
expect(fetchTaskDetail).not.toHaveBeenCalled();
|
|
});
|
|
|
|
it("does not open task detail when tapping the edit button", async () => {
|
|
const task = createTask({ id: "FN-204", column: "todo" });
|
|
|
|
render(
|
|
<TaskCard
|
|
task={task}
|
|
onOpenDetail={vi.fn()}
|
|
addToast={vi.fn()}
|
|
onUpdateTask={vi.fn().mockResolvedValue(task)}
|
|
/>,
|
|
);
|
|
|
|
const editButton = screen.getByRole("button", { name: "Edit task" });
|
|
fireEvent.touchStart(editButton, {
|
|
touches: [{ clientX: 100, clientY: 100 }],
|
|
});
|
|
fireEvent.touchEnd(editButton, {
|
|
changedTouches: [{ clientX: 100, clientY: 100 }],
|
|
});
|
|
|
|
await new Promise((resolve) => setTimeout(resolve, 0));
|
|
expect(fetchTaskDetail).not.toHaveBeenCalled();
|
|
});
|
|
|
|
it("does not open task detail when tapping the steps toggle", async () => {
|
|
const task = createTask({
|
|
id: "FN-205",
|
|
column: "todo",
|
|
status: "executing",
|
|
steps: [
|
|
{ name: "Step 1", status: "done" },
|
|
{ name: "Step 2", status: "in-progress" },
|
|
],
|
|
});
|
|
|
|
render(
|
|
<TaskCard task={task} onOpenDetail={vi.fn()} addToast={vi.fn()} />,
|
|
);
|
|
|
|
const toggleButton = screen.getByRole("button", { name: "Show steps" });
|
|
fireEvent.touchStart(toggleButton, {
|
|
touches: [{ clientX: 100, clientY: 100 }],
|
|
});
|
|
fireEvent.touchEnd(toggleButton, {
|
|
changedTouches: [{ clientX: 100, clientY: 100 }],
|
|
});
|
|
|
|
await new Promise((resolve) => setTimeout(resolve, 0));
|
|
expect(fetchTaskDetail).not.toHaveBeenCalled();
|
|
});
|
|
|
|
it("does not open task detail when touch target is an SVG element inside a button", async () => {
|
|
const task = createTask({
|
|
id: "FN-206",
|
|
column: "todo",
|
|
status: "executing",
|
|
steps: [
|
|
{ name: "Step 1", status: "done" },
|
|
{ name: "Step 2", status: "in-progress" },
|
|
],
|
|
});
|
|
|
|
render(
|
|
<TaskCard task={task} onOpenDetail={vi.fn()} addToast={vi.fn()} />,
|
|
);
|
|
|
|
const toggleButton = screen.getByRole("button", { name: "Show steps" });
|
|
const svgTarget = toggleButton.querySelector("svg");
|
|
expect(svgTarget).toBeTruthy();
|
|
|
|
fireEvent.touchStart(svgTarget as SVGElement, {
|
|
touches: [{ clientX: 100, clientY: 100 }],
|
|
});
|
|
fireEvent.touchEnd(svgTarget as SVGElement, {
|
|
changedTouches: [{ clientX: 100, clientY: 100 }],
|
|
});
|
|
|
|
await new Promise((resolve) => setTimeout(resolve, 0));
|
|
expect(fetchTaskDetail).not.toHaveBeenCalled();
|
|
});
|
|
|
|
it("renders edit button with aria-label in editable columns", () => {
|
|
const task = createTask({ id: "FN-202", column: "todo" });
|
|
|
|
render(
|
|
<TaskCard
|
|
task={task}
|
|
onOpenDetail={vi.fn()}
|
|
addToast={vi.fn()}
|
|
onUpdateTask={vi.fn().mockResolvedValue(task)}
|
|
/>,
|
|
);
|
|
|
|
expect(screen.getByRole("button", { name: "Edit task" })).toBeTruthy();
|
|
});
|
|
|
|
it("hides the progress bar for todo cards that are not executing", () => {
|
|
const task = createTask({
|
|
id: "FN-203",
|
|
column: "todo",
|
|
status: "queued",
|
|
steps: [
|
|
{ name: "Step 1", status: "done" },
|
|
{ name: "Step 2", status: "in-progress" },
|
|
],
|
|
});
|
|
|
|
const { container } = render(
|
|
<TaskCard task={task} onOpenDetail={vi.fn()} addToast={vi.fn()} />,
|
|
);
|
|
|
|
expect(container.querySelector(".card-progress-bar")).toBeNull();
|
|
});
|
|
|
|
it("renders the progress bar when a todo card is executing", () => {
|
|
const task = createTask({
|
|
id: "FN-207",
|
|
column: "todo",
|
|
status: "executing",
|
|
steps: [
|
|
{ name: "Step 1", status: "done" },
|
|
{ name: "Step 2", status: "in-progress" },
|
|
],
|
|
});
|
|
|
|
const { container } = render(
|
|
<TaskCard task={task} onOpenDetail={vi.fn()} addToast={vi.fn()} />,
|
|
);
|
|
|
|
expect(container.querySelector(".card-progress-bar")).toBeTruthy();
|
|
});
|
|
});
|
|
|
|
describe("InlineCreateCard mobile", () => {
|
|
it("contains .inline-create-input font-size: 16px in the mobile media block", () => {
|
|
const css = loadAllAppCss();
|
|
const mobileSection = getMainMobileSection(css);
|
|
|
|
expectRuleToContain(mobileSection, ".inline-create-input", "font-size: 16px;");
|
|
});
|
|
|
|
it("contains .inline-create-toggle min-height: 36px in the mobile media block", () => {
|
|
const css = loadAllAppCss();
|
|
const mobileSection = getMainMobileSection(css);
|
|
|
|
expectRuleToContain(mobileSection, ".inline-create-toggle", "min-height: 36px;");
|
|
});
|
|
|
|
it("contains .inline-create-controls .btn min-height: 36px in the mobile media block", () => {
|
|
const css = loadAllAppCss();
|
|
const mobileSection = getMainMobileSection(css);
|
|
|
|
expectRuleToContain(mobileSection, ".inline-create-controls .btn", "min-height: 36px;");
|
|
});
|
|
|
|
it("contains .inline-create-priority-select min-height: 36px in the mobile media block", () => {
|
|
const css = loadAllAppCss();
|
|
const mobileSection = getMainMobileSection(css);
|
|
|
|
expectRuleToContain(mobileSection, ".inline-create-priority-select", "min-height: 36px;");
|
|
});
|
|
|
|
it("renders Plan and Subtask buttons when expanded", () => {
|
|
render(
|
|
<InlineCreateCard
|
|
tasks={[]}
|
|
onSubmit={vi.fn().mockResolvedValue(createTask({ id: "FN-300" }))}
|
|
onCancel={vi.fn()}
|
|
addToast={vi.fn()}
|
|
availableModels={[]}
|
|
/>,
|
|
);
|
|
|
|
fireEvent.click(screen.getByTestId("inline-create-toggle"));
|
|
|
|
expect(screen.getByRole("button", { name: "Plan" })).toBeTruthy();
|
|
expect(screen.getByRole("button", { name: "Subtask" })).toBeTruthy();
|
|
});
|
|
|
|
it("renders dependency dropdown when Deps button is clicked", () => {
|
|
render(
|
|
<InlineCreateCard
|
|
tasks={[createTask({ id: "FN-301", description: "Existing dependency task" })]}
|
|
onSubmit={vi.fn().mockResolvedValue(createTask({ id: "FN-302" }))}
|
|
onCancel={vi.fn()}
|
|
addToast={vi.fn()}
|
|
availableModels={[]}
|
|
/>,
|
|
);
|
|
|
|
fireEvent.click(screen.getByTestId("inline-create-toggle"));
|
|
fireEvent.click(screen.getByRole("button", { name: /Deps/i }));
|
|
|
|
expect(document.querySelector(".dep-dropdown")).toBeTruthy();
|
|
});
|
|
});
|