diff --git a/web/packages/common/src/components/DataView/useRowClick.test.tsx b/web/packages/common/src/components/DataView/useRowClick.test.tsx
new file mode 100644
index 0000000000..631f762acc
--- /dev/null
+++ b/web/packages/common/src/components/DataView/useRowClick.test.tsx
@@ -0,0 +1,260 @@
+// SPDX-FileCopyrightText: Copyright (c) 2025-2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.
+// SPDX-License-Identifier: Apache-2.0
+
+import { useRowClick } from '@nemo/common/src/components/DataView/useRowClick';
+import { render, screen, fireEvent } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { FC } from 'react';
+
+// Mock internal DataView module – useRowClick imports it only for TypeScript types
+// but the module would still be loaded at runtime. Mocking avoids loading its full
+// dependency tree (tanstack-table, KUI components, etc.) in this isolated test.
+vi.mock('@nemo/common/src/components/DataView/internal', () => ({
+  TanstackTable: {},
+  Root: {},
+}));
+
+// ──────────────────────────────────────────────────────────────────────────
+// Minimal test helpers
+// ──────────────────────────────────────────────────────────────────────────
+
+type Item = { id: string; name: string };
+
+// Helper used by Harness to invoke the wrapped makeColumns function and render
+// the resulting cell content for each row.
+const HELPER = {
+  accessor: (field: string, opts: Record<string, unknown> = {}) => ({
+    id: field,
+    accessorKey: field,
+    ...opts,
+  }),
+};
+const PREBUILT = {
+  rowSelectionColumn: (opts: Record<string, unknown> = {}) => ({
+    id: 'row-selection',
+    ...opts,
+  }),
+  rowActionsColumn: (opts: Record<string, unknown> = {}) => ({
+    id: 'row-actions',
+    ...opts,
+  }),
+  rowExpansionColumn: (opts: Record<string, unknown> = {}) => ({
+    id: 'row-expansion',
+    ...opts,
+  }),
+};
+
+// Minimal test harness that exercises useRowClick without the full DataView stack.
+// It renders a <table> with one row per data item. Inside the first cell it places
+// the keyboard target injected by wrapColumns, and the onClick handler is attached
+// to the table element (same event-delegation pattern as the real TableContent).
+interface HarnessProps {
+  data: Item[];
+  onRowClick?: (row: Item, index: number) => void;
+}
+
+const Harness: FC<HarnessProps> = ({ data, onRowClick }) => {
+  const { wrapColumns, onClick, className } = useRowClick(onRowClick, data);
+
+  // Build a single accessor column.
+  const baseMakeColumns = (helper: typeof HELPER) => [
+    helper.accessor('name', { header: 'Name' }),
+  ];
+
+  // wrapColumns(baseMakeColumns) returns a new MakeColumns function.
+  // Invoke it immediately with the test helper/prebuilt to get the column array.
+  const wrappedMakeColumns = wrapColumns(
+    baseMakeColumns as Parameters<typeof wrapColumns>[0]
+  );
+  const columns = wrappedMakeColumns(
+    HELPER as Parameters<typeof wrappedMakeColumns>[0],
+    PREBUILT as Parameters<typeof wrappedMakeColumns>[1]
+  );
+
+  return (
+    // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-noninteractive-element-interactions
+    <table className={className} onClick={onClick as React.MouseEventHandler<HTMLTableElement>}>
+      <tbody>
+        {data.map((item, index) => {
+          const cellContent =
+            typeof columns[0]?.cell === 'function'
+              ? (columns[0].cell as (ctx: Record<string, unknown>) => React.ReactNode)({
+                  row: {
+                    original: item,
+                    index,
+                    depth: 0,
+                    getParentRow: () => undefined,
+                  },
+                  getValue: () => item.name,
+                  renderValue: () => item.name,
+                })
+              : item.name;
+
+          return (
+            <tr key={item.id} data-index={index}>
+              <td>{cellContent}</td>
+            </tr>
+          );
+        })}
+      </tbody>
+    </table>
+  );
+};
+
+const testData: Item[] = [
+  { id: '1', name: 'Alice' },
+  { id: '2', name: 'Bob' },
+];
+
+// ──────────────────────────────────────────────────────────────────────────
+// Tests
+// ──────────────────────────────────────────────────────────────────────────
+
+describe('useRowClick – RowKeyboardTarget', () => {
+  it('renders a native <button> element (not a span) for each row', () => {
+    render(<Harness data={testData} onRowClick={vi.fn()} />);
+
+    const buttons = screen.getAllByRole('button', { name: 'Open row' });
+    expect(buttons).toHaveLength(testData.length);
+    buttons.forEach((btn) => {
+      expect(btn.tagName).toBe('BUTTON');
+    });
+  });
+
+  it('sets type="button" on each keyboard target to prevent form submission', () => {
+    render(<Harness data={testData} onRowClick={vi.fn()} />);
+
+    const buttons = screen.getAllByRole('button', { name: 'Open row' });
+    buttons.forEach((btn) => {
+      expect(btn).toHaveAttribute('type', 'button');
+    });
+  });
+
+  it('labels each keyboard target as "Open row"', () => {
+    render(<Harness data={testData} onRowClick={vi.fn()} />);
+
+    expect(screen.getAllByRole('button', { name: 'Open row' })).toHaveLength(testData.length);
+  });
+
+  it('applies the sr-only class for visual hiding', () => {
+    render(<Harness data={testData} onRowClick={vi.fn()} />);
+
+    const buttons = screen.getAllByRole('button', { name: 'Open row' });
+    buttons.forEach((btn) => {
+      expect(btn).toHaveClass('sr-only');
+    });
+  });
+
+  it('sets data-row-index to the correct row position', () => {
+    render(<Harness data={testData} onRowClick={vi.fn()} />);
+
+    const buttons = screen.getAllByRole('button', { name: 'Open row' });
+    expect(buttons[0]).toHaveAttribute('data-row-index', '0');
+    expect(buttons[1]).toHaveAttribute('data-row-index', '1');
+  });
+
+  it('does NOT set data-sub-index for top-level rows', () => {
+    render(<Harness data={testData} onRowClick={vi.fn()} />);
+
+    const buttons = screen.getAllByRole('button', { name: 'Open row' });
+    buttons.forEach((btn) => {
+      expect(btn).not.toHaveAttribute('data-sub-index');
+    });
+  });
+
+  it('calls onRowClick when the keyboard target button is clicked', () => {
+    const onRowClick = vi.fn();
+    render(<Harness data={testData} onRowClick={onRowClick} />);
+
+    const buttons = screen.getAllByRole('button', { name: 'Open row' });
+    fireEvent.click(buttons[0]);
+
+    expect(onRowClick).toHaveBeenCalledWith(testData[0], 0);
+  });
+
+  it('calls onRowClick for the second row button click', () => {
+    const onRowClick = vi.fn();
+    render(<Harness data={testData} onRowClick={onRowClick} />);
+
+    const buttons = screen.getAllByRole('button', { name: 'Open row' });
+    fireEvent.click(buttons[1]);
+
+    expect(onRowClick).toHaveBeenCalledWith(testData[1], 1);
+  });
+
+  it('activates via Enter key (native button behaviour)', async () => {
+    const user = userEvent.setup();
+    const onRowClick = vi.fn();
+    render(<Harness data={testData} onRowClick={onRowClick} />);
+
+    const buttons = screen.getAllByRole('button', { name: 'Open row' });
+    buttons[0].focus();
+    await user.keyboard('{Enter}');
+
+    expect(onRowClick).toHaveBeenCalledWith(testData[0], 0);
+  });
+
+  it('activates via Space key (native button behaviour)', async () => {
+    const user = userEvent.setup();
+    const onRowClick = vi.fn();
+    render(<Harness data={testData} onRowClick={onRowClick} />);
+
+    const buttons = screen.getAllByRole('button', { name: 'Open row' });
+    buttons[1].focus();
+    await user.keyboard(' ');
+
+    expect(onRowClick).toHaveBeenCalledWith(testData[1], 1);
+  });
+
+  it('does not render keyboard targets when onRowClick is undefined', () => {
+    render(<Harness data={testData} />);
+
+    expect(screen.queryAllByRole('button', { name: 'Open row' })).toHaveLength(0);
+  });
+
+  it('adds cursor-pointer class to the table when onRowClick is provided', () => {
+    render(<Harness data={testData} onRowClick={vi.fn()} />);
+
+    const table = screen.getByRole('table');
+    expect(table.className).toContain('cursor-pointer');
+  });
+
+  it('does not add cursor-pointer class when onRowClick is undefined', () => {
+    render(<Harness data={testData} />);
+
+    const table = screen.getByRole('table');
+    expect(table.className).not.toContain('cursor-pointer');
+  });
+
+  it('does not call onRowClick when Tab key is pressed (regression: old onKeyDown guard replaced by native button)', async () => {
+    const user = userEvent.setup();
+    const onRowClick = vi.fn();
+    render(<Harness data={testData} onRowClick={onRowClick} />);
+
+    const buttons = screen.getAllByRole('button', { name: 'Open row' });
+    buttons[0].focus();
+    await user.keyboard('{Tab}');
+
+    expect(onRowClick).not.toHaveBeenCalled();
+  });
+});
+
+describe('useRowClick – event delegation', () => {
+  it('calls onRowClick when a non-interactive table cell is clicked', () => {
+    const onRowClick = vi.fn();
+    render(<Harness data={testData} onRowClick={onRowClick} />);
+
+    fireEvent.click(screen.getByText('Alice'));
+
+    expect(onRowClick).toHaveBeenCalledWith(testData[0], 0);
+  });
+
+  it('does not call onRowClick when no handler is attached', () => {
+    const onRowClick = vi.fn();
+    render(<Harness data={testData} />);
+
+    fireEvent.click(screen.getByText('Alice'));
+
+    expect(onRowClick).not.toHaveBeenCalled();
+  });
+});
\ No newline at end of file
diff --git a/web/packages/common/src/components/Nebula/Nebula.test.tsx b/web/packages/common/src/components/Nebula/Nebula.test.tsx
new file mode 100644
index 0000000000..8db668ab6a
--- /dev/null
+++ b/web/packages/common/src/components/Nebula/Nebula.test.tsx
@@ -0,0 +1,64 @@
+// SPDX-FileCopyrightText: Copyright (c) 2025-2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.
+// SPDX-License-Identifier: Apache-2.0
+
+import { Nebula } from '@nemo/common/src/components/Nebula/index';
+import { render, screen } from '@testing-library/react';
+
+// Mock the animation module – tests are not concerned with canvas drawing logic.
+vi.mock('@nemo/common/src/components/Nebula/animate', () => ({
+  initialize: vi.fn(),
+}));
+
+describe('Nebula', () => {
+  describe('canvas accessibility attributes', () => {
+    it('sets aria-hidden="true" on the canvas element', () => {
+      render(<Nebula />);
+
+      // eslint-disable-next-line testing-library/no-node-access
+      const canvas = document.querySelector('canvas');
+      expect(canvas).toBeInTheDocument();
+      expect(canvas).toHaveAttribute('aria-hidden', 'true');
+    });
+
+    it('sets tabIndex={-1} on the canvas to remove it from the tab order', () => {
+      render(<Nebula />);
+
+      // eslint-disable-next-line testing-library/no-node-access
+      const canvas = document.querySelector('canvas');
+      expect(canvas).toBeInTheDocument();
+      expect(canvas).toHaveAttribute('tabindex', '-1');
+    });
+
+    it('hides the canvas from the accessibility tree (canvas is not in the document by role)', () => {
+      render(<Nebula />);
+
+      // aria-hidden removes the element from the accessibility tree, so it has no ARIA role.
+      // Verify it cannot be found via an accessible query.
+      expect(screen.queryByRole('img')).not.toBeInTheDocument();
+    });
+  });
+
+  describe('container', () => {
+    it('renders the outer container with data-testid="nv-nebula"', () => {
+      render(<Nebula />);
+
+      expect(screen.getByTestId('nv-nebula')).toBeInTheDocument();
+    });
+
+    it('applies a custom className to the outer container', () => {
+      render(<Nebula className="my-custom-class" />);
+
+      expect(screen.getByTestId('nv-nebula')).toHaveClass('my-custom-class');
+    });
+  });
+
+  describe('canvas element is present (regression: ensures canvas is not removed)', () => {
+    it('renders exactly one canvas element', () => {
+      render(<Nebula />);
+
+      // eslint-disable-next-line testing-library/no-node-access
+      const canvases = document.querySelectorAll('canvas');
+      expect(canvases).toHaveLength(1);
+    });
+  });
+});
\ No newline at end of file
diff --git a/web/packages/common/src/components/StatusBadge/StatusBadge.test.tsx b/web/packages/common/src/components/StatusBadge/StatusBadge.test.tsx
index 343abc1016..bd329a0113 100644
--- a/web/packages/common/src/components/StatusBadge/StatusBadge.test.tsx
+++ b/web/packages/common/src/components/StatusBadge/StatusBadge.test.tsx
@@ -4,14 +4,13 @@
 import { BadgeStatus, badgeStatus } from '@nemo/common/src/components/StatusBadge/badgeStatus';
 import { StatusBadge } from '@nemo/common/src/components/StatusBadge/index';
 import * as customQueries from '@nemo/common/src/tests/customQueries';
