[FEATURE] Consider ERB indentation

[Splines]

HTML ESLint supports integrating a template engine like Ruby ERB, which works like a charm. It would be amazing if indentation could also be detected and exposed via a config option. Consider this example:

<%= form_with(model: @event) do |f| %>
<div class="form-floating">
  <%= f.text_field :name, required: true, class: "form-control", placeholder: "" %>
  <%= f.label :name %>
</div>
<% end %>

A config option could allow us to specify that we want indentation here as well:

<%= form_with(model: @event) do |f| %>
  <div class="form-floating">
    <%= f.text_field :name, required: true, class: "form-control", placeholder: "" %>
    <%= f.label :name %>
  </div>
<% end %>

Possible problems

• I'm not sure if this issue is something html-eslint can provide since you'd probably have to use a whole ERB parser to detect these scenarios holistically. E.g. consider already that not all ERB expressions require nesting, e.g. a simple variable assignment is a one-liner.
• Also, nesting should be properly detected, e.g. imagine another ERB block inside the form_with block.

Workarounds

Accept that this indentation is currently not detected and see it as incentive to avoid deeply nesting your forms. Instead use ViewComponents and/or Rails helpers to make your code more structured.

[yeonjuan]

Hi @Splines. Thanks for the suggestion. That’s a good idea. I plan to evolve the parser so that it can also determine whether a template is block-level or inline, and whether it is conditional. At that point, I expect it will also be able to handle indentation for blocks.