diff --git a/packages/cli/src/ui/components/shared/BaseSelectionList.test.tsx b/packages/cli/src/ui/components/shared/BaseSelectionList.test.tsx
index d540fadf9a..12b4edd6c0 100644
--- a/packages/cli/src/ui/components/shared/BaseSelectionList.test.tsx
+++ b/packages/cli/src/ui/components/shared/BaseSelectionList.test.tsx
@@ -126,13 +126,16 @@ describe('BaseSelectionList', () => {
});
it('should render the selection indicator (● or space) and layout', async () => {
- const { lastFrame, unmount } = await renderComponent({}, 0);
+ const result = await renderComponent({}, 0);
+ const { lastFrame, unmount } = result;
const output = lastFrame();
// Use regex to assert the structure: Indicator + Whitespace + Number + Label
expect(output).toMatch(/●\s+1\.\s+Item A/);
expect(output).toMatch(/\s+2\.\s+Item B/);
expect(output).toMatch(/\s+3\.\s+Item C/);
+
+ await expect(result).toMatchSvgSnapshot();
unmount();
});
@@ -540,18 +543,14 @@ describe('BaseSelectionList', () => {
rows: 40,
});
- const { lastFrame, unmount, waitUntilReady } = await renderComponent(
- {},
- 0,
- ); // Item A selected
+ const result = await renderComponent({}, 0); // Item A selected
+ const { lastFrame, unmount, waitUntilReady } = result;
await waitUntilReady();
const output = lastFrame();
expect(output).toContain('Item A');
- // Since we can't easily inspect Box props from lastFrame(),
- // this test confirms it doesn't crash and renders correctly.
- // In a real scenario, we'd use a custom renderer or inspect the tree if possible.
+ await expect(result).toMatchSvgSnapshot();
unmount();
});
diff --git a/packages/cli/src/ui/components/shared/BaseSettingsDialog.test.tsx b/packages/cli/src/ui/components/shared/BaseSettingsDialog.test.tsx
index 4047ec9ef8..af90d46718 100644
--- a/packages/cli/src/ui/components/shared/BaseSettingsDialog.test.tsx
+++ b/packages/cli/src/ui/components/shared/BaseSettingsDialog.test.tsx
@@ -132,13 +132,16 @@ describe('BaseSettingsDialog', () => {
});
it('should render all items', async () => {
- const { lastFrame, unmount } = await renderDialog();
+ const result = await renderDialog();
+ const { lastFrame, unmount } = result;
const frame = lastFrame();
expect(frame).toContain('Boolean Setting');
expect(frame).toContain('String Setting');
expect(frame).toContain('Number Setting');
expect(frame).toContain('Enum Setting');
+
+ await expect(result).toMatchSvgSnapshot();
unmount();
});
@@ -201,8 +204,8 @@ describe('BaseSettingsDialog', () => {
});
it('should navigate down with arrow key', async () => {
- const { lastFrame, stdin, waitUntilReady, unmount } =
- await renderDialog();
+ const result = await renderDialog();
+ const { lastFrame, stdin, waitUntilReady, unmount } = result;
// Initially first item is active (indicated by bullet point)
const initialFrame = lastFrame();
@@ -215,10 +218,11 @@ describe('BaseSettingsDialog', () => {
await waitUntilReady();
// Navigation should move to next item
- await waitFor(() => {
+ await waitFor(async () => {
const frame = lastFrame();
// The active indicator should now be on a different row
expect(frame).toContain('String Setting');
+ await expect(result).toMatchSvgSnapshot();
});
unmount();
});
diff --git a/packages/cli/src/ui/components/shared/__snapshots__/BaseSelectionList-BaseSelectionList-Rendering-and-Structure-should-render-the-selection-indicator-or-space-and-layout.snap.svg b/packages/cli/src/ui/components/shared/__snapshots__/BaseSelectionList-BaseSelectionList-Rendering-and-Structure-should-render-the-selection-indicator-or-space-and-layout.snap.svg
new file mode 100644
index 0000000000..0e21bd58a8
--- /dev/null
+++ b/packages/cli/src/ui/components/shared/__snapshots__/BaseSelectionList-BaseSelectionList-Rendering-and-Structure-should-render-the-selection-indicator-or-space-and-layout.snap.svg
@@ -0,0 +1,11 @@
+
\ No newline at end of file
diff --git a/packages/cli/src/ui/components/shared/__snapshots__/BaseSelectionList-BaseSelectionList-Scroll-Arrows-showScrollArrows-should-apply-full-width-highlight-and-offset-when-horizontally-shifted.snap.svg b/packages/cli/src/ui/components/shared/__snapshots__/BaseSelectionList-BaseSelectionList-Scroll-Arrows-showScrollArrows-should-apply-full-width-highlight-and-offset-when-horizontally-shifted.snap.svg
new file mode 100644
index 0000000000..0e21bd58a8
--- /dev/null
+++ b/packages/cli/src/ui/components/shared/__snapshots__/BaseSelectionList-BaseSelectionList-Scroll-Arrows-showScrollArrows-should-apply-full-width-highlight-and-offset-when-horizontally-shifted.snap.svg
@@ -0,0 +1,11 @@
+
\ No newline at end of file
diff --git a/packages/cli/src/ui/components/shared/__snapshots__/BaseSelectionList.test.tsx.snap b/packages/cli/src/ui/components/shared/__snapshots__/BaseSelectionList.test.tsx.snap
index 040b6babec..0e8c869f47 100644
--- a/packages/cli/src/ui/components/shared/__snapshots__/BaseSelectionList.test.tsx.snap
+++ b/packages/cli/src/ui/components/shared/__snapshots__/BaseSelectionList.test.tsx.snap
@@ -1,5 +1,17 @@
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+exports[`BaseSelectionList > Rendering and Structure > should render the selection indicator (● or space) and layout 1`] = `
+"● 1. Item A
+ 2. Item B
+ 3. Item C"
+`;
+
+exports[`BaseSelectionList > Scroll Arrows (showScrollArrows) > should apply full-width highlight and offset when horizontally shifted 1`] = `
+"● 1. Item A
+ 2. Item B
+ 3. Item C"
+`;
+
exports[`BaseSelectionList > Scroll Arrows (showScrollArrows) > should not show arrows when list fits entirely 1`] = `
"● 1. Item A
2. Item B
diff --git a/packages/cli/src/ui/components/shared/__snapshots__/BaseSettingsDialog-BaseSettingsDialog-keyboard-navigation-should-navigate-down-with-arrow-key.snap.svg b/packages/cli/src/ui/components/shared/__snapshots__/BaseSettingsDialog-BaseSettingsDialog-keyboard-navigation-should-navigate-down-with-arrow-key.snap.svg
new file mode 100644
index 0000000000..2c9c3a626c
--- /dev/null
+++ b/packages/cli/src/ui/components/shared/__snapshots__/BaseSettingsDialog-BaseSettingsDialog-keyboard-navigation-should-navigate-down-with-arrow-key.snap.svg
@@ -0,0 +1,91 @@
+
\ No newline at end of file
diff --git a/packages/cli/src/ui/components/shared/__snapshots__/BaseSettingsDialog-BaseSettingsDialog-rendering-should-render-all-items.snap.svg b/packages/cli/src/ui/components/shared/__snapshots__/BaseSettingsDialog-BaseSettingsDialog-rendering-should-render-all-items.snap.svg
new file mode 100644
index 0000000000..fd59640fbe
--- /dev/null
+++ b/packages/cli/src/ui/components/shared/__snapshots__/BaseSettingsDialog-BaseSettingsDialog-rendering-should-render-all-items.snap.svg
@@ -0,0 +1,91 @@
+
\ No newline at end of file
diff --git a/packages/cli/src/ui/components/shared/__snapshots__/BaseSettingsDialog.test.tsx.snap b/packages/cli/src/ui/components/shared/__snapshots__/BaseSettingsDialog.test.tsx.snap
new file mode 100644
index 0000000000..acae5124a5
--- /dev/null
+++ b/packages/cli/src/ui/components/shared/__snapshots__/BaseSettingsDialog.test.tsx.snap
@@ -0,0 +1,57 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`BaseSettingsDialog > keyboard navigation > should navigate down with arrow key 1`] = `
+"╭──────────────────────────────────────────────────────────────────────────────────────────────────╮
+│ │
+│ > Test Settings │
+│ │
+│ Boolean Setting true │
+│ A boolean setting for testing │
+│ │
+│ ● String Setting test-value │
+│ A string setting for testing │
+│ │
+│ Number Setting 42 │
+│ A number setting for testing │
+│ │
+│ Enum Setting option-a │
+│ An enum setting for testing │
+│ │
+│ │
+│ Apply To │
+│ ● User Settings │
+│ Workspace Settings │
+│ System Settings │
+│ │
+│ (Use Enter to select, Ctrl+L to reset, Tab to change focus, Esc to close) │
+│ │
+╰──────────────────────────────────────────────────────────────────────────────────────────────────╯"
+`;
+
+exports[`BaseSettingsDialog > rendering > should render all items 1`] = `
+"╭──────────────────────────────────────────────────────────────────────────────────────────────────╮
+│ │
+│ > Test Settings │
+│ │
+│ ● Boolean Setting true │
+│ A boolean setting for testing │
+│ │
+│ String Setting test-value │
+│ A string setting for testing │
+│ │
+│ Number Setting 42 │
+│ A number setting for testing │
+│ │
+│ Enum Setting option-a │
+│ An enum setting for testing │
+│ │
+│ │
+│ Apply To │
+│ ● User Settings │
+│ Workspace Settings │
+│ System Settings │
+│ │
+│ (Use Enter to select, Ctrl+L to reset, Tab to change focus, Esc to close) │
+│ │
+╰──────────────────────────────────────────────────────────────────────────────────────────────────╯"
+`;