Skip to content

Commit 87cebc2

Browse files
committed
Docs: Add docs for actionview-no-void-element-content rule
1 parent f133bd1 commit 87cebc2

File tree

2 files changed

+58
-0
lines changed

2 files changed

+58
-0
lines changed

javascript/packages/linter/docs/rules/README.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ This page contains documentation for all Herb Linter rules.
66

77
- [`actionview-no-silent-helper`](./actionview-no-silent-helper.md) - Disallow silent ERB tags for Action View helpers
88
- [`actionview-no-silent-render`](./actionview-no-silent-render.md) - Disallow calling `render` without outputting the result
9+
- [`actionview-no-void-element-content`](./actionview-no-void-element-content.md) - Disallow content arguments for void Action View elements
910
- [`erb-comment-syntax`](./erb-comment-syntax.md) - Disallow Ruby comments immediately after ERB tags
1011
- [`erb-no-case-node-children`](./erb-no-case-node-children.md) - Don't use `children` for `case/when` and `case/in` nodes
1112
- [`erb-no-conditional-html-element`](./erb-no-conditional-html-element.md) - Disallow conditional HTML elements
Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
# Linter Rule: Disallow content arguments for void Action View elements
2+
3+
**Rule:** `actionview-no-void-element-content`
4+
5+
## Description
6+
7+
Void HTML elements like `img`, `br`, and `hr` cannot have content. When using Action View helpers like `tag.img` or `content_tag :img`, passing a positional content argument will raise a runtime error in Rails.
8+
9+
## Rationale
10+
11+
In Rails, `tag.*` helpers for void elements do not accept positional arguments for content. Calling `tag.img "/image.png"` raises `wrong number of arguments (given 1, expected 0)` at runtime.
12+
13+
The correct way to set attributes on void elements is to use keyword arguments, such as `tag.img src: "/image.png"`. This rule catches the error at lint time before it reaches production.
14+
15+
## Examples
16+
17+
### Good
18+
19+
```erb
20+
<%= tag.img src: "/image.png", alt: "Photo" %>
21+
```
22+
23+
```erb
24+
<%= tag.br %>
25+
```
26+
27+
```erb
28+
<%= tag.hr class: "divider" %>
29+
```
30+
31+
```erb
32+
<%= content_tag :img, src: "/image.png", alt: "Photo" %>
33+
```
34+
35+
### Bad
36+
37+
```erb
38+
<%= tag.img "/image.png" %>
39+
```
40+
41+
```erb
42+
<%= tag.br "hello" %>
43+
```
44+
45+
```erb
46+
<%= content_tag :img, "hello" %>
47+
```
48+
49+
```erb
50+
<%= content_tag :br, "hello" %>
51+
```
52+
53+
## References
54+
55+
* [Rails `ActionView::Helpers::TagHelper#tag`](https://api.rubyonrails.org/classes/ActionView/Helpers/TagHelper.html#method-i-tag)
56+
* [Rails `ActionView::Helpers::TagHelper#content_tag`](https://api.rubyonrails.org/classes/ActionView/Helpers/TagHelper.html#method-i-content_tag)
57+
* [HTML Void Elements](https://html.spec.whatwg.org/multipage/syntax.html#void-elements)

0 commit comments

Comments
 (0)