diff --git a/source/Table/Table.jest.js b/source/Table/Table.jest.js
index 544759fdc..58d967dc3 100644
--- a/source/Table/Table.jest.js
+++ b/source/Table/Table.jest.js
@@ -1563,4 +1563,34 @@ describe('Table', () => {
findDOMNode(render(getMarkup({cellRenderer})));
expect(cellRenderer.mock.calls[0][0].parent).not.toBeUndefined();
});
+
+ it('`key` prop rendered on cells should work as expected', () => {
+ let mutableList = [
+ {id: 1, name: 'foo'},
+ {id: 2, name: 'bar'},
+ {id: 3, name: 'baz'},
+ ];
+ const rerender = () =>
+ findDOMNode(
+ render(
+ getMarkup({
+ rowGetter: ({index}) => mutableList[index],
+ cellRenderer: props => (
+
+ Cell
+
+ ),
+ rowCount: mutableList.length,
+ }),
+ ),
+ );
+ let rendered = rerender();
+ expect(rendered.querySelector('#foo')).toBeTruthy();
+ const bazElem = rendered.querySelector('#baz');
+ mutableList = mutableList.slice(1);
+ rendered = rerender();
+ expect(rendered.querySelector('#foo')).toBeFalsy();
+ // dom node should have been reused when `key` worked
+ expect(rendered.querySelector('#baz')).toBe(bazElem);
+ });
});
diff --git a/source/Table/Table.js b/source/Table/Table.js
index e0211a8ce..e67c3d4b1 100644
--- a/source/Table/Table.js
+++ b/source/Table/Table.js
@@ -490,7 +490,10 @@ export default class Table extends React.PureComponent {
aria-colindex={columnIndex + 1}
aria-describedby={id}
className={clsx('ReactVirtualized__Table__rowColumn', className)}
- key={'Row' + rowIndex + '-' + 'Col' + columnIndex}
+ key={
+ (renderedCell && renderedCell.key) ||
+ `Row${rowIndex}-Col${columnIndex}`
+ }
onClick={onClick}
role="gridcell"
style={style}
@@ -598,7 +601,7 @@ export default class Table extends React.PureComponent {
aria-sort={headerAriaSort}
className={classNames}
id={id}
- key={'Header-Col' + index}
+ key={column.key || `Header-Col${index}`}
onClick={headerOnClick}
onKeyDown={headerOnKeyDown}
role="columnheader"
@@ -658,7 +661,7 @@ export default class Table extends React.PureComponent {
columns,
index,
isScrolling,
- key,
+ key: (columns[0] && columns[0].key) || key,
onRowClick,
onRowDoubleClick,
onRowRightClick,