VS Code - Key Bindings - my own Block comment

Question

I am using VS Code Version: 1.40.0.

for quicken up my development I would need to set my own keybinding for block comment when I am in .phtml file.

I managed to get into keybindings.json, put this inside:

{
    "key": "shift+alt+q",
    "command": "editor.action.blockComment",
    "blockComment": [ "{*<!--", "-->*}" ],
    "when": "editorTextFocus && !editorReadonly && resourceExtname == .phtml"
}

I got the part

"blockComment": [ "{*<!--", "-->*}" ],

from here How to customize comment block characters in visual studio code?.

It might be a complete trash. I just tried. It doesn't work, of course.

Optimal solution: Even better would be, if the default key parameter would stay the same (shift+alt+a) for toggle block comment and in .phtml files i would get my desired result ("{*<!-- -->*}"). If I think about it, there is default block comments for .css, .html etc, so there must be a way to put my condition somewhere, rigth?

I would be very glad for any help. Thanks in advance

Answer 1

As far as I know the best would be to write your own Language Extension plugin for .phtml files and set the desired comment pairs in its configuration.

Not a real solution but until then, here's my supper ugly workaround (use at your own risk):

Put this in your keybindings.json

  {
    "key": "ctrl+numpad_divide",
    "command": "editor.action.insertSnippet",
    "args": {
      "snippet": "${TM_SELECTED_TEXT/^(\\s*)({\\*<!-- (.*) -->\\*})?(.*)/$1${3:-{*<!-- }$4${4:+ -->*\\}}/s}"
    },
    "when": "editorTextFocus && editorHasSelection && !editorReadonly && resourceExtname =~ /phtml?$/"
  }

This way ctrl + / can be used for comment/uncomment (toggle) the selected code as you described. Of course you can set the key binding to something else like alt + / to keep the default block comment behaviour.

Tested with Visual Studio Code v1.50.1