Add a way to comment out props/attributes/directives

Is your feature request related to a problem? Please describe. A weakness of most XML-like syntaxes is that they don't support a good way to comment out attributes. This problem affects Svelte too. It can be frustrating when you quickly want to toggle some code off while debugging. It also makes it slightly more inconvenient to document what attributes do, although that's probably a secondary concern as it's easier to give such comments a legal placement.

Describe the solution you'd like I would like Svelte to support comments in the body of start tags. The specific syntax doesn't matter so much, but I would probably expect JS-like comments:

<div
  // style="color: pink"
  /* style="
    color: magenta;
  " */
  style="color: purple"
>...</div>

Describe alternatives you've considered There are no convenient workarounds that I can think of. Someone suggested prefixing the attribute name with an underscore. That works OK for plain HTML, but is not a practical solution in Svelte, as Svelte will still include potentially invalid JavaScript expressions in the attribute value, and try to set the whole thing as an attribute.

You can wrap the comment in a spread so the comment ends up inside JS expression, but that's very clunky:

<div
  {...{/* style="
    color: magenta;
  " */}}
>...</div>

How important is this feature to you? Not hugely, but it would be convenient.

Additional context One potential counter-argument is that Svelte should stick to what HTML does natively here; I'm not sure I agree since Svelte already has plenty of custom syntax around attributes.

sveltejs / svelte

Add a way to comment out props/attributes/directives #5213