Boolean attribute style

Rule ID:

attribute-boolean-style

Category:

Style

Standards:

• HTML5

Boolean attributes are attributes without a value and the presence of the attribute is considered a boolean true and absence a boolean false. The HTML5 standard allows three styles to write boolean attributes:

• <input required> (omitting the value)
• <input required=""> (empty string)
• <input required="required"> (attribute name)

This rule requires a specific style when writing boolean attributes. Default is to omit the value.

This rule does not have an effect on regular attributes with empty values, see attribute-empty-style instead.

Rule details

Examples of incorrect code for this rule:

<input required="">
<input required="required">

error: Attribute "required" should omit value (attribute-boolean-style) at inline:1:8:
> 1 | <input required="">
    |        ^^^^^^^^
  2 | <input required="required">


error: Attribute "required" should omit value (attribute-boolean-style) at inline:2:8:
  1 | <input required="">
> 2 | <input required="required">
    |        ^^^^^^^^


2 errors found.

Examples of correct code for this rule:

<input required>

Options

This rule takes an optional object:

{
  "style": "omit"
}

Style

• omit require boolean attributes to omit value, e.g. <input required>
• empty require boolean attributes to be empty string, e.g. <input required="">
• name require boolean attributes to be the attributes name, e.g. <input required="required">