-import { queries, render, screen, within } from '@testing-library/react';
+import { queries, render, screen } from '@testing-library/react';
 import { CircleCheck } from 'lucide-react';
 
 const allQueries = {
   ...queries,
   ...customQueries,
 };
-const customScreen = within(document.body, allQueries);
 
 describe('StatusBadge component', () => {
   beforeEach(() => {
@@ -84,10 +83,6 @@ describe('StatusBadge component', () => {
       expect(badge).toBeInTheDocument();
       expect(badge).toHaveTextContent(expectedBadge.label);
 
-      // Check if icon is rendered when icon exists
-      const icon = customScreen.getByRole('img');
-      expect(icon).toBeInTheDocument();
-
       unmount();
     });
   });
@@ -146,6 +141,47 @@ describe('StatusBadge component', () => {
     });
   });
 
+  describe('icon accessibility attributes', () => {
+    it('sets aria-hidden="true" on the status icon (not role="img")', () => {
+      render(<StatusBadge status="completed" />);
+
+      // CircleCheck is rendered for the "completed" status
+      // eslint-disable-next-line testing-library/no-node-access
+      const icon = document.querySelector('.lucide-circle-check');
+      expect(icon).toBeInTheDocument();
+      expect(icon).toHaveAttribute('aria-hidden', 'true');
+    });
+
+    it('does NOT set role="img" on the status icon', () => {
+      render(<StatusBadge status="completed" />);
+
+      // Icons are decorative; they must not be exposed to AT via role="img"
+      expect(screen.queryByRole('img')).not.toBeInTheDocument();
+    });
+
+    it('sets aria-hidden="true" on a custom statusConfig icon', () => {
+      const CONFIG = {
+        success: { label: 'Success', color: 'green' as const, icon: CircleCheck },
+      };
+      render(<StatusBadge status="success" statusConfig={CONFIG} />);
+
+      // eslint-disable-next-line testing-library/no-node-access
+      const icon = document.querySelector('.lucide-circle-check');
+      expect(icon).toBeInTheDocument();
+      expect(icon).toHaveAttribute('aria-hidden', 'true');
+      expect(screen.queryByRole('img')).not.toBeInTheDocument();
+    });
+
+    it('does not render any img role element when config entry has no icon', () => {
+      const CONFIG = {
+        error: { label: 'Error', color: 'red' as const },
+      };
+      render(<StatusBadge status="error" statusConfig={CONFIG} />);
+
+      expect(screen.queryByRole('img')).not.toBeInTheDocument();
+    });
+  });
+
   describe('statusConfig prop (config-driven path)', () => {
     const STATUS_CONFIG = {
       success: { label: 'Success', color: 'green' as const, icon: CircleCheck },
@@ -157,14 +193,9 @@ describe('StatusBadge component', () => {
       expect(screen.getByTestId('nv-badge')).toHaveTextContent('Success');
     });
 
-    it('renders icon when config entry has one', () => {
-      render(<StatusBadge status="success" statusConfig={STATUS_CONFIG} />);
-      expect(screen.getByRole('img')).toBeInTheDocument();
-    });
-
-    it('renders no icon when config entry omits one', () => {
+    it('renders the label for a config entry without an icon', () => {
       render(<StatusBadge status="error" statusConfig={STATUS_CONFIG} />);
-      expect(screen.queryByRole('img')).not.toBeInTheDocument();
+      expect(screen.getByTestId('nv-badge')).toHaveTextContent('Error');
     });
 
     it('falls back to provided fallback for unknown status', () => {
diff --git a/web/packages/common/src/components/UploadModal/SimpleFilesTable.test.tsx b/web/packages/common/src/components/UploadModal/SimpleFilesTable.test.tsx
index f839793c4b..5ff51a53c3 100644
--- a/web/packages/common/src/components/UploadModal/SimpleFilesTable.test.tsx
+++ b/web/packages/common/src/components/UploadModal/SimpleFilesTable.test.tsx
@@ -377,7 +377,7 @@ describe('SimpleFilesTable', () => {
         }),
       });
 
-      const fileInput = screen.getByLabelText('Upload More Files', {
+      const fileInput = screen.getByLabelText('Upload more files', {
         selector: 'input',
       }) as HTMLInputElement;
       expect(fileInput).toHaveClass('sr-only');
@@ -392,7 +392,7 @@ describe('SimpleFilesTable', () => {
         wrapper: createWrapper({ files: mockNewFiles }, mockDispatch),
       });
 
-      const fileInput = screen.getByLabelText('Upload More Files', {
+      const fileInput = screen.getByLabelText('Upload more files', {
         selector: 'input',
       }) as HTMLInputElement;
       const newFile = new File(['new content'], 'newfile.jsonl');
@@ -416,13 +416,49 @@ describe('SimpleFilesTable', () => {
         wrapper: createWrapper({ files: mockNewFiles }),
       });
 
-      const fileInput = screen.getByLabelText('Upload More Files', {
+      const fileInput = screen.getByLabelText('Upload more files', {
         selector: 'input',
       });
 
-      expect(fileInput).toHaveAttribute('id', 'upload-more-files');
       expect(fileInput).toHaveAttribute('type', 'file');
     });
+
+    it('file input does NOT have an id attribute (ref-based approach, no htmlFor)', () => {
+      render(<SimpleFilesTable />, {
+        wrapper: createWrapper({ files: mockNewFiles }),
+      });
+
+      const fileInput = screen.getByLabelText('Upload more files', {
+        selector: 'input',
+      });
+
+      // The old implementation used id="upload-more-files"; the new approach uses a ref
+      // and an aria-label, so no id should be present.
+      expect(fileInput).not.toHaveAttribute('id');
+    });
+
+    it('file input has tabIndex={-1} to keep it out of the tab order', () => {
+      render(<SimpleFilesTable />, {
+        wrapper: createWrapper({ files: mockNewFiles }),
+      });
+
+      const fileInput = screen.getByLabelText('Upload more files', {
+        selector: 'input',
+      });
+
+      expect(fileInput).toHaveAttribute('tabindex', '-1');
+    });
+
+    it('"Upload More Files" button is a native button (not a label element)', () => {
+      render(<SimpleFilesTable />, {
+        wrapper: createWrapper({ files: mockNewFiles }),
+      });
+
+      const button = screen.getByText('Upload More Files');
+      // The button is now a KUI <Button kind="tertiary">, not a <label> element
+      expect(button.closest('button')).not.toBeNull();
+      expect(button.closest('label')).toBeNull();
+    });
   });
 
   describe('single-select (allowMultipleFileSelection=false, default)', () => {
diff --git a/web/packages/studio/src/components/FileTag/FileTag.test.tsx b/web/packages/studio/src/components/FileTag/FileTag.test.tsx
new file mode 100644
index 0000000000..3ac1ada99b
--- /dev/null
+++ b/web/packages/studio/src/components/FileTag/FileTag.test.tsx
@@ -0,0 +1,124 @@
+// SPDX-FileCopyrightText: Copyright (c) 2025-2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.
+// SPDX-License-Identifier: Apache-2.0
+
+import { FileTag } from '@studio/components/FileTag/index';
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+
+// Use the actual KUI components - they are inlined in the test environment.
+// FileTag uses Button, Flex, Tag from @nvidia/foundations-react-core plus lucide-react icons.
+
+describe('FileTag', () => {
+  describe('when fileName is provided', () => {
+    it('renders the file name', () => {
+      render(<FileTag fileName="training.jsonl" />);
+      expect(screen.getByText('training.jsonl')).toBeInTheDocument();
+    });
+
+    it('does not render a "no file" button when a file name is present', () => {
+      render(<FileTag fileName="training.jsonl" />);
+      // The missingFileNameChip is not rendered when fileName exists
+      expect(screen.queryByText('No file detected')).not.toBeInTheDocument();
+    });
+  });
+
+  describe('when fileName is absent', () => {
+    it('renders a button when onNoFileClick is provided', () => {
+      render(<FileTag onNoFileClick={vi.fn()} />);
+
+      // The KUI Button renders as a <button> element
+      const button = screen.getByRole('button');
+      expect(button).toBeInTheDocument();
+    });
+
+    it('calls onNoFileClick when the button is clicked', async () => {
+      const user = userEvent.setup();
+      const onNoFileClick = vi.fn();
+      render(<FileTag onNoFileClick={onNoFileClick} />);
+
+      await user.click(screen.getByRole('button'));
+
+      expect(onNoFileClick).toHaveBeenCalledOnce();
+    });
+
+    it('does NOT render a button when onNoFileClick is not provided', () => {
+      render(<FileTag />);
+
+      // With no onNoFileClick, the component renders a plain <div>, not a button
+      expect(screen.queryByRole('button')).not.toBeInTheDocument();
+    });
+
+    it('renders the default noFileText when onNoFileClick is provided', () => {
+      render(<FileTag onNoFileClick={vi.fn()} />);
+      expect(screen.getByText('No file detected')).toBeInTheDocument();
+    });
+
+    it('renders the default noFileText when neither fileName nor onNoFileClick is provided', () => {
+      render(<FileTag />);
+      expect(screen.getByText('No file detected')).toBeInTheDocument();
+    });
+
+    it('renders a custom noFileText', () => {
+      render(<FileTag noFileText="Select a file" onNoFileClick={vi.fn()} />);
+      expect(screen.getByText('Select a file')).toBeInTheDocument();
+    });
+
+    it('renders required styling when required=true and no file is present', () => {
+      render(<FileTag required />);
+      // In required mode, missingFileNameChip uses a <p> with danger styling
+      const p = document.querySelector('p');
+      expect(p).toBeInTheDocument();
+      expect(p).toHaveClass('text-feedback-danger');
+    });
+  });
+
+  describe('status icons', () => {
+    it('renders the success icon when status="success"', () => {
+      render(<FileTag fileName="file.jsonl" status="success" />);
+      // CircleCheck renders with class lucide-circle-check
+      // eslint-disable-next-line testing-library/no-node-access
+      expect(document.querySelector('.lucide-circle-check')).toBeInTheDocument();
+    });
+
+    it('renders the pending icon when status="pending"', () => {
+      render(<FileTag fileName="file.jsonl" status="pending" />);
+      // RefreshCw renders with class lucide-refresh-cw
+      // eslint-disable-next-line testing-library/no-node-access
+      expect(document.querySelector('.lucide-refresh-cw')).toBeInTheDocument();
+    });
+
+    it('renders the error icon when status="error"', () => {
+      render(<FileTag fileName="file.jsonl" status="error" />);
+      // CircleAlert renders with class lucide-circle-alert
+      // eslint-disable-next-line testing-library/no-node-access
+      expect(document.querySelector('.lucide-circle-alert')).toBeInTheDocument();
+    });
+
+    it('renders no status icon when status is absent', () => {
+      render(<FileTag fileName="file.jsonl" />);
+      // eslint-disable-next-line testing-library/no-node-access
+      expect(document.querySelector('.lucide-circle-check')).not.toBeInTheDocument();
+      // eslint-disable-next-line testing-library/no-node-access
+      expect(document.querySelector('.lucide-refresh-cw')).not.toBeInTheDocument();
+      // eslint-disable-next-line testing-library/no-node-access
+      expect(document.querySelector('.lucide-circle-alert')).not.toBeInTheDocument();
+    });
+  });
+
+  describe('regression: replaced div[role=button] with Button component', () => {
+    it('clicking element with onNoFileClick is a native button, not a div', () => {
+      render(<FileTag onNoFileClick={vi.fn()} />);
+      const button = screen.getByRole('button');
+      expect(button.tagName).toBe('BUTTON');
+    });
+
+    it('without onNoFileClick, the no-file element is not a button', () => {
+      const { container } = render(<FileTag />);
+      // Should be a plain div, not button
+      // eslint-disable-next-line testing-library/no-node-access,testing-library/no-container
+      const divs = container.querySelectorAll('div');
+      expect(divs.length).toBeGreaterThan(0);
+      expect(screen.queryByRole('button')).not.toBeInTheDocument();
+    });
+  });
+});
\ No newline at end of file
diff --git a/web/packages/studio/src/components/SafeSynthesizerFilesetPreview/FilesetFilePreviewLink.test.tsx b/web/packages/studio/src/components/SafeSynthesizerFilesetPreview/FilesetFilePreviewLink.test.tsx
index d6a76ee8a1..7a08c87067 100644
--- a/web/packages/studio/src/components/SafeSynthesizerFilesetPreview/FilesetFilePreviewLink.test.tsx
+++ b/web/packages/studio/src/components/SafeSynthesizerFilesetPreview/FilesetFilePreviewLink.test.tsx
@@ -73,6 +73,29 @@ describe('FilesetFilePreviewLink', () => {
 
       expect(screen.queryByRole('dialog')).not.toBeInTheDocument();
     });
+
+    it('trigger element is a native button, not an anchor or link', () => {
+      renderComponent({
+        url: 'fileset://myorg/mydataset/data/train.csv',
+        children: <span>Preview file</span>,
+      });
+
+      // The component changed from <Anchor role="button"> to <Button kind="tertiary">
+      // A proper <button> must be used for interactive controls (a11y requirement)
+      const trigger = screen.getByText('Preview file').closest('button');
+      expect(trigger).not.toBeNull();
+      expect(trigger?.tagName).toBe('BUTTON');
+    });
+
+    it('trigger element is NOT an anchor element', () => {
+      renderComponent({
+        url: 'fileset://myorg/mydataset/data/train.csv',
+        children: <span>Preview file</span>,
+      });
+
+      // Previously was an <Anchor> (renders as <a>); now should be a <button>
+      expect(screen.getByText('Preview file').closest('a')).toBeNull();
+    });
   });
 
   describe('CSV file preview', () => {