vscode: how to make text after snippet *not* selected? - intellisense

When a snippet (for whatever language) is triggered, and the cursor is moved to a tab-stop, the area is "selected" (that is, you are still in "snippet mode" where you can go to another tab-stop). But I would like to get out of this "snippet mode" (e.g not having the area selected after tab-stop), because it suppresses intellisense (the selected area after snippet was triggered accepts anything, so it does no longer suggest intellisense function, variables, etc. Is there a settings in vscode to disable this "selection" after snippet is triggered?

If you have only one tabstop you can use $0 to avoid the "selecttion".
But if you have more than one i don't think it's possible.

I don't believe that's possible.
Snippets often have placeholders such as ${1:name} to indicate what's expected in that tab stop.
Take this one for example:
"JS arrow function": {
"prefix": "af",
"body": [
"const ${1:name} = (${2:props}) => {",
"\t$3",
"}"
],
"description": "Create arrow function"
}
Using tab will cycle over $1, $2 and $3, and for $1 and $2 there is a placeholder.
You can omit the placeholders if you want:
"JS arrow function2": {
"prefix": "af2",
"body": [
"const $1 = ($2) => {",
"\t$3",
"}"
],
"description": "Create arrow function"
}
But instellisense won't work until you press escape.
You can add your own snippets globally or per language if you prefer to customise them and avoid placeholders.
See this link for more information.

Related

How do i select the e.g. first entry in a dropdown list which is created when typing in characters?

I'm testing the chrome extension "Kantu browser automation" and could use some help in figuring out how to select from a drop down list, when the drop down list is created based upon typed characters.
The website I'm testing on is https://uddannelsesstatistik.dk/Pages/dagtilbud_institutioner.aspx
I've tried to record my way through with no success.
I've tried to use click, but can't select the dropdown-list, since it disappears when attempting to clicking on it.
I've tried ClickAt with Coordinates 262,504 and other coordinates as well. Nothing happens.
{
"Name": "Uddannelsesstatistik - Dagtilbud",
"CreationDate": "2019-2-11",
"Commands": [
{
"Command": "open",
"Target": "https://uddannelsesstatistik.dk/Pages/dagtilbud_institutioner.aspx",
"Value": ""
},
{
"Command": "type",
"Target": "id=dawa-autocomplete-input",
"Value": "Aabakken 1, Rebæk, 6000 Kolding"
},
{
"Command": "clickAt",
"Target": "id=dawa-autocomplete-input",
"Value": "262,504"
}
]
}
Right now, it stops when the characters is typed.
The expected output would be that i typed in e.g. "Aabakken 1" and then select the first entry in drop down list "Aabakken 1, Rebæk, 6000 Kolding".
I'm not that experienced in reading html code and how to specify to select first element in a html list, so i could really use all the references, examples, and all help in general.
I have never used kantu before, but you can use the below xpath to identify the first element of the auto completion drop down and you can click on it.
//input[#id='dawa-autocomplete-input']/preceding::label/following::div[1]/ul/li[1]
Give some(at least 3 seconds) delay before performing click action using the above xpath otherwise you will get an error.
I hope it helps...

Custom code completion to Visual Studio Code?

I have a definition (below) file for a JavaScript library.
How can I hook it up to Visual Studio Code code completion?
It has the following format:
{
"!name": "SomeLibrary",
"someMethod" :
{
"!doc" : "Description of some method.",
"!type" : "fn(someParameter: someType) -> someReturnType"
},
"SomeClass" :
{
"!doc" : "Description of some class.",
"someOtherMethod" :
{
"!doc" : "Description of some other method.",
"!type" : "fn(someParameter: someType) -> someReturnType"
}
}
}
Bonus question: What is the name of this format at all?
UPDATE: I found out that I should create a Typescript definition file, but I really don't know how to convert it from this file I have. Is this a standard format at all?
What you want to create is called a snippet:
You can define your own snippets, either global snippets or snippets for a specific language. To open up a snippet file for editing, select User Snippets under File > Preferences (Code > Preferences on macOS) and select the language (by language identifier) for which the snippets should appear or create a new global snippet (New Global Snippets file...).
Since snippets themselves are defined as JSON, your example could get a bit messy, but basically it would look like this:
{
"You Interface Definition": {
"prefix": "idef",
"body": [
"{",
"\t\"!name\": \"<LIBRARY_NAME>\",",
"\t\"<METHOD_NAME>\" : ",
"\t\t{",
"\t\t\"!doc\" : \"<DESCRIPTION>\",",
"\t\t\"!type\" : \"fn(<PARAMETER_NAME>: <PARAMETER_TYPE>) -> <RETURN_TYPE>\"",
"\t\t},",
"\t\"<CLASS_NAME>\" : {",
"\t\t\"!doc\" : \"<DESCRIPTION>\",",
"\t\t\"<METHOD_NAME>\" : {",
"\t\t\t\"!doc\" : \"<DESCRIPTION>\",",
"\t\t\t\"!type\" : \"fn(<PARAMETER_NAME>: <PARAMETER_TYPE>) -> <RETURN_TYPE>\"",
"\t\t}",
"\t}",
"}",
]
},
}
Note that I'm using \t rather than spaces, since that will respect a user's indentation settings
Now, once you type the prefix idef and press Tab the snippet will expand. You can add tab-stops with placeholder text, in case you want to change <DESCRIPTION> or <PARAMETER_NAME>. Here's a simplified example:
\"fn(${1:<PARAMETER_NAME>}: ${2:<PARAMETER_TYPE>}) -> ${3:<RETURN_TYPE>}\""
Note those parts enclosed by curly braces. Once your snippet is expanded you can use Tab to jump between those tab-stops and modify the selected text. The same tab-stop can be repeated multiple times, should you have the need to insert the same text at multiple places.

In Visual Studio Code is there a way to scope settings and keybindings to a language mode?

In VS Code, I am aware that you can create files containing global user keybindings and settings, and you can have workspace-specific files for keybindings and settings, but is it possible to define settings or keybindings specific to a language mode?
For instance, I want Alt + / to mean FSI: Send Line when I'm in F# mode, but not when I'm in markdown mode or JS mode.
And I want my tabs to be 2 spaces when I'm in Elm mode, but 4 spaces in C# mode.
I know you can define keybindings with a when clause like so:
{
"key": "alt+/",
"command": "fsi.SendLine",
"when": "resourceLangId == fsharp"
}
Is this the only way to achieve something like what I'm after?
It seems like it would make sense to be able to define settings/keybindings for mode X in their own files somewhere. I don't like having language mode behaviour scattered about in big global files like this.
To customize VS Code settings and keybindings based on the programming language, you can use language identifier, file extension or extension identifier.
For settings you can use language entry (in settings.json):
"[fsharp]": {
"editor.suggest.insertMode": "replace"
}
For keybindings you can use the following when clause contexts (in keybindings.json):
editorLangId True when the editor's associated language Id matches.
{
"key": "ctrl+e",
"command": "workbench.action.files.saveAs",
"when": "editorLangId == fsharp"
}
resourceLangId True when the Explorer or editor title language Id matches.
{
"key": "ctrl+e",
"command": "workbench.action.files.saveAs",
"when": "resourceLangId == fsharp"
}
resourceExtname True when the Explorer or editor filename extension matches.
{
"key": "ctrl+e",
"command": "workbench.action.files.saveAs",
"when": "resourceExtname == .fs"
}
extension True when the extension's ID matches.
{
"key": "ctrl+e",
"command": "workbench.action.files.saveAs",
"when": "extension == ionide.ionide-fsharp"
}
note:
I did not test all of these clauses, but editorLangId and resourceExtname work for me fine.
Visual Studio Code have stated that at this time (2016-10-19), language mode settings are not supported, but are being considered. (https://twitter.com/code/status/788301380557561857)
There are a couple of issues on the VS Code Github repository requesting variants of this feature.
https://github.com/Microsoft/vscode/issues/13532
https://github.com/Microsoft/vscode/issues/1073

Sublime Text 3: how to bind a shortcut to a specific file extension?

I would like to customize shortcut, but apply them only to a specific extension.
For example,
"jump to matching bracket" -> works in JS files -> customly bound to ctrl+m,
"go to matching tag pair" (emmet) -> works in HTML files -> I would like to ctrl+m also here, but doesn't work (ST3 understand "jump to matching bracket" which doesn't apply here).
I was wondering if specializing a shortcut to a specific extension would do the trick?
Apparently you can try something like this:
[
{ "keys": ["ctrl+x", "ctrl+i"],
"command": "insert_snippet",
"args": {"name": "Packages/User/mysnippet.sublime-snippet"},
"context": [ {"key": "selector", "operator": "equal", "operand": "text.tex.latex"} ]
}
]
Where you'ld replace the first 3 lines by what you want, and text.tex.latex by the scope you want (source.js and text.html.basic in your case).

How to move the cursor to the end of the tag in Sublime Text 2?

When I type the start of a tag, Sublime Text will auto-complete the end of the tag and position the cursor inside the tag.
<code>|</code>
I use | to represent the cursor. So when I finished the contents inside the tag, I want to move the cursor to the end of the tag like this:
<code>blabla</code>|
To do this, now I have to press Right button to move the cursor character by character, which is not efficient. Is there any shortcut to move the cursor to the end of the tag directly?
You could also create a macro. This may be valuable if your tags cover multiple lines. Save the following as something like move_to_end_tag.sublime-macro in Packages/User.
[
{
"args":
{
"to": "tag"
},
"command": "expand_selection"
},
{
"args":
{
"by": "characters",
"forward": true
},
"command": "move"
}
]
You can then create a keybinding for the action.
{
"keys": ["ctrl+shift+alt+right"],
"command": "run_macro_file",
"args": {"file": "res://Packages/User/move_to_end_tag.sublime-macro"}
}
Of course, you can change the keys to whatever you like.
I'm working in Sublime Text 3 rather than 2, but the End button (for me, between the delete and page down) does the trick for me.
I found that annoying as well. Personally, taking the End key binding and applying it to Shift+Space works well enough for my purposes.
If that's easier for you, you can add this line to your user key bindings:
{ "keys": ["shift+space"], "command": "move_to", "args": {"to": "eol", "extend": false} }
Using a macro as skuroda suggested is a good option as well since you end up with more control of the cursor placement.
For curly braces and parentheses you can use Control + M.
Not sure about angle brackets in markup though.