fix(test): the MCP endpoint cases find their own row again

FE-COMP-INTEGRATIONS-004, -015 and -016 took the first <code> and the first
Copy button on the tab and expected the MCP endpoint. Since the API keys card
shows the /api/v1 address with a copy button of its own (#2371), and it sits
above the MCP section, those queries landed on the API card: the URL read
/api/v1 and the click copied it. The cases now go through the endpoint's own
label.
This commit is contained in:
Maurice
2026-09-14 23:23:22 +02:00
parent 53eeba3c1b
commit 2efa843306
@@ -18,6 +18,18 @@ function enableMcp() {
});
}
/**
* The MCP endpoint row: the URL under its label and the copy button beside it.
*
* Found through its own label, not as "the first <code>" and "the first Copy
* button". The API keys card above it shows the /api/v1 address with a copy
* button of its own, and a positional query lands on that one instead.
*/
function mcpEndpointRow() {
const row = screen.getByText('MCP Endpoint').nextElementSibling as HTMLElement;
return { code: row.querySelector('code')!, copy: row.querySelector('button')! };
}
const clipboardWriteText = vi.fn().mockResolvedValue(undefined);
beforeAll(() => {
@@ -67,9 +79,9 @@ describe('IntegrationsTab', () => {
enableMcp();
render(<IntegrationsTab />);
await screen.findByText('MCP Configuration');
const codeEl = document.querySelector('code');
expect(codeEl).not.toBeNull();
expect(codeEl!.textContent).toContain('/mcp');
const { code } = mcpEndpointRow();
expect(code).not.toBeNull();
expect(code.textContent).toContain('/mcp');
});
it('FE-COMP-INTEGRATIONS-005: JSON config block is rendered when expanded', async () => {
@@ -273,8 +285,7 @@ describe('IntegrationsTab', () => {
await screen.findByText('MCP Configuration');
// Spy after userEvent.setup() may have replaced navigator.clipboard
const writeSpy = vi.spyOn(navigator.clipboard, 'writeText').mockResolvedValue(undefined);
const copyBtns = screen.getAllByTitle('Copy');
await user.click(copyBtns[0]);
await user.click(mcpEndpointRow().copy);
expect(writeSpy).toHaveBeenCalledWith(expect.stringContaining('/mcp'));
});
@@ -284,12 +295,11 @@ describe('IntegrationsTab', () => {
render(<IntegrationsTab />);
await screen.findByText('MCP Configuration');
vi.spyOn(navigator.clipboard, 'writeText').mockResolvedValue(undefined);
const copyBtns = screen.getAllByTitle('Copy');
await user.click(copyBtns[0]);
const { copy } = mcpEndpointRow();
await user.click(copy);
await waitFor(() => {
// After copy, icon changes to Check (green). The button should contain an svg with text-green-500
const btn = copyBtns[0];
const svg = btn.querySelector('svg');
const svg = copy.querySelector('svg');
expect(svg).toHaveClass('text-green-500');
});
});