fix: Make table sticky columns util support columns unmount (#1542)

cloudscape-design · Sep 13, 2023 · 03e59f2 · 03e59f2
1 parent cfd28c9
commit 03e59f2
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 2 deletions.
diff --git a/src/table/sticky-columns/__tests__/use-sticky-columns.test.tsx b/src/table/sticky-columns/__tests__/use-sticky-columns.test.tsx
@@ -6,6 +6,7 @@ import {
   StickyColumnsModel,
   useStickyCellStyles,
 } from '../../../../lib/components/table/sticky-columns';
+import { updateCellOffsets } from '../../../../lib/components/table/sticky-columns/utils';
 import { getStickyClassNames } from '../../../../lib/components/table/utils';
 import { renderHook } from '../../../__tests__/render-hook';
 
@@ -321,3 +322,12 @@ describe('getStickyClassNames helper', () => {
     });
   });
 });
+
+test('updateCellOffsets element widths fallback to 0 when elements are missing', () => {
+  const { offsets } = updateCellOffsets(
+    {},
+    { stickyColumnsFirst: 1, stickyColumnsLast: 1, visibleColumns: ['a', 'b', 'c'] }
+  );
+  expect(offsets.get('a')).toEqual({ first: 0, last: 0 });
+  expect(offsets.get('c')).toEqual({ first: 0, last: 0 });
+});
diff --git a/src/table/sticky-columns/utils.ts b/src/table/sticky-columns/utils.ts
@@ -26,14 +26,14 @@ export function updateCellOffsets(cells: Record<PropertyKey, HTMLElement>, props
   const firstColumnsWidths: number[] = [];
   for (let i = 0; i < Math.min(totalColumns, props.stickyColumnsFirst); i++) {
     const element = cells[props.visibleColumns[i]];
-    const cellWidth = element.getBoundingClientRect().width ?? 0;
+    const cellWidth = element?.getBoundingClientRect().width ?? 0;
     firstColumnsWidths[i] = (firstColumnsWidths[i - 1] ?? 0) + cellWidth;
   }
 
   const lastColumnsWidths: number[] = [];
   for (let i = 0; i < Math.min(totalColumns, props.stickyColumnsLast); i++) {
     const element = cells[props.visibleColumns[totalColumns - 1 - i]];
-    const cellWidth = element.getBoundingClientRect().width ?? 0;
+    const cellWidth = element?.getBoundingClientRect().width ?? 0;
     lastColumnsWidths[i] = (lastColumnsWidths[i - 1] ?? 0) + cellWidth;
   }