quickadd/src/gui/suggesters/formatSyntaxSuggester.case.test.ts at 1bdb748919f462f315ba5819080c69ccc1a6ae5e · chhoumann/quickadd · GitHub

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
import { describe, expect, it, beforeEach } from "vitest";
import { FormatSyntaxSuggester } from "./formatSyntaxSuggester";

function ensureObsidianDomPolyfills(): void {
	(globalThis as any).createDiv ??= (cls?: string) => {
		const div = document.createElement("div");
		if (cls) div.className = cls;
		return div;
	};

	const proto = HTMLElement.prototype as any;

	proto.createDiv ??= function (arg?: string | { cls?: string }) {
		const div = document.createElement("div");
		if (typeof arg === "string") div.className = arg;
		else if (arg && typeof arg === "object" && typeof arg.cls === "string")
			div.className = arg.cls;
		this.appendChild(div);
		return div;
	};

	proto.empty ??= function () {
		this.replaceChildren();
		return this;
	};

	// Obsidian adds delegated event helpers; tests don't need behavior here.
	proto.on ??= function () {
		return this;
	};

	proto.detach ??= function () {
		this.remove();
	};

	proto.addClass ??= function (...classes: string[]) {
		this.classList.add(...classes);
		return this;
	};

	proto.removeClass ??= function (...classes: string[]) {
		this.classList.remove(...classes);
		return this;
	};

	proto.setAttr ??= function (name: string, value: string) {
		this.setAttribute(name, value);
		return this;
	};
}

describe("FormatSyntaxSuggester case style suggestions", () => {
	beforeEach(() => {
		ensureObsidianDomPolyfills();
	});

	it("suggests kebab when typing a |case: prefix", async () => {
		const app = {
			dom: { appContainerEl: document.body },
			keymap: { pushScope: () => {}, popScope: () => {} },
		} as any;
		const plugin = {
			settings: { choices: [], globalVariables: {} },
			getTemplateFiles: () => [],
		} as any;

		const inputEl = document.createElement("input");
		inputEl.value = "{{VALUE:title|case:k";
		inputEl.selectionStart = inputEl.value.length;
		inputEl.selectionEnd = inputEl.value.length;

		const suggester = new FormatSyntaxSuggester(app, inputEl, plugin);
		const suggestions = await suggester.getSuggestions(inputEl.value);
		expect(suggestions).toEqual(["kebab"]);
		suggester.destroy();
	});

	it("suggests all styles (including slug) when case fragment is empty", async () => {
		const app = {
			dom: { appContainerEl: document.body },
			keymap: { pushScope: () => {}, popScope: () => {} },
		} as any;
		const plugin = {
			settings: { choices: [], globalVariables: {} },
			getTemplateFiles: () => [],
		} as any;

		const inputEl = document.createElement("input");
		inputEl.value = "{{VALUE:title|case:";
		inputEl.selectionStart = inputEl.value.length;
		inputEl.selectionEnd = inputEl.value.length;

		const suggester = new FormatSyntaxSuggester(app, inputEl, plugin);
		const suggestions = await suggester.getSuggestions(inputEl.value);
		expect(suggestions).toContain("slug");
		expect(suggestions).toContain("kebab");
		expect(suggestions).toContain("snake");
		expect(suggestions).toContain("camel");
		expect(suggestions).toContain("pascal");
		expect(suggestions).toContain("title");
		expect(suggestions).toContain("lower");
		expect(suggestions).toContain("upper");
		suggester.destroy();
	});
});