From a7f6662f90168fef64f6ded01f3bfdda5d19fdbc Mon Sep 17 00:00:00 2001
From: Saito Nakamura <saitonakamuramb@gmail.com>
Date: Mon, 10 Sep 2018 17:18:51 +0300
Subject: [PATCH 1/2] Improve a11y by using button with role switch

As for [mozilla switch guidelines](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_switch_role)
Plus I switched `span` for `button` to get support for `Enter` and `Space`  keys out of the box (now the browser will take care about it and that's why I deleted the test, cause enzyme doesn't fire `onClick` on such keypresses, but the browsers will do)
---
 assets/index.less   |  4 +++-
 src/Switch.jsx      | 13 ++++++-------
 tests/index.spec.js |  8 --------
 3 files changed, 9 insertions(+), 16 deletions(-)

diff --git a/assets/index.less b/assets/index.less
index c59b5bc..9ac242b 100644
--- a/assets/index.less
+++ b/assets/index.less
@@ -9,6 +9,7 @@
   width: 44px;
   height: 22px;
   line-height: 20px;
+  padding: 0;
   vertical-align: middle;
   border-radius: 20px 20px;
   border: 1px solid #ccc;
@@ -20,7 +21,8 @@
     color:#fff;
     font-size: 12px;
     position: absolute;
-    left:24px;
+    left: 24px;
+    top: 0;
   }
 
   &:after{
diff --git a/src/Switch.jsx b/src/Switch.jsx
index 7ea1cb1..7418fb5 100644
--- a/src/Switch.jsx
+++ b/src/Switch.jsx
@@ -57,8 +57,6 @@ class Switch extends Component {
       this.setChecked(false);
     } else if (e.keyCode === 39) { // Right
       this.setChecked(true);
-    } else if (e.keyCode === 32 || e.keyCode === 13) { // Space, Enter
-      this.toggle();
     }
   }
 
@@ -86,9 +84,8 @@ class Switch extends Component {
 
   render() {
     const { className, prefixCls, disabled, loadingIcon,
-      checkedChildren, tabIndex, unCheckedChildren, ...restProps } = this.props;
+      checkedChildren, unCheckedChildren, ...restProps } = this.props;
     const checked = this.state.checked;
-    const switchTabIndex = disabled ? -1 : (tabIndex || 0);
     const switchClassName = classNames({
       [className]: !!className,
       [prefixCls]: true,
@@ -96,10 +93,12 @@ class Switch extends Component {
       [`${prefixCls}-disabled`]: disabled,
     });
     return (
-      <span
+      <button
         {...restProps}
+        role="switch"
+        aria-checked={checked}
+        disabled={disabled}
         className={switchClassName}
-        tabIndex={switchTabIndex}
         ref={this.saveNode}
         onKeyDown={this.handleKeyDown}
         onClick={this.toggle}
@@ -109,7 +108,7 @@ class Switch extends Component {
         <span className={`${prefixCls}-inner`}>
           {checked ? checkedChildren : unCheckedChildren}
         </span>
-      </span>
+      </button>
     );
   }
 }
diff --git a/tests/index.spec.js b/tests/index.spec.js
index 3bde152..b794d41 100644
--- a/tests/index.spec.js
+++ b/tests/index.spec.js
@@ -23,14 +23,6 @@ describe('rc-switch', () => {
     expect(switcher.state().checked).toBe(false);
   });
 
-  it('should toggle upon space and enter key', () => {
-    expect(switcher.state().checked).toBe(false);
-    switcher.simulate('keydown', { keyCode: 32 });
-    expect(switcher.state().checked).toBe(true);
-    switcher.simulate('keydown', { keyCode: 13 });
-    expect(switcher.state().checked).toBe(false);
-  });
-
   it('should change from an initial checked state of true to false on click', () => {
     const wrapper = mount(<Switch defaultChecked/>);
     expect(wrapper.state().checked).toBe(true);

From cbe38fbad0a1767e0e2c503a4ef6075191fa7e8a Mon Sep 17 00:00:00 2001
From: Saito Nakamura <saitonakamuramb@gmail.com>
Date: Mon, 10 Sep 2018 18:00:13 +0300
Subject: [PATCH 2/2] Add type=button to not accidentally trigger submit

---
 src/Switch.jsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/Switch.jsx b/src/Switch.jsx
index 7418fb5..b171af1 100644
--- a/src/Switch.jsx
+++ b/src/Switch.jsx
@@ -95,6 +95,7 @@ class Switch extends Component {
     return (
       <button
         {...restProps}
+        type="button"
         role="switch"
         aria-checked={checked}
         disabled={disabled}