diff --git a/src/components/TableModule/TableModule.stories.tsx b/src/components/TableModule/TableModule.stories.tsx index fff85440..7d2d7420 100644 --- a/src/components/TableModule/TableModule.stories.tsx +++ b/src/components/TableModule/TableModule.stories.tsx @@ -461,7 +461,8 @@ export const RowSelection: ComponentStory = (args) => { cell: { content: (rowData: RowSelectionRow) => ( { const { findByTestId } = renderWithTheme( @@ -126,3 +127,38 @@ test('it does not render row actions when the `rowActions` function returns null const td = await findByRole('cell'); expect(td.innerHTML).toBe(''); }); + +test('it does not trigger row click when target is a checkbox input', async () => { + const mockFn = jest.fn(); + const mockCheckboxClick = jest.fn(); + + const { findByLabelText } = renderWithTheme( + + + ( + + ), + }, + ]} + headingsLength={0} + onRowClick={mockFn} + /> + +
+ ); + + const checkbox = await findByLabelText('Select Row'); + + fireEvent.click(checkbox); + + expect(mockCheckboxClick).toBeCalledTimes(1); + // does not trigger row click + expect(mockFn).toBeCalledTimes(0); +}); diff --git a/src/components/TableModule/TableModuleRow.tsx b/src/components/TableModule/TableModuleRow.tsx index f703e854..4d75eca6 100644 --- a/src/components/TableModule/TableModuleRow.tsx +++ b/src/components/TableModule/TableModuleRow.tsx @@ -68,6 +68,10 @@ const TableModuleRow: React.FC = React.memo( return; } + if (e.target?.tagName === 'INPUT' && e.target?.type === 'checkbox') { + return; + } + e?.currentTarget?.blur(); onRowClick?.(row);