Unclear rule short description for Web:S6853

Clean Code New rules / language support
1

Version: SonarQube v10.5 (89998)
Rule: S6853: Label elements should have a text label and an associated control

This code triggers the rule:

<label class="btn btn-white">
    <input type="checkbox"
               id="cb_${item.id}"
               name="id"
               value.bind="item.id"
               checked.bind="selectedItems">
</label>

By reading the rule I think it is because there is no text content in the label.
However the short rule description in SonarQube’s issue list is simply:

A form label must be associated with a control.

This works well when there is no control / for attribute, but in the specific case I mentioned it seems quite unclear. By contrast, the full rule name clearly mentions the “text” part of the label.

1 Like
4

Hi @m-gallesio , thanks a lot for the report. You are right, the short description misses the part about the text, which makes it not very helpful.

You can find the issue that tracks this needed improvement here: [SONARHTML-254] - Jira.

Again, thanks a lot.

1 Like
8

For anybody comming here to see how to get the rule to go away for labels without text. This is the solution that I ended up using:

<div class="custom-control custom-switch">
	<input
		type="checkbox"
		name="mySwitch"
		class="custom-control-input"
		id="mySwitch"
	/>
	<label class="custom-control-label" for="mySwitch">&nbsp;</label>
</div>

Setting &nbsp; as text for the label seems to get past the rule