diff --git a/packages/language-server/src/plugins/svelte/features/getCompletions.ts b/packages/language-server/src/plugins/svelte/features/getCompletions.ts index ddc3c90fd..a64e50989 100644 --- a/packages/language-server/src/plugins/svelte/features/getCompletions.ts +++ b/packages/language-server/src/plugins/svelte/features/getCompletions.ts @@ -4,10 +4,10 @@ import { CompletionList, CompletionItemKind, CompletionItem, + InsertTextFormat, } from 'vscode-languageserver'; import { SvelteTag, documentation, getLatestOpeningTag } from './SvelteTags'; import { isInTag } from '../../../lib/documents'; - /** * Get completions for special svelte tags within moustache tags. */ @@ -54,9 +54,18 @@ function getCompletionsWithRegardToTriggerCharacter( if (triggerCharacter === '#') { return createCompletionItems([ - { tag: 'if', label: 'if' }, - { tag: 'each', label: 'each' }, - { tag: 'await', label: 'await' }, + { tag: 'if', label: 'if', insertText: 'if $1}\n\t$2\n{/if' }, + { tag: 'each', label: 'each', insertText: 'each $1 as $2}\n\t$3\n{/each' }, + { + tag: 'await', + label: 'await :then', + insertText: 'await $1}\n\t$2\n{:then $3} \n\t$4\n{/await', + }, + { + tag: 'await', + label: 'await then', + insertText: 'await $1 then $2}\n\t$3\n{/await', + }, ]); } @@ -133,12 +142,16 @@ function showCompletionWithRegardsToOpenedTags( /** * Create the completion items for given labels and tags. */ -function createCompletionItems(items: { label: string; tag: SvelteTag }[]): CompletionList { +function createCompletionItems( + items: { label: string; tag: SvelteTag; insertText?: string }[], +): CompletionList { return CompletionList.create( // add sortText/preselect so it is ranked higher than other completions and selected first items.map( (item) => { + insertTextFormat: InsertTextFormat.Snippet, + insertText: item.insertText, label: item.label, sortText: '-1', kind: CompletionItemKind.Keyword, diff --git a/packages/language-server/test/plugins/svelte/features/getCompletions.test.ts b/packages/language-server/test/plugins/svelte/features/getCompletions.test.ts index 72fd55b20..9c9f28484 100644 --- a/packages/language-server/test/plugins/svelte/features/getCompletions.test.ts +++ b/packages/language-server/test/plugins/svelte/features/getCompletions.test.ts @@ -49,7 +49,7 @@ describe('SveltePlugin#getCompletions', () => { }); it('should return completions for #', () => { - expectCompletionsFor('{#').toEqual(['if', 'each', 'await']); + expectCompletionsFor('{#').toEqual(['if', 'each', 'await :then', 'await then']); }); it('should return completions for @', () => {