Chrome error: label's for attribute doesn't match any element id

[MtnBiker]

Error reported by Chrome

"The label's for attribute doesn't match any element id. This might prevent the browser from correctly autofilling the form and accessibility tools from working correctly"

Everything seems to be working OK. But noted while trying to debug something else.

Environment

• Ruby v3.2
• Rails 7.1
• simple_form (5.2.0)
• gem "jsbundling-rails"

html.erb

<%= simple_form_for @year do |form| %> 
  <%= form.label :year_date, "Date:", class:"fw-bold" %>
  <%= form.input :year_date, start_year: 1874, end_year: 1950, label: false %>

Results in

  <label class="fw-bold" for="year_year_date">Date:</label>
      <div class="input date optional year_year_date field_without_errors"><select id="year_year_date_1i" name="year[year_date(1i)]" class="date optional">
<option value="1874">1874</option>

[nashby]

Two things here:

1. When you use label separately like this it's expected that label is going to be generated for "year_date_date" since that's default behaviour.
2. If you want to match first date select (it's going to be year select) you have to use label component like this:

<%= f.input :year_date, as: :date, start_year: 1874, end_year: 1950, label: 'Date:', label_html: { class: 'fw-bold' } %>

There's similar discussion here https://github.com/heartcombo/simple_form/issues/79