5

When I select multiple HTML line that already has a single comment in it and use Ctrl + / in VS Code, the behavior seem to be broken. See GIF:

err-html-cmt

This would work in JavaScript:

enter image description here

Does anyone know a way to change the setting in VS Code or any work around solution for this?

Improve this question
3
  • As HTML is not a development language in its own right, comments must be placed between the <!-- and --> selectors. It is therefore not possible to combine nested comments in HTML. This is not a VSCode problem, but one of HTML syntax. Commented Oct 12, 2023 at 13:04
  • @AdrienVillalonga is there anyway to work around with this or any setting in VS Code that allow to do this? Commented Oct 12, 2023 at 13:22
  • Not to my knowledge for HTML but you can try use a preprocessor tools for html like Slim or Pug. They would handle what you want with VSCode and return a valid html. Samples: For slim (stackoverflow) and Pug Comments (official documentation). Hope that help you 😊 Commented Oct 12, 2023 at 13:41

1 Answer 1

Reset to default
2

I can sympathize with VS Code in why it's doing something that might look dumb, because it's not clear to me what "smart" would definitively/ideally look like, and I think what desirable behaviour would look like here would come down to user preference, which is a bit of a design complication.

HTML comments do not support nesting (see Are nested HTML comments possible? and Why do many languages not support nested block comments?). An HTML parser does not keep track of a stack of <!-- to count matching -->. Upon seeing a <!-- while not already handling one, it treats everything until the immediately next --> is found to be part of the comment.

There are at least two solutions an editor like VS Code could take to handle this when a user attempts to "nest" a comment in a language like HTML:

  • Just do something to remove the inner comment. Ex. delete it altogether. This is rather destructive, and as a user, I wouldn't like this. Or, just uncomment the inner comment. This is also destructive in that there will be nothing left to indicate that the uncommented inner content was previously commented out, so there's no clear way to restore that state if one uncomments the outer comment.
  • Do something that HTML doesn't semantically care about to escape the inner comment, such as insert a space: - ->, or some other recognizable mutation. A little complication with this is that then you have the possibility that the user has actually written that "escaped" version- not for the purpose as escaped inner-comment delimiters, but for some other important reason inside the place that the outer comment will wrap, and now you have to escape that too, and that might confuse the user, or bite them as an unpleasant surprise later if they manually remove the outer comment and don't know that that happened.

Out of curiosity, I did a google and found an extension that claims to support nested HTML comments in VS Code: https://github.com/philsinatra/NestedCommentsVSCode. It appears to take the second route I suggested, converting --> in "inner" comments to ~~>. I have not used it, so I can't speak for how well it supports multiple levels of nesting, or handling the nuances I mentioned.

I also found https://github.com/microsoft/vscode/issues/97996, but unfortunately, it's locked for unstated reasons.

Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

Good find! I think this VSCode extension (marketplace.visualstudio.com/…) you mentioned is a life saver. Now I can comment my HTML, CSS with ease without manually delete inner comments just to make it works. Thanks for sharing!

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.