Linter: Implement erb-safety family of linter rules (#1330)

This pull request implements the full set of ERB safety linter rules,
covering all checks from
[better-html](https://github.com/Shopify/better-html) `SafeErb` test
helpers and [erb_lint](https://github.com/Shopify/erb_lint) `ErbSafety`
linter.

This now also brings the linter in-sync with the `SecurityValidator` the
`Herb::Engine` has been enforcing.

Resolves #546
Resolves #1058
Resolves #1251


#### New Rules

| Rule                                   | Description                                                                                        |
|----------------------------------------|----------------------------------------------------------------------------------------------------|
| `erb-no-statement-in-script`           | Avoid `<% %>` tags inside `<script>`. Use `<%= %>` to interpolate values into JavaScript.          |
| `erb-no-javascript-tag-helper`         | Avoid `javascript_tag`. Use inline `<script>` tags instead.                                        |
| `erb-no-unsafe-script-interpolation`   | ERB output in `<script>` tags must use `.to_json` to safely serialize values.                      |
| `erb-no-raw-output-in-attribute-value` | Avoid `<%==` in attribute values. Use `<%= %>` instead.                                            |
| `erb-no-unsafe-raw`                    | Avoid `raw()` and `.html_safe` in ERB output (skips raw-text elements like `<script>`, `<style>`). |
| `erb-no-unsafe-js-attribute`           | ERB output in `on*` attributes must use `.to_json`, `j()`, or `escape_javascript()`.               |
| `erb-no-output-in-attribute-position`  | Avoid `<%= %>` in attribute position. Use `<% if ... %>` with static attributes instead.           |
| `erb-no-output-in-attribute-name`      | Avoid ERB output in attribute names. Use static attribute names with dynamic values instead.       |

#### Mapping to better-html / erb_lint

| better-html checker     | Our rule(s)                                                                                                                                                         |
|-------------------------|---------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| `AllowedScriptType`     | `html-allowed-script-type` (pre-existing)                                                                                                                           |
| `NoStatements`          | `erb-no-statement-in-script`                                                                                                                                        |
| `NoJavascriptTagHelper` | `erb-no-javascript-tag-helper`                                                                                                                                      |
| `ScriptInterpolation`   | `erb-no-unsafe-script-interpolation`                                                                                                                                |
| `TagInterpolation`      | `erb-no-raw-output-in-attribute-value`, `erb-no-unsafe-raw`, `erb-no-unsafe-js-attribute`, `erb-no-output-in-attribute-position`, `erb-no-output-in-attribute-name` |

Author: marcoroth

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

@@ -6,20 +6,28 @@ This page contains documentation for all Herb Linter rules.
 
 - [`erb-comment-syntax`](./erb-comment-syntax.md) - Disallow Ruby comments immediately after ERB tags
 - [`erb-no-case-node-children`](./erb-no-case-node-children.md) - Don't use `children` for `case/when` and `case/in` nodes
-- [`erb-no-inline-case-conditions`](./erb-no-inline-case-conditions.md) - Disallow inline `case`/`when` and `case`/`in` conditions in a single ERB tag
 - [`erb-no-conditional-html-element`](./erb-no-conditional-html-element.md) - Disallow conditional HTML elements
 - [`erb-no-duplicate-branch-elements`](./erb-no-duplicate-branch-elements.md) - Disallow duplicate elements across conditional branches
 - [`erb-no-empty-tags`](./erb-no-empty-tags.md) - Disallow empty ERB tags
-- [`erb-no-interpolated-class-names`](./erb-no-interpolated-class-names.md) - Disallow ERB interpolation inside CSS class names
 - [`erb-no-extra-newline`](./erb-no-extra-newline.md) - Disallow extra newlines.
 - [`erb-no-extra-whitespace-inside-tags`](./erb-no-extra-whitespace-inside-tags.md) - Disallow multiple consecutive spaces inside ERB tags
+- [`erb-no-inline-case-conditions`](./erb-no-inline-case-conditions.md) - Disallow inline `case`/`when` and `case`/`in` conditions in a single ERB tag
+- [`erb-no-interpolated-class-names`](./erb-no-interpolated-class-names.md) - Disallow ERB interpolation inside CSS class names
+- [`erb-no-javascript-tag-helper`](./erb-no-javascript-tag-helper.md) - Disallow `javascript_tag` helper
 - [`erb-no-output-control-flow`](./erb-no-output-control-flow.md) - Prevents outputting control flow blocks
-- [`erb-no-then-in-control-flow`](./erb-no-then-in-control-flow.md) - Disallow `then` in ERB control flow expressions
+- [`erb-no-output-in-attribute-name`](./erb-no-output-in-attribute-name.md) - Disallow ERB output in attribute names
+- [`erb-no-output-in-attribute-position`](./erb-no-output-in-attribute-position.md) - Disallow ERB output in attribute position
+- [`erb-no-raw-output-in-attribute-value`](./erb-no-raw-output-in-attribute-value.md) - Disallow `<%==` in attribute values
 - [`erb-no-silent-tag-in-attribute-name`](./erb-no-silent-tag-in-attribute-name.md) - Disallow ERB silent tags in HTML attribute names
+- [`erb-no-statement-in-script`](./erb-no-statement-in-script.md) - Disallow ERB statements inside `<script>` tags
+- [`erb-no-then-in-control-flow`](./erb-no-then-in-control-flow.md) - Disallow `then` in ERB control flow expressions
 - [`erb-no-trailing-whitespace`](./erb-no-trailing-whitespace.md) - Disallow trailing whitespace at end of lines.
+- [`erb-no-unsafe-js-attribute`](./erb-no-unsafe-js-attribute.md) - Disallow unsafe ERB output in JavaScript attributes
+- [`erb-no-unsafe-raw`](./erb-no-unsafe-raw.md) - Disallow `raw()` and `.html_safe` in ERB output
+- [`erb-no-unsafe-script-interpolation`](./erb-no-unsafe-script-interpolation.md) - Disallow unsafe ERB output inside `<script>` tags
 - [`erb-prefer-image-tag-helper`](./erb-prefer-image-tag-helper.md) - Prefer `image_tag` helper over `<img>` with ERB expressions
-- [`erb-require-whitespace-inside-tags`](./erb-require-whitespace-inside-tags.md) - Requires whitespace around ERB tags
 - [`erb-require-trailing-newline`](./erb-require-trailing-newline.md) - Enforces that all HTML+ERB template files end with exactly one trailing newline character.
+- [`erb-require-whitespace-inside-tags`](./erb-require-whitespace-inside-tags.md) - Requires whitespace around ERB tags
 - [`erb-right-trim`](./erb-right-trim.md) - Enforce consistent right-trimming syntax.
 - [`erb-strict-locals-comment-syntax`](./erb-strict-locals-comment-syntax.md) - Enforce strict locals comment syntax.
 - [`herb-disable-comment-malformed`](./herb-disable-comment-malformed.md) - Detect malformed `herb:disable` comments.
@@ -43,8 +51,8 @@ This page contains documentation for all Herb Linter rules.
 - [`html-boolean-attributes-no-value`](./html-boolean-attributes-no-value.md) - Prevents values on boolean attributes
 - [`html-head-only-elements`](./html-head-only-elements.md) - Require head-scoped elements inside `<head>`.
 - [`html-iframe-has-title`](./html-iframe-has-title.md) - `iframe` elements must have a `title` attribute
-- [`html-input-require-autocomplete`](./html-input-require-autocomplete.md) - Require `autocomplete` attributes on `<input>` tags.
 - [`html-img-require-alt`](./html-img-require-alt.md) - Requires `alt` attributes on `<img>` tags
+- [`html-input-require-autocomplete`](./html-input-require-autocomplete.md) - Require `autocomplete` attributes on `<input>` tags.
 - [`html-navigation-has-label`](./html-navigation-has-label.md) - Navigation landmarks must have accessible labels
 - [`html-no-abstract-roles`](./html-no-abstract-roles.md) - No abstract ARIA roles
 - [`html-no-aria-hidden-on-body`](./html-no-aria-hidden-on-body.md) - No `aria-hidden` on `<body>`

javascript/packages/linter/docs/rules/erb-no-javascript-tag-helper.md

@@ -0,0 +1,33 @@
+# Linter Rule: Disallow `javascript_tag` helper
+
+**Rule:** `erb-no-javascript-tag-helper`
+
+## Description
+
+The `javascript_tag do` helper syntax is deprecated. Use inline `<script>` tags instead, which allows the linter to properly analyze ERB output within JavaScript.
+
+## Rationale
+
+The `javascript_tag` helper renders its block as raw text, which means unsafe ERB interpolation inside it cannot be detected by other safety rules like `erb-no-unsafe-script-interpolation` or `erb-no-statement-in-script`. By using inline `<script>` tags instead, the linter can properly parse and validate that Ruby data is safely serialized with `.to_json` before being interpolated into JavaScript.
+
+## Examples
+
+### ✅ Good
+
+```erb
+<script>
+  if (a < 1) { alert("hello") }
+</script>
+```
+
+### 🚫 Bad
+
+```erb
+<%= javascript_tag do %>
+  if (a < 1) { <%= unsafe %> }
+<% end %>
+```
+
+## References
+
+- [Shopify/better-html — `NoJavascriptTagHelper`](https://github.com/Shopify/better-html/blob/main/lib/better_html/test_helper/safe_erb/no_javascript_tag_helper.rb)

javascript/packages/linter/docs/rules/erb-no-output-in-attribute-name.md

@@ -0,0 +1,38 @@
+# Linter Rule: Disallow ERB output in attribute names
+
+**Rule:** `erb-no-output-in-attribute-name`
+
+## Description
+
+ERB output tags (`<%= %>`) are not allowed in HTML attribute names. Use static attribute names with dynamic values instead.
+
+## Rationale
+
+ERB output in attribute names (e.g., `<div data-<%= key %>="value">`) allows dynamic control over which attributes are rendered. When such a value is user-controlled, an attacker can inject arbitrary attributes including JavaScript event handlers, achieving cross-site scripting (XSS).
+
+## Examples
+
+### Good
+
+```erb
+<div class="<%= css_class %>"></div>
+```
+
+```erb
+<input type="text" data-target="value">
+```
+
+### Bad
+
+```erb
+<div data-<%= key %>="value"></div>
+```
+
+```erb
+<div data-<%= key1 %>="value1" data-<%= key2 %>="value2"></div>
+```
+
+## References
+
+- [Shopify/erb_lint: `ErbSafety`](https://github.com/Shopify/erb_lint/tree/main?tab=readme-ov-file#erbsafety)
+- [Shopify/better_html](https://github.com/Shopify/better_html)

javascript/packages/linter/docs/rules/erb-no-output-in-attribute-position.md

@@ -0,0 +1,60 @@
+# Linter Rule: Disallow ERB output in attribute position
+
+**Rule:** `erb-no-output-in-attribute-position`
+
+## Description
+
+ERB output tags (`<%= %>` or `<%== %>`) are not allowed in attribute position. Use ERB control flow (`<% %>`) with static attribute names instead.
+
+## Rationale
+
+ERB output tags in attribute positions (e.g., `<div <%= attributes %>>`) allow arbitrary attribute injection at runtime. An attacker could inject event handler attributes like `onmouseover` or `onfocus` to execute JavaScript.
+
+For example, a common pattern like:
+
+```erb
+<div <%= "hidden" if index != 0 %>>...</div>
+```
+
+should be rewritten to use control flow with static attributes:
+
+```erb
+<div <% if index != 0 %> hidden <% end %>>...</div>
+```
+
+This ensures attribute names are always statically defined and prevents arbitrary attribute injection.
+
+## Examples
+
+### Good
+
+```erb
+<div class="<%= css_class %>"></div>
+```
+
+```erb
+<input value="<%= user.name %>">
+```
+
+```erb
+<div <% if active? %> class="active" <% end %>></div>
+```
+
+### Bad
+
+```erb
+<div <%= data_attributes %>></div>
+```
+
+```erb
+<div <%== raw_attributes %>></div>
+```
+
+```erb
+<div <%= first_attrs %> <%= second_attrs %>></div>
+```
+
+## References
+
+- [Shopify/erb_lint: `ErbSafety`](https://github.com/Shopify/erb_lint/tree/main?tab=readme-ov-file#erbsafety)
+- [Shopify/better_html](https://github.com/Shopify/better_html)

javascript/packages/linter/docs/rules/erb-no-raw-output-in-attribute-value.md

@@ -0,0 +1,37 @@
+# Linter Rule: Disallow `<%==` in attribute values
+
+**Rule:** `erb-no-raw-output-in-attribute-value`
+
+## Description
+
+ERB interpolation with `<%==` inside HTML attribute values is never safe. The `<%==` syntax bypasses HTML escaping entirely, allowing arbitrary attribute injection and XSS attacks. Use `<%=` instead to ensure proper escaping.
+
+## Rationale
+
+The `<%==` syntax outputs content without any HTML escaping. In an attribute value context, this means an attacker can inject a quote character to terminate the attribute, then inject arbitrary attributes including JavaScript event handlers. Even when combined with `.to_json`, using `<%==` in attributes is unsafe because it bypasses the template engine's built-in escaping that prevents attribute breakout.
+
+## Examples
+
+### ✅ Good
+
+```erb
+<div class="<%= user_input %>"></div>
+```
+
+### 🚫 Bad
+
+```erb
+<div class="<%== user_input %>"></div>
+```
+
+```erb
+<a href="<%== unsafe %>">Link</a>
+```
+
+```erb
+<a onclick="method(<%== unsafe.to_json %>)"></a>
+```
+
+## References
+
+- [Shopify/better-html — `TagInterpolation`](https://github.com/Shopify/better-html/blob/main/lib/better_html/test_helper/safe_erb/tag_interpolation.rb)

javascript/packages/linter/docs/rules/erb-no-statement-in-script.md

@@ -0,0 +1,68 @@
+# Linter Rule: Disallow ERB statements inside `<script>` tags
+
+**Rule:** `erb-no-statement-in-script`
+
+## Description
+
+Only insert expressions (`<%=` or `<%==`) inside `<script>` tags, never statements (`<% %>`). Statement tags inside `<script>` are likely a mistake, the author probably meant to use `<%= %>` to output a value.
+
+## Rationale
+
+ERB statement tags inside `<script>` tags execute Ruby code but produce no output into the JavaScript context, which is rarely intentional. If you need to interpolate a value into JavaScript, use expression tags (`<%= %>`) with `.to_json` for safe serialization. If you need conditional logic, restructure the template to keep control flow outside the `<script>` tag.
+
+Exceptions: `<% end %>` is allowed (for closing blocks), ERB comments (`<%# %>`) are allowed, and `<script type="text/html">` allows statement tags since it contains HTML templates, not JavaScript.
+
+## Examples
+
+### ✅ Good
+
+```erb
+<script>
+  var myValue = <%== value.to_json %>;
+  if (myValue) doSomething();
+</script>
+```
+
+```erb
+<script type="text/template">
+  <%= ui_form do %>
+    <div></div>
+  <% end %>
+</script>
+```
+
+```erb
+<script type="text/javascript">
+  <%# comment %>
+</script>
+```
+
+```erb
+<script type="text/html">
+  <% if condition %>
+    <p>Content</p>
+  <% end %>
+</script>
+```
+
+### 🚫 Bad
+
+```erb
+<script>
+  <% if value %>
+    doSomething();
+  <% end %>
+</script>
+```
+
+```erb
+<script type="text/javascript">
+  <% if foo? %>
+    bla
+  <% end %>
+</script>
+```
+
+## References
+
+- [Shopify/better-html - `NoStatements`](https://github.com/Shopify/better-html/blob/main/lib/better_html/test_helper/safe_erb/no_statements.rb)

javascript/packages/linter/docs/rules/erb-no-unsafe-js-attribute.md

@@ -0,0 +1,41 @@
+# Linter Rule: Disallow unsafe ERB output in JavaScript attributes
+
+**Rule:** `erb-no-unsafe-js-attribute`
+
+## Description
+
+ERB interpolation in JavaScript event handler attributes (`onclick`, `onmouseover`, etc.) must be wrapped in a safe helper such as `.to_json`, `j()`, or `escape_javascript()`. Without proper encoding, user-controlled values can break out of string literals and execute arbitrary JavaScript.
+
+## Rationale
+
+HTML attributes that start with `on` (like `onclick`, `onmouseover`, `onfocus`) are evaluated as JavaScript by the browser. When ERB output is interpolated into these attributes without proper encoding, it creates a JavaScript injection vector. The `.to_json` method properly serializes Ruby values into safe JavaScript literals, while `j()` and `escape_javascript()` escape values for safe embedding in JavaScript string contexts.
+
+## Examples
+
+### ✅ Good
+
+```erb
+<a onclick="method(<%= unsafe.to_json %>)"></a>
+```
+
+```erb
+<a onclick="method('<%= j(unsafe) %>')"></a>
+```
+
+```erb
+<a onclick="method(<%= escape_javascript(unsafe) %>)"></a>
+```
+
+### 🚫 Bad
+
+```erb
+<a onclick="method(<%= unsafe %>)"></a>
+```
+
+```erb
+<div onmouseover="highlight('<%= element_id %>')"></div>
+```
+
+## References
+
+- [Shopify/better-html — TagInterpolation](https://github.com/Shopify/better-html/blob/main/lib/better_html/test_helper/safe_erb/tag_interpolation.rb)

javascript/packages/linter/docs/rules/erb-no-unsafe-raw.md

@@ -0,0 +1,47 @@
+# Linter Rule: Disallow `raw()` and `.html_safe` in ERB output
+
+**Rule:** `erb-no-unsafe-raw`
+
+## Description
+
+Disallow the use of `raw()` and `.html_safe` in ERB output tags. These methods bypass Rails' automatic HTML escaping, which is the primary defense against cross-site scripting (XSS) vulnerabilities.
+
+## Rationale
+
+Rails automatically escapes ERB output to prevent XSS. Using `raw()` or `.html_safe` disables this protection, allowing arbitrary HTML and JavaScript injection. Even when combined with other safe methods like `.to_json`, using `raw()` or `.html_safe` is still unsafe because the escaping bypass applies to the final output.
+
+For example, `<%= raw unsafe.to_json %>` is flagged because `raw()` disables escaping on the entire expression, even though `.to_json` serializes the value safely. The `raw()` wrapper means any future changes to the expression could silently introduce a vulnerability.
+
+## Examples
+
+### ✅ Good
+
+```erb
+<div class="<%= user_input %>"></div>
+```
+
+```erb
+<p><%= user_input %></p>
+```
+
+### 🚫 Bad
+
+```erb
+<div class="<%= raw(user_input) %>"></div>
+```
+
+```erb
+<div class="<%= user_input.html_safe %>"></div>
+```
+
+```erb
+<p><%= raw(user_input) %></p>
+```
+
+```erb
+<p><%= user_input.html_safe %></p>
+```
+
+## References
+
+- [Shopify/better-html — TagInterpolation](https://github.com/Shopify/better-html/blob/main/lib/better_html/test_helper/safe_erb/tag_interpolation.rb)