Hare/yoi
1
1
Fork 0
Code Actions Packages Releases Activity

fix: stabilize configuration editor completion

Browse Source
This commit is contained in:
Hare
2026-09-02 14:18:51 +09:00
parent a664e72488
commit 925100fb82
6 changed files with 83 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/workspace/deno.json
+1
View File
@@ -20,6 +20,7 @@
"@codemirror/language": "npm:@codemirror/language@6.12.4",
"@codemirror/state": "npm:@codemirror/state@6.7.1",
"@codemirror/view": "npm:@codemirror/view@6.43.8",
"@lezer/common": "npm:@lezer/common@1.5.2",
"@lezer/highlight": "npm:@lezer/highlight@1.2.3",
"decodal-codemirror": "npm:decodal-codemirror@0.3.0",
"clsx": "npm:clsx@2.1.1",
web/workspace/deno.lock
Generated
+2
View File
@@ -9,6 +9,7 @@
"npm:@codemirror/state@6.7.1": "6.7.1",
"npm:@codemirror/view@6.43.8": "6.43.8",
"npm:@fontsource/ibm-plex-mono@5.3.0": "5.3.0",
"npm:@lezer/common@1.5.2": "1.5.2",
"npm:@lezer/highlight@1.2.3": "1.2.3",
"npm:@sveltejs/adapter-static@3.0.9": "3.0.9_@sveltejs+kit@2.49.4__@sveltejs+vite-plugin-svelte@6.2.1___svelte@5.45.6___vite@7.2.7____yaml@2.9.0___yaml@2.9.0__svelte@5.45.6__typescript@5.9.3__vite@7.2.7___yaml@2.9.0__yaml@2.9.0_yaml@2.9.0",
"npm:@sveltejs/kit@2.49.4": "2.49.4_@sveltejs+vite-plugin-svelte@6.2.1__svelte@5.45.6__vite@7.2.7___yaml@2.9.0__yaml@2.9.0_svelte@5.45.6_typescript@5.9.3_vite@7.2.7__yaml@2.9.0_yaml@2.9.0",
@@ -1026,6 +1027,7 @@
"npm:@codemirror/language@6.12.4",
"npm:@codemirror/state@6.7.1",
"npm:@codemirror/view@6.43.8",
"npm:@lezer/common@1.5.2",
"npm:@lezer/highlight@1.2.3",
"npm:@sveltejs/adapter-static@3.0.9",
"npm:@sveltejs/kit@2.49.4",
web/workspace/src/lib/workspace/config-source/completion.ts
+6
View File
@@ -12,6 +12,12 @@ type ConfigSourceCompletionItem = {
priority: number;
};
export function shouldStartCompletionAfterTyping(
insertedText: string,
): boolean {
return /\S/u.test(insertedText);
}
export function toCodeMirrorCompletion(
result: ConfigSourceCompletionResult | null,
): CompletionResult | null {
web/workspace/src/lib/workspace/settings/DecodalSourceEditor.svelte
+35 -11
View File
@@ -2,6 +2,7 @@
import { untrack } from 'svelte';
import {
autocompletion,
closeCompletion,
completionKeymap,
completionStatus,
startCompletion,
@@ -10,9 +11,10 @@
} from '@codemirror/autocomplete';
import { HighlightStyle, syntaxHighlighting } from '@codemirror/language';
import { Compartment, EditorState } from '@codemirror/state';
import { EditorView, keymap, lineNumbers, highlightActiveLine, drawSelection } from '@codemirror/view';
import { EditorView, keymap, lineNumbers, highlightActiveLine, drawSelection, type ViewUpdate } from '@codemirror/view';
import { tags } from '@lezer/highlight';
import { decodal } from 'decodal-codemirror';
import { shouldStartCompletionAfterTyping } from '$lib/workspace/config-source/completion.ts';
import {
fixedSchemaWrapperExtension,
moveSelectionIntoFixedWrapper,
@@ -88,6 +90,27 @@
});
}
function typedText(update: ViewUpdate): string | null {
let foundTyping = false;
let insertedText = '';
for (const transaction of update.transactions) {
if (!transaction.isUserEvent('input.type')) continue;
foundTyping = true;
transaction.changes.iterChanges((_fromA, _toA, _fromB, _toB, inserted) => {
insertedText += inserted.toString();
});
}
return foundTyping ? insertedText : null;
}
function dismissCompletion(editor: EditorView) {
queueMicrotask(() => {
if (completionStatus(editor.state) !== null) closeCompletion(editor);
});
}
const completionKeymapWithoutEnter = completionKeymap.filter((binding) => binding.key !== 'Enter');
$effect(() => {
if (!host || untrack(() => view)) return;
const initialValue = untrack(() => value);
@@ -106,6 +129,7 @@
decodal({ highlight: false }),
syntaxHighlighting(syntaxTheme),
autocompletion({
activateOnTyping: false,
override: [
async (context: CompletionContext) => {
if (!handleComplete) return null;
@@ -114,7 +138,7 @@
},
],
}),
keymap.of(completionKeymap),
keymap.of(completionKeymapWithoutEnter),
fixedSchemaWrapperCompartment.of(
initialFixedSchemaWrapper ? fixedSchemaWrapperExtension() : [],
),
@@ -122,17 +146,18 @@
EditorState.readOnly.of(initialReadonly),
EditorView.editable.of(!initialReadonly),
]),
EditorView.domEventHandlers({
focus: (_event, editor) => {
scheduleCompletion(editor);
return false;
},
}),
EditorView.updateListener.of((update) => {
if (update.selectionSet && !update.docChanged) {
if (update.docChanged) {
handleChange(update.state.doc.toString());
const insertedText = typedText(update);
if (insertedText !== null) {
if (shouldStartCompletionAfterTyping(insertedText)) {
scheduleCompletion(update.view);
} else {
dismissCompletion(update.view);
}
}
}
if (update.docChanged) handleChange(update.state.doc.toString());
}),
theme,
],
@@ -156,7 +181,6 @@
EditorView.editable.of(!nextReadonly),
]),
});
if (!nextReadonly) scheduleCompletion(editor);
});
$effect(() => {
web/workspace/test/config-source/editor-state.test.ts
+15 -3
View File
@@ -1,3 +1,4 @@
import denoConfig from "../../deno.json" with { type: "json" };
import { CODEMIRROR_VITE_DEDUPE } from "../../src/lib/workspace/config-source/vite-dedupe.ts";
declare const Deno: {
@@ -24,6 +25,13 @@ Deno.test("Vite deduplicates CodeMirror stateful packages", () => {
`Vite must deduplicate ${packageName}`,
);
}
for (const packageName of CODEMIRROR_VITE_DEDUPE) {
assert(
packageName in (denoConfig.imports ?? {}),
`${packageName} must be a direct dependency so Vite can deduplicate it`,
);
}
});
Deno.test("config editor snapshots Svelte proxies before cloning baselines", async () => {
@@ -92,11 +100,15 @@ Deno.test("Decodal editor follows readonly prop changes after mount", async () =
"CodeMirror theme must use workspace tokens that actually exist",
);
assert(
source.includes("keymap.of(completionKeymap)") &&
source.includes("keymap.of(completionKeymapWithoutEnter)") &&
source.includes("binding.key !== 'Enter'") &&
source.includes("activateOnTyping: false") &&
source.includes("shouldStartCompletionAfterTyping(insertedText)") &&
source.includes("startCompletion(editor)") &&
source.includes("update.selectionSet && !update.docChanged") &&
!source.includes("EditorView.domEventHandlers") &&
!source.includes("update.selectionSet") &&
source.includes("completionStatus(editor.state) === null"),
"completion should be explicitly available and start when an editable cursor moves into an empty schema position",
"completion should start only after non-whitespace typing, without using focus, cursor movement, Space, or Enter",
);
assert(
source.includes("fixedSchemaWrapperCompartment.reconfigure") &&
web/workspace/test/config-source/toolchain.test.ts
+23 -1
View File
@@ -3,7 +3,10 @@ declare const Deno: {
readTextFile(path: URL): Promise<string>;
};
import { toCodeMirrorCompletion } from "../../src/lib/workspace/config-source/completion.ts";
import {
shouldStartCompletionAfterTyping,
toCodeMirrorCompletion,
} from "../../src/lib/workspace/config-source/completion.ts";
import { jsonWorkerMessage } from "../../src/lib/workspace/config-source/toolchain-message.ts";
function assert(condition: unknown, message: string): asserts condition {
@@ -67,6 +70,25 @@ Deno.test("toolchain converts reactive-like proxies to plain Worker messages", a
);
});
Deno.test("completion starts only after non-whitespace typing", () => {
assert(
!shouldStartCompletionAfterTyping(" "),
"Space should not start completion",
);
assert(
!shouldStartCompletionAfterTyping("\n"),
"Enter should not start completion",
);
assert(
!shouldStartCompletionAfterTyping("\t"),
"other whitespace should not start completion",
);
assert(
shouldStartCompletionAfterTyping("p"),
"non-whitespace typing should start completion",
);
});
Deno.test("toolchain preserves WASM UTF-16 completion ranges for CodeMirror", () => {
const result = toCodeMirrorCompletion({
from: "let 名 = ".length,