Ensure labels are clickable when dealing with date/time/datetime selects, for better accessibility

lib/simple_form/components/label.rb

@@ -35,7 +35,20 @@ module SimpleForm
       def content
         html_options = component_html_options
         html_options[:for] = options[:input_html][:id] if options.key?(:input_html)
-        @builder.label(attribute, text, html_options)
+        @builder.label(attribute_name, text, html_options)
+      end
+
+      # Map attribute to specific name when dealing with date/time/timestamp,
+      # ensuring label will always be "clickable". For better accessibility.
+      def attribute_name
+        case input_type
+          when :date, :datetime
+            "#{attribute}_1i"
+          when :time
+            "#{attribute}_4i"
+          else
+            attribute
+        end
       end
 
       # The method that actually generates the label. This can be overwriten using

test/components/label_test.rb

@@ -150,4 +150,19 @@ class LabelTest < ActionView::TestCase
     with_label_for :project, :description, :string, :required => false
     assert_no_select 'label.required[for=project_description]'
   end
+
+  test 'label should point to first option when date input type' do
+    with_label_for :project, :created_at, :date
+    assert_select 'label[for=project_created_at_1i]'
+  end
+
+  test 'label should point to first option when datetime input type' do
+    with_label_for :project, :created_at, :datetime
+    assert_select 'label[for=project_created_at_1i]'
+  end
+
+  test 'label should point to first option when time input type' do
+    with_label_for :project, :created_at, :time
+    assert_select 'label[for=project_created_at_4i]'
+  end
 end