Merge pull request #2423 from teamcapybara/multiple_label

Support multiple labels when using allow_label_click on a checkbox - …

lib/capybara/node/actions.rb

@@ -363,7 +363,6 @@ def _reset_style(element)
       def _check_with_label(selector, checked, locator,
                             allow_label_click: session_options.automatic_label_click, **options)
         options[:allow_self] = true if locator.nil?
-
         synchronize(Capybara::Queries::BaseQuery.wait(options, session_options.default_max_wait_time)) do
           el = find(selector, locator, **options)
           el.set(checked)
@@ -372,7 +371,7 @@ def _check_with_label(selector, checked, locator,
 
           begin
             el ||= find(selector, locator, **options.merge(visible: :all))
-            el.session.find(:label, for: el, visible: true).click unless el.checked? == checked
+            el.session.find(:label, for: el, visible: true, match: :first).click unless el.checked? == checked
           rescue StandardError # swallow extra errors - raise original
             raise e
           end

lib/capybara/spec/session/check_spec.rb

@@ -229,6 +229,12 @@
           @session.click_button('awesome')
           expect(extract_results(@session)['cars']).to include('bugatti')
         end
+
+        it 'should check via label if multiple labels' do
+          expect(@session).to have_field('multi_label_checkbox', checked: false, visible: :hidden)
+          @session.check('Label to click', allow_label_click: true)
+          expect(@session).to have_field('multi_label_checkbox', checked: true, visible: :hidden)
+        end
       end
     end
   end

lib/capybara/spec/views/form.erb

@@ -690,3 +690,15 @@ New line after and before textarea tag
 <p>
   <input id="special" {custom}="abcdef" value="custom attribute"/>
 </p>
+
+
+<label for="multi_label_checkbox">
+  Label to click
+</label>
+<div>Something random that justifies the usage of a separate label</div>
+<label>
+  <div>
+    <input type="checkbox" id="multi_label_checkbox" style="display: none"/>
+    <div>Visual representation of the checkbox</div>
+  </div>
+</label>