From 0dd93a00320c13a1851c2fbb41f02d83ccac7092 Mon Sep 17 00:00:00 2001
From: neverland <chenjiahan@youzan.com>
Date: Wed, 17 Nov 2021 16:07:07 +0800
Subject: [PATCH] feat(Switch): add tabindex for a11y (#9887)

---
 .../src/address-edit/test/__snapshots__/demo.spec.ts.snap   | 1 +
 .../src/address-edit/test/__snapshots__/index.spec.js.snap  | 1 +
 .../src/contact-edit/test/__snapshots__/demo.spec.ts.snap   | 1 +
 packages/vant/src/form/test/__snapshots__/demo.spec.ts.snap | 1 +
 .../vant/src/skeleton/test/__snapshots__/demo.spec.ts.snap  | 1 +
 packages/vant/src/switch/Switch.tsx                         | 1 +
 .../vant/src/switch/test/__snapshots__/demo.spec.ts.snap    | 6 ++++++
 7 files changed, 12 insertions(+)

diff --git a/packages/vant/src/address-edit/test/__snapshots__/demo.spec.ts.snap b/packages/vant/src/address-edit/test/__snapshots__/demo.spec.ts.snap
index 9084d62c2..ed07d9c7a 100644
--- a/packages/vant/src/address-edit/test/__snapshots__/demo.spec.ts.snap
+++ b/packages/vant/src/address-edit/test/__snapshots__/demo.spec.ts.snap
@@ -117,6 +117,7 @@ exports[`should render demo and match snapshot 1`] = `
       <div role="switch"
            class="van-switch"
            style="font-size: 24px;"
+           tabindex="0"
            aria-checked="false"
       >
         <div class="van-switch__node">
diff --git a/packages/vant/src/address-edit/test/__snapshots__/index.spec.js.snap b/packages/vant/src/address-edit/test/__snapshots__/index.spec.js.snap
index 7c39ce14e..2aaf61dd6 100644
--- a/packages/vant/src/address-edit/test/__snapshots__/index.spec.js.snap
+++ b/packages/vant/src/address-edit/test/__snapshots__/index.spec.js.snap
@@ -222,6 +222,7 @@ exports[`should render AddressEdit with props correctly 1`] = `
     <div role="switch"
          class="van-switch van-switch--on"
          style="font-size: 24px;"
+         tabindex="0"
          aria-checked="true"
     >
       <div class="van-switch__node">
diff --git a/packages/vant/src/contact-edit/test/__snapshots__/demo.spec.ts.snap b/packages/vant/src/contact-edit/test/__snapshots__/demo.spec.ts.snap
index 51aa33cbc..eefb5dfc0 100644
--- a/packages/vant/src/contact-edit/test/__snapshots__/demo.spec.ts.snap
+++ b/packages/vant/src/contact-edit/test/__snapshots__/demo.spec.ts.snap
@@ -52,6 +52,7 @@ exports[`should render demo and match snapshot 1`] = `
       <div role="switch"
            class="van-switch"
            style="font-size: 24px;"
+           tabindex="0"
            aria-checked="false"
       >
         <div class="van-switch__node">
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 f3ca28332..b2072dc75 100644
--- a/packages/vant/src/form/test/__snapshots__/demo.spec.ts.snap
+++ b/packages/vant/src/form/test/__snapshots__/demo.spec.ts.snap
@@ -172,6 +172,7 @@ exports[`should render demo and match snapshot 1`] = `
               <div role="switch"
                    class="van-switch"
                    style="font-size: 20px;"
+                   tabindex="0"
                    aria-checked="false"
               >
                 <div class="van-switch__node">
diff --git a/packages/vant/src/skeleton/test/__snapshots__/demo.spec.ts.snap b/packages/vant/src/skeleton/test/__snapshots__/demo.spec.ts.snap
index 6bd34ad96..801a39883 100644
--- a/packages/vant/src/skeleton/test/__snapshots__/demo.spec.ts.snap
+++ b/packages/vant/src/skeleton/test/__snapshots__/demo.spec.ts.snap
@@ -47,6 +47,7 @@ exports[`should render demo and match snapshot 1`] = `
   <div role="switch"
        class="van-switch"
        style="font-size: 24px;"
+       tabindex="0"
        aria-checked="false"
   >
     <div class="van-switch__node">
diff --git a/packages/vant/src/switch/Switch.tsx b/packages/vant/src/switch/Switch.tsx
index fcd1968af..18798f8aa 100644
--- a/packages/vant/src/switch/Switch.tsx
+++ b/packages/vant/src/switch/Switch.tsx
@@ -68,6 +68,7 @@ export default defineComponent({
             disabled,
           })}
           style={style}
+          tabindex={disabled ? undefined : 0}
           aria-checked={checked}
           onClick={onClick}
         >
diff --git a/packages/vant/src/switch/test/__snapshots__/demo.spec.ts.snap b/packages/vant/src/switch/test/__snapshots__/demo.spec.ts.snap
index ad9cecd0e..2dd9df6da 100644
--- a/packages/vant/src/switch/test/__snapshots__/demo.spec.ts.snap
+++ b/packages/vant/src/switch/test/__snapshots__/demo.spec.ts.snap
@@ -4,6 +4,7 @@ exports[`should render demo and match snapshot 1`] = `
 <div>
   <div role="switch"
        class="van-switch van-switch--on"
+       tabindex="0"
        aria-checked="true"
   >
     <div class="van-switch__node">
@@ -22,6 +23,7 @@ exports[`should render demo and match snapshot 1`] = `
 <div>
   <div role="switch"
        class="van-switch van-switch--on van-switch--loading"
+       tabindex="0"
        aria-checked="true"
   >
     <div class="van-switch__node">
@@ -46,6 +48,7 @@ exports[`should render demo and match snapshot 1`] = `
   <div role="switch"
        class="van-switch van-switch--on"
        style="font-size: 24px;"
+       tabindex="0"
        aria-checked="true"
   >
     <div class="van-switch__node">
@@ -56,6 +59,7 @@ exports[`should render demo and match snapshot 1`] = `
   <div role="switch"
        class="van-switch van-switch--on"
        style="background-color: rgb(238, 10, 36);"
+       tabindex="0"
        aria-checked="true"
   >
     <div class="van-switch__node">
@@ -65,6 +69,7 @@ exports[`should render demo and match snapshot 1`] = `
 <div>
   <div role="switch"
        class="van-switch van-switch--on"
+       tabindex="0"
        aria-checked="true"
   >
     <div class="van-switch__node">
@@ -81,6 +86,7 @@ exports[`should render demo and match snapshot 1`] = `
     <div role="switch"
          class="van-switch van-switch--on"
          style="font-size: 24px;"
+         tabindex="0"
          aria-checked="true"
     >
       <div class="van-switch__node">