Files
longhaul.cpp/tools/ui/tests/client/mcp-display-name.svelte.test.ts
T
2026-07-29 01:00:10 -05:00

74 lines
2.3 KiB
TypeScript

import { beforeEach, describe, expect, it } from 'vitest';
import { render } from 'vitest-browser-svelte';
import { McpServerForm } from '$lib/components/app/mcp';
import { mcpStore } from '$lib/stores/mcp.svelte';
import { settingsStore } from '$lib/stores/settings.svelte';
describe('mcp server display name', () => {
beforeEach(() => {
settingsStore.updateConfig('mcpServers', '[]');
});
it('custom display name wins over the url fallback', () => {
const server = mcpStore.addServer({
enabled: false,
url: 'https://mcp.example.com/a',
displayName: 'My Tools'
});
expect(mcpStore.getServerLabel(server)).toBe('My Tools');
});
it('without a custom name the url is the label', () => {
const server = mcpStore.addServer({ enabled: false, url: 'https://mcp.example.com/a' });
expect(mcpStore.getServerLabel(server)).toBe('https://mcp.example.com/a');
});
it('identical labels get positional suffixes', () => {
const a = mcpStore.addServer({
enabled: false,
url: 'https://mcp.example.com/a',
displayName: 'GitHub'
});
const b = mcpStore.addServer({
enabled: false,
url: 'https://mcp.example.com/b',
displayName: 'GitHub'
});
expect(mcpStore.getServerLabel(a)).toBe('GitHub (1)');
expect(mcpStore.getServerLabel(b)).toBe('GitHub (2)');
});
it('renaming one twin dissolves the suffixes', () => {
const a = mcpStore.addServer({
enabled: false,
url: 'https://mcp.example.com/a',
displayName: 'GitHub'
});
const b = mcpStore.addServer({
enabled: false,
url: 'https://mcp.example.com/b',
displayName: 'GitHub'
});
mcpStore.updateServer(b.id, { displayName: 'GitHub Work' });
expect(mcpStore.getServerLabel(a)).toBe('GitHub');
expect(mcpStore.getServerLabel(mcpStore.getServerById(b.id)!)).toBe('GitHub Work');
});
it('the form exposes an editable display name field', async () => {
let captured = '';
const screen = await render(McpServerForm, {
url: 'https://mcp.example.com/a',
headers: '',
name: '',
onUrlChange: () => {},
onHeadersChange: () => {},
onNameChange: (v: string) => (captured = v)
});
const input = screen.getByLabelText('Display name');
await expect.element(input).toBeVisible();
await input.fill('My Custom Server');
expect(captured).toBe('My Custom Server');
});
});