agent-ecosystem/test/renderer/components/team/dialogs/LimitContextCheckbox.test.tsx

102 lines
3 KiB
TypeScript

import React, { act } from 'react';
import { createRoot } from 'react-dom/client';
import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
import { LimitContextCheckbox } from '@renderer/components/team/dialogs/LimitContextCheckbox';
vi.mock('@renderer/components/ui/checkbox', () => ({
Checkbox: ({
checked,
disabled,
id,
onCheckedChange,
}: {
checked?: boolean;
disabled?: boolean;
id?: string;
onCheckedChange?: (checked: boolean) => void;
}) =>
React.createElement('input', {
checked: Boolean(checked),
disabled,
id,
type: 'checkbox',
onChange: (event: React.ChangeEvent<HTMLInputElement>) =>
onCheckedChange?.(event.target.checked),
}),
}));
vi.mock('@renderer/components/ui/label', () => ({
Label: ({
children,
...props
}: React.LabelHTMLAttributes<HTMLLabelElement> & { children: React.ReactNode }) =>
React.createElement('label', props, children),
}));
vi.mock('@renderer/components/ui/tooltip', () => ({
Tooltip: ({ children }: { children: React.ReactNode }) =>
React.createElement('div', null, children),
TooltipContent: ({ children }: { children: React.ReactNode }) =>
React.createElement('div', null, children),
TooltipProvider: ({ children }: { children: React.ReactNode }) =>
React.createElement('div', null, children),
TooltipTrigger: ({ children }: { children: React.ReactNode }) =>
React.createElement('div', null, children),
}));
function renderLimitContextCheckbox(
overrides: Partial<React.ComponentProps<typeof LimitContextCheckbox>> = {}
): { host: HTMLDivElement; root: ReturnType<typeof createRoot> } {
const host = document.createElement('div');
document.body.appendChild(host);
const root = createRoot(host);
act(() => {
root.render(
React.createElement(LimitContextCheckbox, {
id: 'limit-context',
checked: false,
onCheckedChange: () => undefined,
...overrides,
})
);
});
return { host, root };
}
describe('LimitContextCheckbox', () => {
beforeEach(() => {
vi.stubGlobal('IS_REACT_ACT_ENVIRONMENT', true);
});
afterEach(() => {
document.body.innerHTML = '';
});
it('renders disabled always-200K state as checked and disabled', () => {
const { host, root } = renderLimitContextCheckbox({ checked: false, disabled: true });
const checkbox = host.querySelector('input[type="checkbox"]') as HTMLInputElement;
expect(checkbox.checked).toBe(true);
expect(checkbox.disabled).toBe(true);
expect(host.textContent).toContain('always 200K for this model');
act(() => {
root.unmount();
});
});
it('preserves the real checked state when enabled', () => {
const { host, root } = renderLimitContextCheckbox({ checked: false, disabled: false });
const checkbox = host.querySelector('input[type="checkbox"]') as HTMLInputElement;
expect(checkbox.checked).toBe(false);
expect(checkbox.disabled).toBe(false);
act(() => {
root.unmount();
});
});
});