Skip to content

template-no-splattributes-with-class.md

Latest commit

 

History

History
47 lines (32 loc) · 1.24 KB

template-no-splattributes-with-class.md

File metadata and controls

47 lines (32 loc) · 1.24 KB

ember/template-no-splattributes-with-class

💼 This rule is enabled in the following configs: ✅ recommended, strict-gjs, strict-gts.

Disallow using ...attributes with class attribute.

When using ...attributes (splattributes), any classes passed from the parent component will be automatically merged with the component's own classes. Adding a class attribute alongside ...attributes can lead to confusion about which classes take precedence.

Examples

This rule forbids the following:

<div ...attributes class='foo'>
  content
</div>
<div class='foo' ...attributes>
  content
</div>

This rule allows the following:

<div ...attributes>
  content
</div>
<div class='foo'>
  content
</div>

Why?

When using ...attributes, classes are automatically merged from parent components. Using a class attribute alongside it creates confusion about which classes take precedence and can lead to unexpected styling behavior.

References