fix: Upload accessibility experience (#46432)

* fix: Upload tab experience

* test: update snapshot

* fix lint

components/config-provider/__tests__/__snapshots__/components.test.tsx.snap

@@ -42270,8 +42270,6 @@ exports[`ConfigProvider components Upload configProvider 1`] = `
   >
     <span
       class="config-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -42368,7 +42366,6 @@ exports[`ConfigProvider components Upload configProvider componentDisabled 1`] =
   >
     <span
       class="config-upload config-upload-disabled"
-      role="button"
     >
       <input
         accept=""
@@ -42435,8 +42432,6 @@ exports[`ConfigProvider components Upload configProvider componentSize large 1`]
   >
     <span
       class="config-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -42533,8 +42528,6 @@ exports[`ConfigProvider components Upload configProvider componentSize middle 1`
   >
     <span
       class="config-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -42631,8 +42624,6 @@ exports[`ConfigProvider components Upload configProvider componentSize small 1`]
   >
     <span
       class="config-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -42729,8 +42720,6 @@ exports[`ConfigProvider components Upload normal 1`] = `
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -42827,8 +42816,6 @@ exports[`ConfigProvider components Upload prefixCls 1`] = `
   >
     <span
       class="prefix-Upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""

components/form/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -5184,7 +5184,6 @@ Array [
                   >
                     <span
                       class="ant-upload ant-upload-disabled"
-                      role="button"
                     >
                       <input
                         accept=""
@@ -5192,7 +5191,10 @@ Array [
                         style="display: none;"
                         type="file"
                       />
-                      <div>
+                      <button
+                        style="border: 0px; background: none;"
+                        type="button"
+                      >
                         <span
                           aria-label="plus"
                           class="anticon anticon-plus"
@@ -5220,7 +5222,7 @@ Array [
                         >
                           Upload
                         </div>
-                      </div>
+                      </button>
                     </span>
                   </div>
                 </div>
@@ -21115,8 +21117,6 @@ exports[`renders components/form/demo/validate-other.tsx extend context correctl
               >
                 <span
                   class="ant-upload"
-                  role="button"
-                  tabindex="0"
                 >
                   <input
                     accept=""

components/form/__tests__/__snapshots__/demo.test.tsx.snap

@@ -2718,7 +2718,6 @@ Array [
                   >
                     <span
                       class="ant-upload ant-upload-disabled"
-                      role="button"
                     >
                       <input
                         accept=""
@@ -2726,7 +2725,10 @@ Array [
                         style="display:none"
                         type="file"
                       />
-                      <div>
+                      <button
+                        style="border:0;background:none"
+                        type="button"
+                      >
                         <span
                           aria-label="plus"
                           class="anticon anticon-plus"
@@ -2754,7 +2756,7 @@ Array [
                         >
                           Upload
                         </div>
-                      </div>
+                      </button>
                     </span>
                   </div>
                 </div>
@@ -9675,8 +9677,6 @@ exports[`renders components/form/demo/validate-other.tsx correctly 1`] = `
               >
                 <span
                   class="ant-upload"
-                  role="button"
-                  tabindex="0"
                 >
                   <input
                     accept=""

components/form/__tests__/__snapshots__/index.test.tsx.snap

@@ -933,7 +933,6 @@ exports[`Form form should support disabled 1`] = `
               >
                 <span
                   class="ant-upload ant-upload-disabled"
-                  role="button"
                 >
                   <input
                     accept=""

components/form/demo/disabled.tsx

@@ -102,10 +102,10 @@ const FormDisabledDemo: React.FC = () => {
         </Form.Item>
         <Form.Item label="Upload" valuePropName="fileList" getValueFromEvent={normFile}>
           <Upload action="/upload.do" listType="picture-card">
-            <div>
+            <button style={{ border: 0, background: 'none' }} type="button">
               <PlusOutlined />
               <div style={{ marginTop: 8 }}>Upload</div>
-            </div>
+            </button>
           </Upload>
         </Form.Item>
         <Form.Item label="Button">

components/space/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -177,8 +177,6 @@ exports[`renders components/space/demo/base.tsx extend context correctly 1`] = `
       >
         <span
           class="ant-upload"
-          role="button"
-          tabindex="0"
         >
           <input
             accept=""

components/space/__tests__/__snapshots__/demo.test.tsx.snap

@@ -175,8 +175,6 @@ exports[`renders components/space/demo/base.tsx correctly 1`] = `
       >
         <span
           class="ant-upload"
-          role="button"
-          tabindex="0"
         >
           <input
             accept=""

components/upload/Dragger.tsx

@@ -6,8 +6,14 @@ import type { UploadProps } from './interface';
 export type DraggerProps = UploadProps & { height?: number };
 
 const Dragger = React.forwardRef<UploadRef, DraggerProps>(
-  ({ style, height, ...restProps }, ref) => (
-    <Upload ref={ref} {...restProps} type="drag" style={{ ...style, height }} />
+  ({ style, height, hasControlInside = false, ...restProps }, ref) => (
+    <Upload
+      ref={ref}
+      hasControlInside={hasControlInside}
+      {...restProps}
+      type="drag"
+      style={{ ...style, height }}
+    />
   ),
 );
 

components/upload/Upload.tsx

@@ -60,6 +60,7 @@ const InternalUpload: React.ForwardRefRenderFunction<UploadRef, UploadProps> = (
     maxCount,
     data = {},
     multiple = false,
+    hasControlInside = true,
     action = '',
     accept = '',
     supportServerRender = true,
@@ -350,6 +351,7 @@ const InternalUpload: React.ForwardRefRenderFunction<UploadRef, UploadProps> = (
     disabled: mergedDisabled,
     beforeUpload: mergedBeforeUpload,
     onChange: undefined,
+    hasControlInside,
   } as RcUploadProps;
 
   delete rcUploadProps.className;

components/upload/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -10,15 +10,16 @@ Array [
     >
       <span
         class="ant-upload"
-        role="button"
-        tabindex="0"
       >
         <input
           accept=""
           style="display: none;"
           type="file"
         />
-        <div>
+        <button
+          style="border: 0px; background: none;"
+          type="button"
+        >
           <span
             aria-label="plus"
             class="anticon anticon-plus"
@@ -46,7 +47,7 @@ Array [
           >
             Upload
           </div>
-        </div>
+        </button>
       </span>
     </div>
   </span>,
@@ -58,15 +59,16 @@ Array [
     >
       <span
         class="ant-upload"
-        role="button"
-        tabindex="0"
       >
         <input
           accept=""
           style="display: none;"
           type="file"
         />
-        <div>
+        <button
+          style="border: 0px; background: none;"
+          type="button"
+        >
           <span
             aria-label="plus"
             class="anticon anticon-plus"
@@ -94,7 +96,7 @@ Array [
           >
             Upload
           </div>
-        </div>
+        </button>
       </span>
     </div>
   </span>,
@@ -112,8 +114,6 @@ exports[`renders components/upload/demo/basic.tsx extend context correctly 1`] =
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -170,8 +170,6 @@ exports[`renders components/upload/demo/component-token.tsx extend context corre
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -470,8 +468,6 @@ exports[`renders components/upload/demo/customize-progress-bar.tsx extend contex
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -534,7 +530,6 @@ exports[`renders components/upload/demo/debug-disabled.tsx extend context correc
       >
         <span
           class="ant-upload ant-upload-disabled"
-          role="button"
         >
           <input
             accept=""
@@ -561,7 +556,6 @@ exports[`renders components/upload/demo/debug-disabled.tsx extend context correc
       >
         <span
           class="ant-upload ant-upload-disabled"
-          role="button"
         >
           <input
             accept=""
@@ -837,7 +831,6 @@ exports[`renders components/upload/demo/debug-disabled.tsx extend context correc
         >
           <span
             class="ant-upload ant-upload-disabled"
-            role="button"
           >
             <input
               accept=""
@@ -845,7 +838,10 @@ exports[`renders components/upload/demo/debug-disabled.tsx extend context correc
               style="display: none;"
               type="file"
             />
-            <div>
+            <button
+              style="border: 0px; background: none;"
+              type="button"
+            >
               <span
                 aria-label="plus"
                 class="anticon anticon-plus"
@@ -873,7 +869,7 @@ exports[`renders components/upload/demo/debug-disabled.tsx extend context correc
               >
                 Upload
               </div>
-            </div>
+            </button>
           </span>
         </div>
       </div>
@@ -1109,7 +1105,6 @@ exports[`renders components/upload/demo/debug-disabled.tsx extend context correc
         >
           <span
             class="ant-upload ant-upload-disabled"
-            role="button"
           >
             <input
               accept=""
@@ -1117,7 +1112,10 @@ exports[`renders components/upload/demo/debug-disabled.tsx extend context correc
               style="display: none;"
               type="file"
             />
-            <div>
+            <button
+              style="border: 0px; background: none;"
+              type="button"
+            >
               <span
                 aria-label="plus"
                 class="anticon anticon-plus"
@@ -1145,7 +1143,7 @@ exports[`renders components/upload/demo/debug-disabled.tsx extend context correc
               >
                 Upload
               </div>
-            </div>
+            </button>
           </span>
         </div>
       </div>
@@ -1228,8 +1226,6 @@ exports[`renders components/upload/demo/defaultFileList.tsx extend context corre
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -1528,8 +1524,6 @@ exports[`renders components/upload/demo/directory.tsx extend context correctly 1
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -1654,8 +1648,6 @@ Array [
     >
       <span
         class="ant-upload"
-        role="button"
-        tabindex="0"
       >
         <input
           accept=""
@@ -2713,15 +2705,16 @@ exports[`renders components/upload/demo/file-type.tsx extend context correctly 1
     >
       <span
         class="ant-upload"
-        role="button"
-        tabindex="0"
       >
         <input
           accept=""
           style="display: none;"
           type="file"
         />
-        <div>
+        <button
+          style="border: 0px; background: none;"
+          type="button"
+        >
           <span
             aria-label="plus"
             class="anticon anticon-plus"
@@ -2749,7 +2742,7 @@ exports[`renders components/upload/demo/file-type.tsx extend context correctly 1
           >
             Upload
           </div>
-        </div>
+        </button>
       </span>
     </div>
   </div>
@@ -2767,8 +2760,6 @@ exports[`renders components/upload/demo/fileList.tsx extend context correctly 1`
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -2908,8 +2899,6 @@ exports[`renders components/upload/demo/max-count.tsx extend context correctly 1
       >
         <span
           class="ant-upload"
-          role="button"
-          tabindex="0"
         >
           <input
             accept=""
@@ -2965,8 +2954,6 @@ exports[`renders components/upload/demo/max-count.tsx extend context correctly 1
       >
         <span
           class="ant-upload"
-          role="button"
-          tabindex="0"
         >
           <input
             accept=""
@@ -3514,15 +3501,16 @@ exports[`renders components/upload/demo/picture-card.tsx extend context correctl
     >
       <span
         class="ant-upload"
-        role="button"
-        tabindex="0"
       >
         <input
           accept=""
           style="display: none;"
           type="file"
         />
-        <div>
+        <button
+          style="border: 0px; background: none;"
+          type="button"
+        >
           <span
             aria-label="plus"
             class="anticon anticon-plus"
@@ -3550,7 +3538,7 @@ exports[`renders components/upload/demo/picture-card.tsx extend context correctl
           >
             Upload
           </div>
-        </div>
+        </button>
       </span>
     </div>
   </div>
@@ -3789,15 +3777,16 @@ exports[`renders components/upload/demo/picture-circle.tsx extend context correc
     >
       <span
         class="ant-upload"
-        role="button"
-        tabindex="0"
       >
         <input
           accept=""
           style="display: none;"
           type="file"
         />
-        <div>
+        <button
+          style="border: 0px; background: none;"
+          type="button"
+        >
           <span
             aria-label="plus"
             class="anticon anticon-plus"
@@ -3825,7 +3814,7 @@ exports[`renders components/upload/demo/picture-circle.tsx extend context correc
           >
             Upload
           </div>
-        </div>
+        </button>
       </span>
     </div>
   </div>
@@ -3844,8 +3833,6 @@ Array [
     >
       <span
         class="ant-upload"
-        role="button"
-        tabindex="0"
       >
         <input
           accept=""
@@ -4141,8 +4128,6 @@ Array [
     >
       <span
         class="ant-upload"
-        role="button"
-        tabindex="0"
       >
         <input
           accept=""
@@ -4442,8 +4427,6 @@ exports[`renders components/upload/demo/preview-file.tsx extend context correctl
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -4500,8 +4483,6 @@ exports[`renders components/upload/demo/transform-file.tsx extend context correc
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -4558,8 +4539,6 @@ exports[`renders components/upload/demo/upload-custom-action-icon.tsx extend con
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -4877,8 +4856,6 @@ Array [
     >
       <span
         class="ant-upload"
-        role="button"
-        tabindex="0"
       >
         <input
           accept=""
@@ -4946,8 +4923,6 @@ exports[`renders components/upload/demo/upload-png-only.tsx extend context corre
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -5033,8 +5008,6 @@ exports[`renders components/upload/demo/upload-with-aliyun-oss.tsx extend contex
               >
                 <span
                   class="ant-upload"
-                  role="button"
-                  tabindex="0"
                 >
                   <input
                     accept=""

components/upload/__tests__/__snapshots__/demo.test.ts.snap

@@ -10,15 +10,16 @@ Array [
     >
       <span
         class="ant-upload"
-        role="button"
-        tabindex="0"
       >
         <input
           accept=""
           style="display:none"
           type="file"
         />
-        <div>
+        <button
+          style="border:0;background:none"
+          type="button"
+        >
           <span
             aria-label="plus"
             class="anticon anticon-plus"
@@ -46,7 +47,7 @@ Array [
           >
             Upload
           </div>
-        </div>
+        </button>
       </span>
     </div>
   </span>,
@@ -58,15 +59,16 @@ Array [
     >
       <span
         class="ant-upload"
-        role="button"
-        tabindex="0"
       >
         <input
           accept=""
           style="display:none"
           type="file"
         />
-        <div>
+        <button
+          style="border:0;background:none"
+          type="button"
+        >
           <span
             aria-label="plus"
             class="anticon anticon-plus"
@@ -94,7 +96,7 @@ Array [
           >
             Upload
           </div>
-        </div>
+        </button>
       </span>
     </div>
   </span>,
@@ -110,8 +112,6 @@ exports[`renders components/upload/demo/basic.tsx correctly 1`] = `
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -166,8 +166,6 @@ exports[`renders components/upload/demo/component-token.tsx correctly 1`] = `
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -445,8 +443,6 @@ exports[`renders components/upload/demo/customize-progress-bar.tsx correctly 1`]
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -507,7 +503,6 @@ exports[`renders components/upload/demo/debug-disabled.tsx correctly 1`] = `
       >
         <span
           class="ant-upload ant-upload-disabled"
-          role="button"
         >
           <input
             accept=""
@@ -534,7 +529,6 @@ exports[`renders components/upload/demo/debug-disabled.tsx correctly 1`] = `
       >
         <span
           class="ant-upload ant-upload-disabled"
-          role="button"
         >
           <input
             accept=""
@@ -791,7 +785,6 @@ exports[`renders components/upload/demo/debug-disabled.tsx correctly 1`] = `
         >
           <span
             class="ant-upload ant-upload-disabled"
-            role="button"
           >
             <input
               accept=""
@@ -799,7 +792,10 @@ exports[`renders components/upload/demo/debug-disabled.tsx correctly 1`] = `
               style="display:none"
               type="file"
             />
-            <div>
+            <button
+              style="border:0;background:none"
+              type="button"
+            >
               <span
                 aria-label="plus"
                 class="anticon anticon-plus"
@@ -827,7 +823,7 @@ exports[`renders components/upload/demo/debug-disabled.tsx correctly 1`] = `
               >
                 Upload
               </div>
-            </div>
+            </button>
           </span>
         </div>
       </div>
@@ -1044,7 +1040,6 @@ exports[`renders components/upload/demo/debug-disabled.tsx correctly 1`] = `
         >
           <span
             class="ant-upload ant-upload-disabled"
-            role="button"
           >
             <input
               accept=""
@@ -1052,7 +1047,10 @@ exports[`renders components/upload/demo/debug-disabled.tsx correctly 1`] = `
               style="display:none"
               type="file"
             />
-            <div>
+            <button
+              style="border:0;background:none"
+              type="button"
+            >
               <span
                 aria-label="plus"
                 class="anticon anticon-plus"
@@ -1080,7 +1078,7 @@ exports[`renders components/upload/demo/debug-disabled.tsx correctly 1`] = `
               >
                 Upload
               </div>
-            </div>
+            </button>
           </span>
         </div>
       </div>
@@ -1161,8 +1159,6 @@ exports[`renders components/upload/demo/defaultFileList.tsx correctly 1`] = `
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -1440,8 +1436,6 @@ exports[`renders components/upload/demo/directory.tsx correctly 1`] = `
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -1561,8 +1555,6 @@ exports[`renders components/upload/demo/drag-sorting.tsx correctly 1`] = `
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -2526,15 +2518,16 @@ exports[`renders components/upload/demo/file-type.tsx correctly 1`] = `
     >
       <span
         class="ant-upload"
-        role="button"
-        tabindex="0"
       >
         <input
           accept=""
           style="display:none"
           type="file"
         />
-        <div>
+        <button
+          style="border:0;background:none"
+          type="button"
+        >
           <span
             aria-label="plus"
             class="anticon anticon-plus"
@@ -2562,7 +2555,7 @@ exports[`renders components/upload/demo/file-type.tsx correctly 1`] = `
           >
             Upload
           </div>
-        </div>
+        </button>
       </span>
     </div>
   </div>
@@ -2578,8 +2571,6 @@ exports[`renders components/upload/demo/fileList.tsx correctly 1`] = `
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -2717,8 +2708,6 @@ exports[`renders components/upload/demo/max-count.tsx correctly 1`] = `
       >
         <span
           class="ant-upload"
-          role="button"
-          tabindex="0"
         >
           <input
             accept=""
@@ -2774,8 +2763,6 @@ exports[`renders components/upload/demo/max-count.tsx correctly 1`] = `
       >
         <span
           class="ant-upload"
-          role="button"
-          tabindex="0"
         >
           <input
             accept=""
@@ -3302,15 +3289,16 @@ exports[`renders components/upload/demo/picture-card.tsx correctly 1`] = `
     >
       <span
         class="ant-upload"
-        role="button"
-        tabindex="0"
       >
         <input
           accept=""
           style="display:none"
           type="file"
         />
-        <div>
+        <button
+          style="border:0;background:none"
+          type="button"
+        >
           <span
             aria-label="plus"
             class="anticon anticon-plus"
@@ -3338,7 +3326,7 @@ exports[`renders components/upload/demo/picture-card.tsx correctly 1`] = `
           >
             Upload
           </div>
-        </div>
+        </button>
       </span>
     </div>
   </div>
@@ -3556,15 +3544,16 @@ exports[`renders components/upload/demo/picture-circle.tsx correctly 1`] = `
     >
       <span
         class="ant-upload"
-        role="button"
-        tabindex="0"
       >
         <input
           accept=""
           style="display:none"
           type="file"
         />
-        <div>
+        <button
+          style="border:0;background:none"
+          type="button"
+        >
           <span
             aria-label="plus"
             class="anticon anticon-plus"
@@ -3592,7 +3581,7 @@ exports[`renders components/upload/demo/picture-circle.tsx correctly 1`] = `
           >
             Upload
           </div>
-        </div>
+        </button>
       </span>
     </div>
   </div>
@@ -3609,8 +3598,6 @@ Array [
     >
       <span
         class="ant-upload"
-        role="button"
-        tabindex="0"
       >
         <input
           accept=""
@@ -3887,8 +3874,6 @@ Array [
     >
       <span
         class="ant-upload"
-        role="button"
-        tabindex="0"
       >
         <input
           accept=""
@@ -4167,8 +4152,6 @@ exports[`renders components/upload/demo/preview-file.tsx correctly 1`] = `
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -4223,8 +4206,6 @@ exports[`renders components/upload/demo/transform-file.tsx correctly 1`] = `
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -4279,8 +4260,6 @@ exports[`renders components/upload/demo/upload-custom-action-icon.tsx correctly
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -4577,8 +4556,6 @@ Array [
     >
       <span
         class="ant-upload"
-        role="button"
-        tabindex="0"
       >
         <input
           accept=""
@@ -4644,8 +4621,6 @@ exports[`renders components/upload/demo/upload-png-only.tsx correctly 1`] = `
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -4729,8 +4704,6 @@ exports[`renders components/upload/demo/upload-with-aliyun-oss.tsx correctly 1`]
               >
                 <span
                   class="ant-upload"
-                  role="button"
-                  tabindex="0"
                 >
                   <input
                     accept=""

components/upload/__tests__/__snapshots__/upload.test.tsx.snap

@@ -10,8 +10,6 @@ exports[`Upload rtl render component should be rendered correctly in RTL directi
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""

components/upload/__tests__/__snapshots__/uploadlist.test.tsx.snap

@@ -9,8 +9,6 @@ exports[`Upload List handle error 1`] = `
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -171,8 +169,6 @@ exports[`Upload List should be uploading when upload a file 1`] = `
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -274,8 +270,6 @@ exports[`Upload List should non-image format file preview 1`] = `
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -992,8 +986,6 @@ exports[`Upload List should support removeIcon and downloadIcon 1`] = `
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -1139,8 +1131,6 @@ exports[`Upload List should support removeIcon and downloadIcon 2`] = `
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""
@@ -1286,8 +1276,6 @@ exports[`Upload List should support showRemoveIcon and showPreviewIcon 1`] = `
   >
     <span
       class="ant-upload"
-      role="button"
-      tabindex="0"
     >
       <input
         accept=""

components/upload/demo/avatar.tsx

@@ -41,10 +41,10 @@ const App: React.FC = () => {
   };
 
   const uploadButton = (
-    <div>
+    <button style={{ border: 0, background: 'none' }} type="button">
       {loading ? <LoadingOutlined /> : <PlusOutlined />}
       <div style={{ marginTop: 8 }}>Upload</div>
-    </div>
+    </button>
   );
 
   return (

components/upload/demo/debug-disabled.tsx

@@ -34,10 +34,10 @@ const fileList: UploadFile[] = [
 
 const App: React.FC = () => {
   const uploadButton = (
-    <div>
+    <button style={{ border: 0, background: 'none' }} type="button">
       <PlusOutlined />
       <div style={{ marginTop: 8 }}>Upload</div>
-    </div>
+    </button>
   );
 
   return (

components/upload/demo/file-type.tsx

@@ -93,10 +93,10 @@ const App: React.FC = () => {
   };
 
   const uploadButton = (
-    <div>
+    <button style={{ border: 0, background: 'none' }} type="button">
       <PlusOutlined />
       <div style={{ marginTop: 8 }}>Upload</div>
-    </div>
+    </button>
   );
 
   return (

components/upload/demo/picture-card.tsx

@@ -71,10 +71,10 @@ const App: React.FC = () => {
     setFileList(newFileList);
 
   const uploadButton = (
-    <div>
+    <button style={{ border: 0, background: 'none' }} type="button">
       <PlusOutlined />
       <div style={{ marginTop: 8 }}>Upload</div>
-    </div>
+    </button>
   );
   return (
     <>

components/upload/demo/picture-circle.tsx

@@ -53,10 +53,10 @@ const App: React.FC = () => {
     setFileList(newFileList);
 
   const uploadButton = (
-    <div>
+    <button style={{ border: 0, background: 'none' }} type="button">
       <PlusOutlined />
       <div style={{ marginTop: 8 }}>Upload</div>
-    </div>
+    </button>
   );
   return (
     <>

components/upload/interface.ts

@@ -87,7 +87,7 @@ type TransformFileHandler = (
 ) => string | Blob | File | PromiseLike<string | Blob | File>;
 type BeforeUploadValueType = void | boolean | string | Blob | File;
 
-export interface UploadProps<T = any> extends Pick<RcUploadProps, 'capture'> {
+export interface UploadProps<T = any> extends Pick<RcUploadProps, 'capture' | 'hasControlInside'> {
   type?: UploadType;
   name?: string;
   defaultFileList?: Array<UploadFile<T>>;

components/upload/style/dragger.ts

@@ -23,10 +23,14 @@ const genDraggerStyle: GenerateStyle<UploadToken> = (token) => {
         },
 
         [`${componentCls}-btn`]: {
-          display: 'table',
-          width: '100%',
-          height: '100%',
+          display: 'flex',
+          placeContent: 'center',
           outline: 'none',
+          borderRadius: token.borderRadiusLG,
+
+          '&:focus': {
+            outline: `${unit(token.lineWidthFocus)} solid ${token.colorPrimaryBorder}`,
+          },
         },
 
         [`${componentCls}-drag-container`]: {

package.json

@@ -157,7 +157,7 @@
     "rc-tooltip": "~6.1.3",
     "rc-tree": "~5.8.2",
     "rc-tree-select": "~5.15.0",
-    "rc-upload": "~4.3.6",
+    "rc-upload": "~4.5.2",
     "rc-util": "^5.38.1",
     "scroll-into-view-if-needed": "^3.1.0",
     "throttle-debounce": "^5.0.0"