diff --git a/apps/client/src/views/cuesheet/cuesheet-table/CuesheetTable.tsx b/apps/client/src/views/cuesheet/cuesheet-table/CuesheetTable.tsx index 5b3222790..76031ae67 100644 --- a/apps/client/src/views/cuesheet/cuesheet-table/CuesheetTable.tsx +++ b/apps/client/src/views/cuesheet/cuesheet-table/CuesheetTable.tsx @@ -200,7 +200,7 @@ export default function CuesheetTable({ return colSizes; // eslint-disable-next-line react-compiler/react-compiler -- unfortunately this is what we need // eslint-disable-next-line react-hooks/exhaustive-deps -- this works well and follows documentation - }, [table.state.columnResizing, table.state.columnSizing]); + }, [columns, table.state.columnResizing, table.state.columnSizing]); const allLeafColumns = table.getAllLeafColumns(); const { rows } = table.getRowModel(); diff --git a/e2e/tests/features/202-cuesheet.spec.ts b/e2e/tests/features/202-cuesheet.spec.ts index eabf68b4b..ba609b2d3 100644 --- a/e2e/tests/features/202-cuesheet.spec.ts +++ b/e2e/tests/features/202-cuesheet.spec.ts @@ -9,13 +9,13 @@ test('cuesheet displays events', async ({ page }) => { test('cuesheet persists column visibility', async ({ page }) => { await page.goto('/cuesheet'); - const noteHeader = page.getByRole('columnheader', { name: 'Note' }); + const noteHeader = page.getByRole('columnheader', { name: 'Note', exact: true }); const noteCell = page.getByTestId('cuesheet-event').first().getByTestId('cuesheet-cell-note'); await expect(noteHeader).toBeVisible(); await expect(noteCell).toBeVisible(); await page.getByRole('button', { name: 'Columns' }).click(); - await page.getByRole('checkbox', { name: 'Note' }).click(); + await page.getByRole('checkbox', { name: 'Note', exact: true }).click(); await expect(noteHeader).toBeHidden(); await expect(noteCell).toBeHidden();