From 79564847b3a933d9d743cbdc5fc53b11b36f0a6a Mon Sep 17 00:00:00 2001
From: inottn <inottn@outlook.com>
Date: Sat, 17 Jun 2023 21:07:20 +0800
Subject: [PATCH] fix(Field): should not set `for` attr to label when using
 input slot (#11966)

* fix(Field): when using input slot, the label's for attribute will not be set

* test(Field): add test case
---
 .../test/__snapshots__/demo-ssr.spec.ts.snap  |  4 ---
 .../test/__snapshots__/demo.spec.ts.snap      | 16 +++-------
 packages/vant/src/field/Field.tsx             |  2 +-
 packages/vant/src/field/test/index.spec.js    | 15 +++++++++
 .../test/__snapshots__/demo-ssr.spec.ts.snap  |  8 -----
 .../form/test/__snapshots__/demo.spec.ts.snap | 32 +++++--------------
 6 files changed, 28 insertions(+), 49 deletions(-)

diff --git a/packages/vant/src/config-provider/test/__snapshots__/demo-ssr.spec.ts.snap b/packages/vant/src/config-provider/test/__snapshots__/demo-ssr.spec.ts.snap
index 163bf5d11..6b2e4c2db 100644
--- a/packages/vant/src/config-provider/test/__snapshots__/demo-ssr.spec.ts.snap
+++ b/packages/vant/src/config-provider/test/__snapshots__/demo-ssr.spec.ts.snap
@@ -24,7 +24,6 @@ exports[`should render demo and match snapshot 1`] = `
         >
           <!--[-->
           <label id="van-field-label"
-                 for="van-field-input"
                  style
           >
             Rate
@@ -123,7 +122,6 @@ exports[`should render demo and match snapshot 1`] = `
         >
           <!--[-->
           <label id="van-field-label"
-                 for="van-field-input"
                  style
           >
             Slider
@@ -188,7 +186,6 @@ exports[`should render demo and match snapshot 1`] = `
           >
             <!--[-->
             <label id="van-field-label"
-                   for="van-field-input"
                    style
             >
               Rate
@@ -287,7 +284,6 @@ exports[`should render demo and match snapshot 1`] = `
           >
             <!--[-->
             <label id="van-field-label"
-                   for="van-field-input"
                    style
             >
               Slider
diff --git a/packages/vant/src/config-provider/test/__snapshots__/demo.spec.ts.snap b/packages/vant/src/config-provider/test/__snapshots__/demo.spec.ts.snap
index 7ce760862..cee9c8113 100644
--- a/packages/vant/src/config-provider/test/__snapshots__/demo.spec.ts.snap
+++ b/packages/vant/src/config-provider/test/__snapshots__/demo.spec.ts.snap
@@ -15,9 +15,7 @@ exports[`should render demo and match snapshot 1`] = `
     <form class="van-form">
       <div class="van-cell van-field">
         <div class="van-cell__title van-field__label">
-          <label id="van-field-label"
-                 for="van-field-input"
-          >
+          <label id="van-field-label">
             Rate
           </label>
         </div>
@@ -87,9 +85,7 @@ exports[`should render demo and match snapshot 1`] = `
       </div>
       <div class="van-cell van-field">
         <div class="van-cell__title van-field__label">
-          <label id="van-field-label"
-                 for="van-field-input"
-          >
+          <label id="van-field-label">
             Slider
           </label>
         </div>
@@ -137,9 +133,7 @@ exports[`should render demo and match snapshot 1`] = `
       <form class="van-form">
         <div class="van-cell van-field">
           <div class="van-cell__title van-field__label">
-            <label id="van-field-label"
-                   for="van-field-input"
-            >
+            <label id="van-field-label">
               Rate
             </label>
           </div>
@@ -209,9 +203,7 @@ exports[`should render demo and match snapshot 1`] = `
         </div>
         <div class="van-cell van-field">
           <div class="van-cell__title van-field__label">
-            <label id="van-field-label"
-                   for="van-field-input"
-            >
+            <label id="van-field-label">
               Slider
             </label>
           </div>
diff --git a/packages/vant/src/field/Field.tsx b/packages/vant/src/field/Field.tsx
index 4c1a4c145..08193c883 100644
--- a/packages/vant/src/field/Field.tsx
+++ b/packages/vant/src/field/Field.tsx
@@ -583,7 +583,7 @@ export default defineComponent({
         return (
           <label
             id={`${id}-label`}
-            for={getInputId()}
+            for={slots.input ? undefined : getInputId()}
             onClick={(event: MouseEvent) => {
               // https://github.com/youzan/vant/issues/11831
               preventDefault(event);
diff --git a/packages/vant/src/field/test/index.spec.js b/packages/vant/src/field/test/index.spec.js
index ec55dae2b..8dd7e7418 100644
--- a/packages/vant/src/field/test/index.spec.js
+++ b/packages/vant/src/field/test/index.spec.js
@@ -533,3 +533,18 @@ test('should render label correctly when dynamically set empty label', async ()
   await wrapper.setProps({ label: '' });
   expect(wrapper.find('.van-field__label').exists()).toBeFalsy();
 });
+
+test("should not be set label's for attribute when using input slot", async () => {
+  const wrapper = mount(Field, {
+    props: {
+      label: 'abc',
+    },
+    slots: {
+      input: '',
+    },
+  });
+
+  expect(
+    wrapper.find('.van-field__label label').attributes('for')
+  ).toBeUndefined();
+});
diff --git a/packages/vant/src/form/test/__snapshots__/demo-ssr.spec.ts.snap b/packages/vant/src/form/test/__snapshots__/demo-ssr.spec.ts.snap
index 0a9f9fcac..eaaad312c 100644
--- a/packages/vant/src/form/test/__snapshots__/demo-ssr.spec.ts.snap
+++ b/packages/vant/src/form/test/__snapshots__/demo-ssr.spec.ts.snap
@@ -208,7 +208,6 @@ exports[`should render demo and match snapshot 1`] = `
         >
           <!--[-->
           <label id="van-field-label"
-                 for="van-field-input"
                  style
           >
             Switch
@@ -238,7 +237,6 @@ exports[`should render demo and match snapshot 1`] = `
         >
           <!--[-->
           <label id="van-field-label"
-                 for="van-field-input"
                  style
           >
             Checkbox
@@ -275,7 +273,6 @@ exports[`should render demo and match snapshot 1`] = `
         >
           <!--[-->
           <label id="van-field-label"
-                 for="van-field-input"
                  style
           >
             Checkbox Group
@@ -339,7 +336,6 @@ exports[`should render demo and match snapshot 1`] = `
         >
           <!--[-->
           <label id="van-field-label"
-                 for="van-field-input"
                  style
           >
             Radio
@@ -405,7 +401,6 @@ exports[`should render demo and match snapshot 1`] = `
         >
           <!--[-->
           <label id="van-field-label"
-                 for="van-field-input"
                  style
           >
             Stepper
@@ -451,7 +446,6 @@ exports[`should render demo and match snapshot 1`] = `
         >
           <!--[-->
           <label id="van-field-label"
-                 for="van-field-input"
                  style
           >
             Rate
@@ -550,7 +544,6 @@ exports[`should render demo and match snapshot 1`] = `
         >
           <!--[-->
           <label id="van-field-label"
-                 for="van-field-input"
                  style
           >
             Slider
@@ -592,7 +585,6 @@ exports[`should render demo and match snapshot 1`] = `
         >
           <!--[-->
           <label id="van-field-label"
-                 for="van-field-input"
                  style
           >
             Uploader
diff --git a/packages/vant/src/form/test/__snapshots__/demo.spec.ts.snap b/packages/vant/src/form/test/__snapshots__/demo.spec.ts.snap
index 18f8a57a4..a5dc26b18 100644
--- a/packages/vant/src/form/test/__snapshots__/demo.spec.ts.snap
+++ b/packages/vant/src/form/test/__snapshots__/demo.spec.ts.snap
@@ -160,9 +160,7 @@ exports[`should render demo and match snapshot 1`] = `
     <div class="van-cell-group van-cell-group--inset">
       <div class="van-cell van-field">
         <div class="van-cell__title van-field__label">
-          <label id="van-field-label"
-                 for="van-field-input"
-          >
+          <label id="van-field-label">
             Switch
           </label>
         </div>
@@ -183,9 +181,7 @@ exports[`should render demo and match snapshot 1`] = `
       </div>
       <div class="van-cell van-field">
         <div class="van-cell__title van-field__label">
-          <label id="van-field-label"
-                 for="van-field-input"
-          >
+          <label id="van-field-label">
             Checkbox
           </label>
         </div>
@@ -208,9 +204,7 @@ exports[`should render demo and match snapshot 1`] = `
       </div>
       <div class="van-cell van-field">
         <div class="van-cell__title van-field__label">
-          <label id="van-field-label"
-                 for="van-field-input"
-          >
+          <label id="van-field-label">
             Checkbox Group
           </label>
         </div>
@@ -251,9 +245,7 @@ exports[`should render demo and match snapshot 1`] = `
       </div>
       <div class="van-cell van-field">
         <div class="van-cell__title van-field__label">
-          <label id="van-field-label"
-                 for="van-field-input"
-          >
+          <label id="van-field-label">
             Radio
           </label>
         </div>
@@ -296,9 +288,7 @@ exports[`should render demo and match snapshot 1`] = `
       </div>
       <div class="van-cell van-field">
         <div class="van-cell__title van-field__label">
-          <label id="van-field-label"
-                 for="van-field-input"
-          >
+          <label id="van-field-label">
             Stepper
           </label>
         </div>
@@ -332,9 +322,7 @@ exports[`should render demo and match snapshot 1`] = `
       </div>
       <div class="van-cell van-field">
         <div class="van-cell__title van-field__label">
-          <label id="van-field-label"
-                 for="van-field-input"
-          >
+          <label id="van-field-label">
             Rate
           </label>
         </div>
@@ -404,9 +392,7 @@ exports[`should render demo and match snapshot 1`] = `
       </div>
       <div class="van-cell van-field">
         <div class="van-cell__title van-field__label">
-          <label id="van-field-label"
-                 for="van-field-input"
-          >
+          <label id="van-field-label">
             Slider
           </label>
         </div>
@@ -436,9 +422,7 @@ exports[`should render demo and match snapshot 1`] = `
       </div>
       <div class="van-cell van-field">
         <div class="van-cell__title van-field__label">
-          <label id="van-field-label"
-                 for="van-field-input"
-          >
+          <label id="van-field-label">
             Uploader
           </label>
         </div>