diff --git a/src/components/Table/Table.test.tsx b/src/components/Table/Table.test.tsx index 0881055..4f4330a 100644 --- a/src/components/Table/Table.test.tsx +++ b/src/components/Table/Table.test.tsx @@ -161,6 +161,39 @@ describe('Table', () => { expect(screen.getByRole('cell', {name: 'Bob'})).toBeInTheDocument(); }); + it('clears a cell when its field is removed from the row', () => { + interface OptionalRoleRow extends Record { + id: string; + name: string; + role?: string; + } + + const optionalRoleColumns: TableColumn[] = [ + {key: 'name', header: 'Name'}, + {key: 'role', header: 'Role'}, + ]; + const {rerender} = render( + , + ); + + expect(screen.getByRole('cell', {name: 'Admin'})).toBeInTheDocument(); + + rerender( +
, + ); + + const dataRow = screen.getAllByRole('row')[1]; + expect(within(dataRow).getAllByRole('cell')[1]).toBeEmptyDOMElement(); + }); + it('applies visual context props through row and cell classes', () => { const {rerender} = render(
>( return false; } - if (previous.item === next.item) { - return true; - } - - return Object.keys(next.item).every( - key => previous.item[key] === next.item[key], - ); + return shallowEqual(previous.item, next.item); } const MemoizedDataRow = memo(DataRowInner, areRowPropsEqual) as <