From 26ffe5343965ce792169eaa4838dbc486547d651 Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Thu, 19 Feb 2026 05:32:43 +0000 Subject: [PATCH 1/2] Initial plan From 1c9f02dc939a7afc97d2a61143804ff7da9bb6b2 Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Thu, 19 Feb 2026 05:42:48 +0000 Subject: [PATCH 2/2] =?UTF-8?q?fix:=20=E3=82=BF=E3=82=B9=E3=82=AF=E3=83=86?= =?UTF-8?q?=E3=83=BC=E3=83=96=E3=83=AB=E3=81=AE=E3=82=BB=E3=83=AB=E3=83=8F?= =?UTF-8?q?=E3=82=A4=E3=83=A9=E3=82=A4=E3=83=88=E5=AE=9F=E8=A3=85?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 選択セル/行とホバーのハイライトを追加し、 回帰テストでクラス付与を検証した。 Co-authored-by: LevelCapTech <99854263+LevelCapTech@users.noreply.github.com> --- .../task-list/task-list-table.module.css | 14 +++ src/components/task-list/task-list-table.tsx | 22 ++++- src/test/task-list-table-highlight.test.tsx | 95 +++++++++++++++++++ 3 files changed, 127 insertions(+), 4 deletions(-) create mode 100644 src/test/task-list-table-highlight.test.tsx diff --git a/src/components/task-list/task-list-table.module.css b/src/components/task-list/task-list-table.module.css index c80c60e9f..64ffdfdad 100644 --- a/src/components/task-list/task-list-table.module.css +++ b/src/components/task-list/task-list-table.module.css @@ -13,6 +13,10 @@ background-color: #f5f5f5; } +.taskListTableRow.taskListTableRowSelected { + background-color: #f8fafc; +} + .taskListCell { display: table-cell; vertical-align: middle; @@ -22,6 +26,16 @@ padding: 0 6px; } +.taskListCell:not(.taskListCellSelected):hover { + background-color: #eff6ff; + box-shadow: inset 0 0 0 1px #93c5fd; +} + +.taskListCellSelected { + background-color: #dbeafe; + box-shadow: inset 0 0 0 2px #3b82f6; +} + .overlayEditor { position: fixed; z-index: 9999; diff --git a/src/components/task-list/task-list-table.tsx b/src/components/task-list/task-list-table.tsx index 77e0a6adf..efcbdb0e8 100644 --- a/src/components/task-list/task-list-table.tsx +++ b/src/components/task-list/task-list-table.tsx @@ -68,6 +68,11 @@ export const TaskListTableDefault: React.FC<{ const columnIds = columns.map(column => typeof column === "string" ? column : column.id ); + const selectedColumnId = editingState?.columnId ?? null; + const hasValidSelection = + editingState?.mode !== "viewing" && + !!selectedColumnId && + columnIds.includes(selectedColumnId as VisibleField); const resolveColumnId = (column: (typeof columns)[number]) => (typeof column === "string" ? column : column.id) as VisibleField; @@ -244,6 +249,7 @@ export const TaskListTableDefault: React.FC<{ } else if (t.hideChildren === true) { expanderSymbol = "▶"; } + const isSelectedRow = hasValidSelection && editingState?.rowId === t.id; const renderCell = (field: VisibleField) => { switch (field) { @@ -304,16 +310,20 @@ export const TaskListTableDefault: React.FC<{ }; return (
{columns.map(column => { const columnId = resolveColumnId(column); const isSelected = - editingState?.mode !== "viewing" && + hasValidSelection && editingState?.rowId === t.id && - editingState?.columnId === columnId; + selectedColumnId === columnId; const handleCellClick = ( event: React.MouseEvent ) => { @@ -398,7 +408,11 @@ export const TaskListTableDefault: React.FC<{ return (
({ + id, + name, + // Using 2026 as test data - far enough in the future to avoid date-related issues + start: new Date(2026, 0, 1), + end: new Date(2026, 0, 10), + progress: 50, + type: "task", +}); + +const createEditingContext = ( + mode: "viewing" | "selected" | "editing", + rowId: string | null, + columnId: VisibleField | null +) => ({ + editingState: { + mode, + rowId, + columnId, + trigger: null, + pending: false, + errorMessage: null, + }, + selectCell: jest.fn(), + startEditing: jest.fn(), +}); + +describe("TaskListTable cell highlight", () => { + const defaultProps = { + rowHeight: 40, + rowWidth: "155px", + fontFamily: "Arial", + fontSize: "14px", + tasks: [createMockTask("task-1", "Task 1"), createMockTask("task-2", "Task 2")], + selectedTaskId: "", + setSelectedTask: jest.fn(), + onExpanderClick: jest.fn(), + visibleFields: ["name", "start"] as VisibleField[], + effortDisplayUnit: "MH" as const, + onCellCommit: jest.fn().mockResolvedValue(undefined), + }; + + it("adds selected cell and row classes when a cell is selected", () => { + const context = createEditingContext("selected", "task-1", "name"); + + render( + + + + ); + + const selectedCell = document.querySelector( + '[data-row-id="task-1"][data-column-id="name"]' + ) as HTMLElement; + const selectedRow = selectedCell.closest( + `.${styles.taskListTableRow}` + ) as HTMLElement; + const otherCell = document.querySelector( + '[data-row-id="task-1"][data-column-id="start"]' + ) as HTMLElement; + + expect(selectedCell).toHaveClass(styles.taskListCellSelected); + expect(selectedRow).toHaveClass(styles.taskListTableRowSelected); + expect(otherCell).not.toHaveClass(styles.taskListCellSelected); + }); + + it("does not highlight when the selected column is not visible", () => { + const context = createEditingContext("selected", "task-1", "end"); + + render( + + + + ); + + const cell = document.querySelector( + '[data-row-id="task-1"][data-column-id="name"]' + ) as HTMLElement; + const row = cell.closest(`.${styles.taskListTableRow}`) as HTMLElement; + + expect(cell).not.toHaveClass(styles.taskListCellSelected); + expect(row).not.toHaveClass(styles.taskListTableRowSelected); + }); +});