Why “–” is not permitted in Lightning Component’s comments in markup? How to toggle markup with class names like “uiInput–input”?

In a Lightning Component, I have the following markup which I have to comment in and out for testing purpose

<force:inputField value="{!v.account.Name}" class="form-control uiInput--input input" />

now when I try to comment it out like this

<!--<force:inputField value="{!v.account.Name}" class="form-control uiInput--input input" />-->

the API tells me

markup://c:elfL1:6,81: ParseError at [row,col]:[7,81] Message: The
string “–” is not permitted within comments.

Since I didn’t figure out that fancy class name uiInput--input (Salesforce did so…) it would be nice to be able to toggle that om/off OR avoid to use class names like this…

Answer

The use of double dashes/hyphens inside comments is invalid in HTML, XML, and XHTML:

The Importance of Correct HTML Commenting

Lightning Component markup is XML, and the generated markup on the client is HTML. The Lightning markup might generate something such as:

<!-- <input class="my-invalid--class-name" value="Foo"/> -->

I do not know where the — trend in style classes comes from, but clearly they weren’t thinking about this clearly!

Attribution
Source : Link , Question Author : Uwe Heim , Answer Author : Skip Sauls

Leave a Comment