fix(ui): address review feedback for Table skeleton loading

- Add @testing-library/jest-dom and @testing-library/react as explicit
  devDependencies for @backstage/ui
- Disable selection on TableRoot during initial loading to prevent
  interaction with skeleton rows
- Clarify test comment about aria-busy vs data-stale behavior

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Signed-off-by: Jonathan Roebuck <jroebuck@spotify.com>

packages/ui/package.json

@@ -55,6 +55,8 @@
   },
   "devDependencies": {
     "@backstage/cli": "workspace:^",
+    "@testing-library/jest-dom": "^6.0.0",
+    "@testing-library/react": "^16.0.0",
     "@types/react": "^18.0.0",
     "@types/react-dom": "^18.0.0",
     "@types/use-sync-external-store": "^0.0.6",

packages/ui/src/components/Table/components/Table.test.tsx

@@ -59,8 +59,8 @@ describe('Table', () => {
       expect(rows).toHaveLength(6);
 
       // Table should indicate it's in a loading/stale state via data-stale
-      // (react-aria-components Table renders this as a data attribute rather
-      // than aria-busy on the DOM element)
+      // (react-aria-components' Table does not forward aria-busy to the DOM,
+      // but the stale prop produces a data-stale attribute for CSS targeting)
       expect(table).toHaveAttribute('data-stale', 'true');
 
       // Each skeleton row should contain Skeleton placeholder elements

packages/ui/src/components/Table/components/Table.tsx

@@ -151,10 +151,10 @@ export function Table<T extends TableItem>({
       </VisuallyHidden>
       {wrapResizable(
         <TableRoot
-          selectionMode={selectionMode}
-          selectionBehavior={selectionBehavior}
-          selectedKeys={selectedKeys}
-          onSelectionChange={onSelectionChange}
+          selectionMode={isInitialLoading ? undefined : selectionMode}
+          selectionBehavior={isInitialLoading ? undefined : selectionBehavior}
+          selectedKeys={isInitialLoading ? undefined : selectedKeys}
+          onSelectionChange={isInitialLoading ? undefined : onSelectionChange}
           sortDescriptor={sort?.descriptor ?? undefined}
           onSortChange={sort?.onSortChange}
           disabledKeys={disabledRows}

yarn.lock

@@ -7652,6 +7652,8 @@ __metadata:
     "@backstage/version-bridge": "workspace:^"
     "@remixicon/react": "npm:^4.6.0"
     "@tanstack/react-table": "npm:^8.21.3"
+    "@testing-library/jest-dom": "npm:^6.0.0"
+    "@testing-library/react": "npm:^16.0.0"
     "@types/react": "npm:^18.0.0"
     "@types/react-dom": "npm:^18.0.0"
     "@types/use-sync-external-store": "npm:^0.0.6"