test(ui): cover bounded editor height contracts

This commit is contained in:
Tam Nhu Tran
2026-03-26 15:31:32 -04:00
parent aeab2840de
commit 92d067d062
2 changed files with 36 additions and 2 deletions
@@ -29,6 +29,27 @@ const boundedConsumers = [
},
] as const;
const boundedLayoutContracts = [
{
file: 'src/components/profiles/editor/index.tsx',
snippets: [
'min-h-0 flex-1 grid grid-cols-[40%_60%] divide-x overflow-hidden',
'flex min-h-0 min-w-0 flex-col overflow-hidden',
],
},
{
file: 'src/components/cliproxy/provider-editor/index.tsx',
snippets: [
'min-h-0 flex-1 grid grid-cols-[40%_60%] divide-x overflow-hidden',
'flex min-h-0 min-w-0 flex-col overflow-hidden',
],
},
{
file: 'src/pages/api.tsx',
snippets: ['flex min-h-0 flex-1 flex-col min-w-0 overflow-hidden'],
},
] as const;
describe('bounded CodeEditor consumers', () => {
it.each(boundedConsumers)('$file opts into fill-parent mode for every bounded editor', ({
file,
@@ -39,4 +60,15 @@ describe('bounded CodeEditor consumers', () => {
expect(matches).toHaveLength(expectedCount);
});
it.each(boundedLayoutContracts)(
'$file keeps bounded editor ancestors shrinkable',
({ file, snippets }) => {
const source = readFileSync(resolve(process.cwd(), file), 'utf8');
for (const snippet of snippets) {
expect(source).toContain(snippet);
}
}
);
});
@@ -20,9 +20,10 @@ describe('CodeEditor', () => {
);
const viewport = container.querySelector('[data-slot="code-editor-viewport"]');
const root = container.firstElementChild;
expect(viewport).toBeInTheDocument();
expect(viewport).toHaveStyle({ height: '100%' });
expect(root).toHaveStyle({ height: '100%' });
expect(viewport).not.toContainElement(screen.getByText('Valid JSON'));
});
@@ -40,8 +41,9 @@ describe('CodeEditor', () => {
const viewport = container.querySelector('[data-slot="code-editor-viewport"]');
const textarea = container.querySelector('textarea');
const root = container.firstElementChild;
expect(viewport).toHaveStyle({ height: 'calc(60vh - 120px)' });
expect(root).toHaveStyle({ height: 'calc(60vh - 120px)' });
expect(textarea).toBeDisabled();
expect(viewport).not.toContainElement(screen.getByText('(Read-only)'));
});