-
-
Notifications
You must be signed in to change notification settings - Fork 80
Description
Rule: html-no-deprecated-ujs-attributes
Description
Disallow the use of deprecated Rails UJS attributes and data-* attributes. These were part of @rails/ujs (and its predecessor jquery-ujs) and have been superseded by Turbo and Stimulus equivalents.
Rationale
Prior to Rails 7, Rails shipped with @rails/ujs by default. This library added JavaScript behavior to HTML elements through special options and data-* attributes. Following Rails 7, this library is no longer included by default.
The @rails/ujs library integrated with the following link_to options:
-
method:dynamically creates an HTML form and immediately submits it using the specified HTTP verb. Supported verbs are:post,:delete,:patch, and:put. If the user has JavaScript disabled, the request falls back to GET. -
remote: truemakes@rails/ujsperform an Ajax request to the URL instead of following the link.
It also integrated with the following data: options:
-
confirm:prompts the user with the specified question. If the user accepts, the action proceeds normally; otherwise no action is taken. -
disable_with:replaces the element's text with the specified value while the request is in progress, preventing double submissions.
Continuing to use these attributes in new code leads to a mix of legacy and modern patterns, making the codebase harder to understand and maintain. Migrating to Turbo equivalents ensures compatibility with modern Rails and removes the dependency on the legacy @rails/ujs library.
Examples
✅ Good
<%= link_to "Delete", post_path(@post), data: { turbo_method: :delete } %><%= link_to "Delete", post_path(@post), data: { turbo_confirm: "Are you sure?" } %><%= form_with model: @post do |f| %>
<%= f.submit "Save", data: { turbo_submits_with: "Saving..." } %>
<% end %><a href="/posts/1" data-turbo-method="delete">Delete</a><a href="/posts/1" data-turbo-confirm="Are you sure?">Delete</a><button data-turbo-submits-with="Saving...">Save</button>🚫 Bad
<%= link_to "Delete", post_path(@post), method: :delete %><%= link_to "Delete", post_path(@post), data: { method: :delete } %><%= link_to "Delete", post_path(@post), data: { confirm: "Are you sure?" } %><%= form_with model: @post do |f| %>
<%= f.submit "Save", data: { disable_with: "Saving..." } %>
<% end %><a href="/posts/1" data-method="delete">Delete</a><a href="/posts/1" data-confirm="Are you sure?">Delete</a><button data-disable-with="Saving...">Save</button><a href="/posts" data-remote="true">Load posts</a>