Migrate core render util to use xterm.js as part of the rendering loop. (#19044)

This commit is contained in:
Jacob Richman
2026-02-18 16:46:50 -08:00
committed by GitHub
parent 04c52513e7
commit 04f65f3d55
213 changed files with 7065 additions and 3852 deletions
@@ -8,6 +8,7 @@ import { renderWithProviders } from '../../../test-utils/render.js';
import { EnumSelector } from './EnumSelector.js';
import type { SettingEnumOption } from '../../../config/settingsSchema.js';
import { describe, it, expect } from 'vitest';
import { act } from 'react';
const LANGUAGE_OPTIONS: readonly SettingEnumOption[] = [
{ label: 'English', value: 'en' },
@@ -23,130 +24,152 @@ const NUMERIC_OPTIONS: readonly SettingEnumOption[] = [
];
describe('<EnumSelector />', () => {
it('renders with string options and matches snapshot', () => {
const { lastFrame } = renderWithProviders(
it('renders with string options and matches snapshot', async () => {
const { lastFrame, waitUntilReady, unmount } = renderWithProviders(
<EnumSelector
options={LANGUAGE_OPTIONS}
currentValue="en"
isActive={true}
onValueChange={() => {}}
onValueChange={async () => {}}
/>,
);
await waitUntilReady();
expect(lastFrame()).toMatchSnapshot();
unmount();
});
it('renders with numeric options and matches snapshot', () => {
const { lastFrame } = renderWithProviders(
it('renders with numeric options and matches snapshot', async () => {
const { lastFrame, waitUntilReady, unmount } = renderWithProviders(
<EnumSelector
options={NUMERIC_OPTIONS}
currentValue={2}
isActive={true}
onValueChange={() => {}}
onValueChange={async () => {}}
/>,
);
await waitUntilReady();
expect(lastFrame()).toMatchSnapshot();
unmount();
});
it('renders inactive state and matches snapshot', () => {
const { lastFrame } = renderWithProviders(
it('renders inactive state and matches snapshot', async () => {
const { lastFrame, waitUntilReady, unmount } = renderWithProviders(
<EnumSelector
options={LANGUAGE_OPTIONS}
currentValue="zh"
isActive={false}
onValueChange={() => {}}
onValueChange={async () => {}}
/>,
);
await waitUntilReady();
expect(lastFrame()).toMatchSnapshot();
unmount();
});
it('renders with single option and matches snapshot', () => {
it('renders with single option and matches snapshot', async () => {
const singleOption: readonly SettingEnumOption[] = [
{ label: 'Only Option', value: 'only' },
];
const { lastFrame } = renderWithProviders(
const { lastFrame, waitUntilReady, unmount } = renderWithProviders(
<EnumSelector
options={singleOption}
currentValue="only"
isActive={true}
onValueChange={() => {}}
onValueChange={async () => {}}
/>,
);
await waitUntilReady();
expect(lastFrame()).toMatchSnapshot();
unmount();
});
it('renders nothing when no options are provided', () => {
const { lastFrame } = renderWithProviders(
it('renders nothing when no options are provided', async () => {
const { lastFrame, waitUntilReady, unmount } = renderWithProviders(
<EnumSelector
options={[]}
currentValue=""
isActive={true}
onValueChange={() => {}}
onValueChange={async () => {}}
/>,
);
expect(lastFrame()).toBe('');
await waitUntilReady();
expect(lastFrame({ allowEmpty: true })).toBe('');
unmount();
});
it('handles currentValue not found in options', () => {
const { lastFrame } = renderWithProviders(
it('handles currentValue not found in options', async () => {
const { lastFrame, waitUntilReady, unmount } = renderWithProviders(
<EnumSelector
options={LANGUAGE_OPTIONS}
currentValue="invalid"
isActive={true}
onValueChange={() => {}}
onValueChange={async () => {}}
/>,
);
await waitUntilReady();
// Should default to first option
expect(lastFrame()).toContain('English');
unmount();
});
it('updates when currentValue changes externally', () => {
const { rerender, lastFrame } = renderWithProviders(
<EnumSelector
options={LANGUAGE_OPTIONS}
currentValue="en"
isActive={true}
onValueChange={() => {}}
/>,
);
it('updates when currentValue changes externally', async () => {
const { rerender, lastFrame, waitUntilReady, unmount } =
renderWithProviders(
<EnumSelector
options={LANGUAGE_OPTIONS}
currentValue="en"
isActive={true}
onValueChange={async () => {}}
/>,
);
await waitUntilReady();
expect(lastFrame()).toContain('English');
rerender(
<EnumSelector
options={LANGUAGE_OPTIONS}
currentValue="zh"
isActive={true}
onValueChange={() => {}}
/>,
);
await act(async () => {
rerender(
<EnumSelector
options={LANGUAGE_OPTIONS}
currentValue="zh"
isActive={true}
onValueChange={async () => {}}
/>,
);
});
await waitUntilReady();
expect(lastFrame()).toContain('中文 (简体)');
unmount();
});
it('shows navigation arrows when multiple options available', () => {
const { lastFrame } = renderWithProviders(
it('shows navigation arrows when multiple options available', async () => {
const { lastFrame, waitUntilReady, unmount } = renderWithProviders(
<EnumSelector
options={LANGUAGE_OPTIONS}
currentValue="en"
isActive={true}
onValueChange={() => {}}
onValueChange={async () => {}}
/>,
);
await waitUntilReady();
expect(lastFrame()).toContain('←');
expect(lastFrame()).toContain('→');
unmount();
});
it('hides navigation arrows when single option available', () => {
it('hides navigation arrows when single option available', async () => {
const singleOption: readonly SettingEnumOption[] = [
{ label: 'Only Option', value: 'only' },
];
const { lastFrame } = renderWithProviders(
const { lastFrame, waitUntilReady, unmount } = renderWithProviders(
<EnumSelector
options={singleOption}
currentValue="only"
isActive={true}
onValueChange={() => {}}
onValueChange={async () => {}}
/>,
);
await waitUntilReady();
expect(lastFrame()).not.toContain('←');
expect(lastFrame()).not.toContain('→');
unmount();
});
});