1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
|
import { render, screen, waitFor } from "@testing-library/svelte";
import userEvent from "@testing-library/user-event";
import { describe, expect, it } from "vitest";
import type { SearchBackendConfig, SearchBackendConfigResult } from "../logic/view-model";
import SearchBackendField from "./SearchBackendField.svelte";
const CONFIG: SearchBackendConfig = {
backend: "firecrawl",
available: [
{ id: "firecrawl", label: "Firecrawl (self-hosted)", configured: true },
{ id: "umans", label: "Umans (Exa)", configured: false },
],
};
function okLoad(backend = "firecrawl"): () => Promise<SearchBackendConfigResult> {
return async () => ({ ok: true, config: { ...CONFIG, backend } });
}
function okSave(backend: string): () => Promise<SearchBackendConfigResult> {
const saves: string[] = [];
const impl = async (value: string): Promise<SearchBackendConfigResult> => {
saves.push(value);
return { ok: true, config: { ...CONFIG, backend: value } };
};
// attach the recorder for assertions
(impl as unknown as { saves: string[] }).saves = saves;
void backend;
return impl as () => Promise<SearchBackendConfigResult>;
}
describe("SearchBackendField", () => {
it("renders the options from the loaded config (unconfigured disabled, None last)", async () => {
render(SearchBackendField, { props: { load: okLoad(), save: okSave("none") } });
const select = await screen.findByLabelText("Search backend");
await waitFor(() => expect(select).toBeEnabled());
const options = select.querySelectorAll("option");
const labels = [...options].map((o) => o.textContent);
expect(labels).toEqual([
"Firecrawl (self-hosted)",
"Umans (Exa) (not configured)",
"None (search disabled)",
]);
expect(options[1]?.disabled).toBe(true);
expect((select as HTMLSelectElement).value).toBe("firecrawl");
});
it("saves on change and shows the saved confirmation with the new label", async () => {
const user = userEvent.setup();
const save = okSave("umans");
render(SearchBackendField, { props: { load: okLoad(), save } });
const select = (await screen.findByLabelText("Search backend")) as HTMLSelectElement;
await waitFor(() => expect(select).toBeEnabled());
// Select the umans entry (disabled here would block it, so flip configured
// via a custom config below); instead select "none" which is always enabled.
await user.selectOptions(select, "none");
await waitFor(() => expect(screen.getByText(/Saved/)).toBeInTheDocument());
expect(screen.getByText(/Saved: None \(search disabled\)\./)).toBeInTheDocument();
const saves = (save as unknown as { saves: string[] }).saves;
expect(saves).toEqual(["none"]);
expect(select.value).toBe("none");
});
it("reverts the selection to the persisted value when the save fails", async () => {
const user = userEvent.setup();
const save = async (): Promise<SearchBackendConfigResult> => ({
ok: false,
error: "Set search backend failed (HTTP 500)",
});
render(SearchBackendField, { props: { load: okLoad(), save } });
const select = (await screen.findByLabelText("Search backend")) as HTMLSelectElement;
await waitFor(() => expect(select).toBeEnabled());
await user.selectOptions(select, "none");
expect(await screen.findByText(/HTTP 500/)).toBeInTheDocument();
expect(select.value).toBe("firecrawl");
});
it("renders disabled with a 'search not available' hint on the 503 degrade", async () => {
const load = async (): Promise<SearchBackendConfigResult> => ({
ok: false,
error: "Search config failed (HTTP 503)",
unavailable: true,
});
render(SearchBackendField, { props: { load, save: okSave("none") } });
const select = await screen.findByLabelText("Search backend");
await waitFor(() => expect(select).toBeDisabled());
expect(screen.getByText(/Search not available/)).toBeInTheDocument();
// No help text in the unavailable state (nothing to explain — search is off).
expect(screen.queryByText(/search.*mode only/i)).not.toBeInTheDocument();
});
it("renders a loading skeleton while the initial GET is in flight", async () => {
let resolveLoad!: (r: SearchBackendConfigResult) => void;
const load = () =>
new Promise<SearchBackendConfigResult>((resolve) => {
resolveLoad = resolve;
});
render(SearchBackendField, { props: { load, save: okSave("none") } });
expect(screen.getByLabelText("Search backend loading")).toBeInTheDocument();
resolveLoad({ ok: true, config: CONFIG });
await screen.findByLabelText("Search backend");
});
it("prepends an unknown persisted selection as a selectable option", async () => {
const load = async (): Promise<SearchBackendConfigResult> => ({
ok: true,
config: { backend: "gone", available: [] },
});
render(SearchBackendField, { props: { load, save: okSave("none") } });
const select = (await screen.findByLabelText("Search backend")) as HTMLSelectElement;
await waitFor(() => expect(select).toBeEnabled());
expect(select.value).toBe("gone");
const labels = [...select.querySelectorAll("option")].map((o) => o.textContent);
expect(labels).toEqual(["gone (unknown)", "None (search disabled)"]);
});
});
|
