30 lines
1.8 KiB
TypeScript
Vendored
30 lines
1.8 KiB
TypeScript
Vendored
import { readFileSync } from "node:fs";
|
|
import { describe, expect, it } from "vitest";
|
|
|
|
const searchableSelectSource = readFileSync(new URL("../../../components/ui/searchable-select/SearchableSelect.vue", import.meta.url), "utf8");
|
|
const dataTransferDialogSource = readFileSync(new URL("../../../components/transfer/DataTransferDialog.vue", import.meta.url), "utf8");
|
|
const editorToolbarSource = readFileSync(new URL("../../../components/layout/EditorToolbar.vue", import.meta.url), "utf8");
|
|
|
|
describe("SearchableSelect layout", () => {
|
|
it("keeps slotted option labels inside a shrinkable overflow boundary", () => {
|
|
const labelBoundaries = searchableSelectSource.match(/dbx-searchable-select-option-label min-w-0 flex-1 overflow-hidden/g) ?? [];
|
|
|
|
expect(labelBoundaries).toHaveLength(3);
|
|
});
|
|
|
|
it("truncates long data transfer connection labels without shrinking their icons", () => {
|
|
const truncatedConnectionLabels = dataTransferDialogSource.match(/<span class="min-w-0 flex-1 truncate">\{\{ label \}\}<\/span>/g) ?? [];
|
|
const fixedConnectionIcons = dataTransferDialogSource.match(/class="h-3\.5 w-3\.5 shrink-0"/g) ?? [];
|
|
|
|
expect(truncatedConnectionLabels).toHaveLength(2);
|
|
expect(fixedConnectionIcons).toHaveLength(2);
|
|
});
|
|
|
|
it("wraps deep connection group paths without hiding connection names", () => {
|
|
expect(editorToolbarSource).toContain('item-class="min-h-9 h-auto py-1"');
|
|
expect(editorToolbarSource).toMatch(/<span class="[^"]*max-w-48[^"]*shrink-0[^"]*whitespace-normal[^"]*break-words[^"]*">\s*\{\{ connectionGroupLabel\(option\) \}\}\s*<\/span>/);
|
|
expect(editorToolbarSource).toContain('<TruncatedTextTooltip :text="label" class="block min-w-[7rem] flex-1 text-sm font-medium"');
|
|
expect(editorToolbarSource).not.toContain('<TruncatedTextTooltip :text="connectionGroupLabel(option)"');
|
|
});
|
|
});
|