How to place the cursor in a custom postion when completion happens?

Viewed 81

I am trying to create a completion for JavaScript. I have the following exampe for the completion.

var jsonob = {
    label: String(counter.label),
    kind: counter.kind, 
    insertText: counter.insertText,     
};
completionList.push(jsonob);

and counter.insertText has the "function ${1:functionName} (){\n\t\n}" String

when the completion happens what it shows is

function ${1:functionName} (){

}

but it should highlight the word functionName. How to fix this issue?

1 Answers

I'm assuming that your counter.insertText is a plain string. CompletionItem.insertText is defined as follows:

insertText?: string | SnippetString

A string or snippet that should be inserted in a document when selecting this completion. When falsy the label is used.

So if you want your insertText to be treated as a snippet, you'll have to wrap it in a SnippetString instance.

insertText: new vscode.SnippetString("function ${1:functionName} (){\n\t\n}")

If you're using the Language Server Protocol rather than the VSCode API, there is no SnippetString. Simply use a snippet string directly in insertText and then set CompletionItem.insertTextFormat to InsertTextFormat.Snippet:

insertText: "function ${1:functionName} (){\n\t\n}",
insertTextFormat: InsertTextFormat.Snippet

Note: insertTextFormat applies to both insertText and textEdit.

Related