Skip to content

Commit a612754

Browse files
Add 20 new template lint rules
Co-authored-by: NullVoxPopuli <[email protected]>
1 parent b65f24b commit a612754

63 files changed

Lines changed: 2916 additions & 45 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

README.md

Lines changed: 65 additions & 45 deletions
Large diffs are not rendered by default.
Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
# ember/template-attribute-indentation
2+
3+
🔧 This rule is automatically fixable by the [`--fix` CLI option](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix).
4+
5+
<!-- end auto-generated rule header -->
6+
7+
Enforces consistent attribute indentation in templates.
8+
9+
This is a stylistic rule that is disabled by default.
10+
11+
## Rule Details
12+
13+
This rule enforces consistent indentation for attributes in template elements.
14+
15+
## Examples
16+
17+
Examples of **correct** code for this rule:
18+
19+
```gjs
20+
<template>
21+
<div class="foo"></div>
22+
</template>
23+
```
24+
25+
```gjs
26+
<template>
27+
<MyComponent @arg="value" />
28+
</template>
29+
```
30+
31+
## References
32+
33+
- [ember-template-lint attribute-indentation](https://github.com/ember-template-lint/ember-template-lint/blob/master/docs/rule/attribute-indentation.md)
Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
# ember/template-block-indentation
2+
3+
🔧 This rule is automatically fixable by the [`--fix` CLI option](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix).
4+
5+
<!-- end auto-generated rule header -->
6+
7+
Enforces consistent block indentation in templates.
8+
9+
This is a stylistic rule that is disabled by default.
10+
11+
## Rule Details
12+
13+
This rule enforces consistent indentation for block statements in templates.
14+
15+
## Examples
16+
17+
Examples of **correct** code for this rule:
18+
19+
```gjs
20+
<template>
21+
{{#if condition}}
22+
<div>Content</div>
23+
{{/if}}
24+
</template>
25+
```
26+
27+
```gjs
28+
<template>
29+
<div>Content</div>
30+
</template>
31+
```
32+
33+
## References
34+
35+
- [ember-template-lint block-indentation](https://github.com/ember-template-lint/ember-template-lint/blob/master/docs/rule/block-indentation.md)
Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
# ember/template-linebreak-style
2+
3+
🔧 This rule is automatically fixable by the [`--fix` CLI option](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix).
4+
5+
<!-- end auto-generated rule header -->
6+
7+
Enforces consistent linebreak style in templates.
8+
9+
This is a stylistic rule that is disabled by default.
10+
11+
## Rule Details
12+
13+
This rule enforces consistent linebreak style (LF or CRLF) in templates.
14+
15+
## Examples
16+
17+
Examples of **correct** code for this rule:
18+
19+
```gjs
20+
<template>
21+
<div>Content</div>
22+
</template>
23+
```
24+
25+
## References
26+
27+
- [ember-template-lint linebreak-style](https://github.com/ember-template-lint/ember-template-lint/blob/master/docs/rule/linebreak-style.md)
Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
# ember/template-no-at-ember-render-modifiers
2+
3+
💼 This rule is enabled in the following [configs](https://github.com/ember-cli/eslint-plugin-ember#-configurations): `strict-gjs`, `strict-gts`.
4+
5+
<!-- end auto-generated rule header -->
6+
7+
Disallows usage of modifiers from @ember/render-modifiers.
8+
9+
## Rule Details
10+
11+
The modifiers from `@ember/render-modifiers` (`{{did-insert}}`, `{{did-update}}`, `{{will-destroy}}`) should be replaced with alternatives from `ember-render-helpers` or other modern approaches.
12+
13+
## Examples
14+
15+
Examples of **incorrect** code for this rule:
16+
17+
```gjs
18+
<template>
19+
<div {{did-insert this.setup}}></div>
20+
</template>
21+
```
22+
23+
```gjs
24+
<template>
25+
<div {{did-update this.update}}></div>
26+
</template>
27+
```
28+
29+
```gjs
30+
<template>
31+
<div {{will-destroy this.cleanup}}></div>
32+
</template>
33+
```
34+
35+
Examples of **correct** code for this rule:
36+
37+
```gjs
38+
<template>
39+
<div {{on "click" this.handleClick}}></div>
40+
</template>
41+
```
42+
43+
## References
44+
45+
- [ember-template-lint no-at-ember-render-modifiers](https://github.com/ember-template-lint/ember-template-lint/blob/master/docs/rule/no-at-ember-render-modifiers.md)
Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
# ember/template-no-attribute-splat-on-html-element
2+
3+
💼 This rule is enabled in the following [configs](https://github.com/ember-cli/eslint-plugin-ember#-configurations): `strict-gjs`, `strict-gts`.
4+
5+
<!-- end auto-generated rule header -->
6+
7+
Disallows using `...attributes` on HTML elements.
8+
9+
## Rule Details
10+
11+
The `...attributes` syntax should only be used on component elements, not on HTML elements, to avoid confusion and maintain clear component boundaries.
12+
13+
## Examples
14+
15+
Examples of **incorrect** code for this rule:
16+
17+
```gjs
18+
<template>
19+
<div ...attributes></div>
20+
</template>
21+
```
22+
23+
```gjs
24+
<template>
25+
<span ...attributes></span>
26+
</template>
27+
```
28+
29+
Examples of **correct** code for this rule:
30+
31+
```gjs
32+
<template>
33+
<MyComponent ...attributes />
34+
</template>
35+
```
36+
37+
```gjs
38+
<template>
39+
<div class="wrapper"></div>
40+
</template>
41+
```
42+
43+
## References
44+
45+
- [ember-template-lint no-attrs-in-components](https://github.com/ember-template-lint/ember-template-lint/blob/master/docs/rule/no-attrs-in-components.md)
Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
# ember/template-no-builtin-form-components
2+
3+
💼 This rule is enabled in the following [configs](https://github.com/ember-cli/eslint-plugin-ember#-configurations): `strict-gjs`, `strict-gts`.
4+
5+
<!-- end auto-generated rule header -->
6+
7+
Disallows usage of built-in form components.
8+
9+
## Rule Details
10+
11+
Built-in Ember components like `<Input>`, `<Textarea>`, and `<LinkTo>` should be replaced with native HTML elements for better performance and simpler code.
12+
13+
## Examples
14+
15+
Examples of **incorrect** code for this rule:
16+
17+
```gjs
18+
<template>
19+
<Input @type="text" />
20+
</template>
21+
```
22+
23+
```gjs
24+
<template>
25+
<Textarea @value={{this.text}} />
26+
</template>
27+
```
28+
29+
Examples of **correct** code for this rule:
30+
31+
```gjs
32+
<template>
33+
<input type="text" />
34+
</template>
35+
```
36+
37+
```gjs
38+
<template>
39+
<textarea></textarea>
40+
</template>
41+
```
42+
43+
## References
44+
45+
- [ember-template-lint no-builtin-form-components](https://github.com/ember-template-lint/ember-template-lint/blob/master/docs/rule/no-builtin-form-components.md)
Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
# ember/template-no-class-bindings
2+
3+
💼 This rule is enabled in the following [configs](https://github.com/ember-cli/eslint-plugin-ember#-configurations): `strict-gjs`, `strict-gts`.
4+
5+
<!-- end auto-generated rule header -->
6+
7+
Disallows usage of class attribute bindings.
8+
9+
## Rule Details
10+
11+
This rule discourages the use of class attribute bindings with colon syntax. Use the `{{class}}` helper or individual classes instead for better readability and maintainability.
12+
13+
## Examples
14+
15+
Examples of **incorrect** code for this rule:
16+
17+
```gjs
18+
<template>
19+
<div class={{isActive:active:inactive}}></div>
20+
</template>
21+
```
22+
23+
```gjs
24+
<template>
25+
<div class={{foo:bar}}></div>
26+
</template>
27+
```
28+
29+
Examples of **correct** code for this rule:
30+
31+
```gjs
32+
<template>
33+
<div class={{if this.isActive "active" "inactive"}}></div>
34+
</template>
35+
```
36+
37+
```gjs
38+
<template>
39+
<div class={{this.myClass}}></div>
40+
</template>
41+
```
42+
43+
## References
44+
45+
- [ember-template-lint no-class-bindings](https://github.com/ember-template-lint/ember-template-lint/blob/master/docs/rule/no-class-bindings.md)
Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
# ember/template-no-extra-mut-helpers
2+
3+
💼 This rule is enabled in the following [configs](https://github.com/ember-cli/eslint-plugin-ember#-configurations): `strict-gjs`, `strict-gts`.
4+
5+
<!-- end auto-generated rule header -->
6+
7+
Disallows unnecessary `mut` helpers.
8+
9+
## Rule Details
10+
11+
The `mut` helper is often unnecessary when passing simple values or properties. It should only be used when explicitly creating a mutable reference is required.
12+
13+
## Examples
14+
15+
Examples of **incorrect** code for this rule:
16+
17+
```gjs
18+
<template>
19+
<MyComponent @onChange={{mut this.value}} />
20+
</template>
21+
```
22+
23+
```gjs
24+
<template>
25+
<Input @value={{mut this.text}} />
26+
</template>
27+
```
28+
29+
Examples of **correct** code for this rule:
30+
31+
```gjs
32+
<template>
33+
<MyComponent @value={{this.value}} />
34+
</template>
35+
```
36+
37+
```gjs
38+
<template>
39+
<Input @value={{this.text}} />
40+
</template>
41+
```
42+
43+
## References
44+
45+
- [ember-template-lint no-extra-mut-helper-argument](https://github.com/ember-template-lint/ember-template-lint/blob/master/docs/rule/no-extra-mut-helper-argument.md)
Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
# ember/template-no-index-component-invocation
2+
3+
💼 This rule is enabled in the following [configs](https://github.com/ember-cli/eslint-plugin-ember#-configurations): `strict-gjs`, `strict-gts`.
4+
5+
<!-- end auto-generated rule header -->
6+
7+
Disallows invocation of components with `/index` suffix.
8+
9+
## Rule Details
10+
11+
Components should be invoked using the parent directory name instead of appending `/index` to the path.
12+
13+
## Examples
14+
15+
Examples of **incorrect** code for this rule:
16+
17+
```gjs
18+
<template>
19+
<MyComponent/index />
20+
</template>
21+
```
22+
23+
```gjs
24+
<template>
25+
<Foo/index />
26+
</template>
27+
```
28+
29+
Examples of **correct** code for this rule:
30+
31+
```gjs
32+
<template>
33+
<MyComponent />
34+
</template>
35+
```
36+
37+
```gjs
38+
<template>
39+
<Foo />
40+
</template>
41+
```
42+
43+
## References
44+
45+
- [ember-template-lint no-index-component-invocation](https://github.com/ember-template-lint/ember-template-lint/blob/master/docs/rule/no-index-component-invocation.md)

0 commit comments

Comments
 (0)