fix: upload blob preview && upload beforeUpload doc (#13528)

* fix: upload not preview blob

* fix: test && readme

* fix: upload promise

components/locale-provider/LocaleReceiver.tsx

@@ -8,7 +8,9 @@ export interface LocaleReceiverProps {
   children: (locale: object, localeCode?: string) => React.ReactElement<any>;
 }
 
-interface LocaleInterface { [key: string]: any }
+interface LocaleInterface {
+  [key: string]: any;
+}
 
 export interface LocaleReceiverContext {
   antLocale?: LocaleInterface;
@@ -27,7 +29,8 @@ export default class LocaleReceiver extends React.Component<LocaleReceiverProps>
 
   getLocale() {
     const { componentName, defaultLocale } = this.props;
-    const locale: object | Function = defaultLocale || (defaultLocaleData as LocaleInterface)[componentName || 'global'];
+    const locale: object | Function =
+      defaultLocale || (defaultLocaleData as LocaleInterface)[componentName || 'global'];
     const { antLocale } = this.context;
     const localeFromContext = componentName && antLocale ? antLocale[componentName] : {};
     return {

components/pagination/Pagination.tsx

@@ -100,10 +100,6 @@ export default class Pagination extends React.Component<PaginationProps, {}> {
   };
 
   render() {
-    return (
-      <LocaleReceiver componentName="Pagination">
-        {this.renderPagination}
-      </LocaleReceiver>
-    );
+    return <LocaleReceiver componentName="Pagination">{this.renderPagination}</LocaleReceiver>;
   }
 }

components/upload/UploadList.tsx

@@ -8,7 +8,7 @@ import { UploadListProps, UploadFile, UploadListType } from './interface';
 
 const imageTypes: string[] = ['image', 'webp', 'png', 'svg', 'gif', 'jpg', 'jpeg', 'bmp'];
 // https://developer.mozilla.org/en-US/docs/Web/API/FileReader/readAsDataURL
-const previewFile = (file: File, callback: Function) => {
+const previewFile = (file: File | Blob, callback: Function) => {
   if (file.type && !imageTypes.includes(file.type)) {
     callback('');
   }

components/upload/__tests__/upload.test.js

@@ -56,6 +56,41 @@ describe('Upload', () => {
     });
   });
 
+  it('upload promise return file in beforeUpload', done => {
+    const data = jest.fn();
+    const props = {
+      action: 'http://upload.com',
+      beforeUpload: file =>
+        new Promise(resolve =>
+          setTimeout(() => {
+            const result = file;
+            result.name = 'test.png';
+            resolve(result);
+          }, 100),
+        ),
+      data,
+      onChange: ({ file }) => {
+        if (file.status !== 'uploading') {
+          expect(data).toBeCalled();
+          expect(file.name).toEqual('test.png');
+          done();
+        }
+      },
+    };
+
+    const wrapper = mount(
+      <Upload {...props}>
+        <button type="button">upload</button>
+      </Upload>,
+    );
+
+    wrapper.find('input').simulate('change', {
+      target: {
+        files: [{ file: 'foo.png' }],
+      },
+    });
+  });
+
   it('should not stop upload when return value of beforeUpload is false', done => {
     const fileList = [
       {

components/upload/index.zh-CN.md

@@ -24,7 +24,7 @@ title: Upload
 | accept | 接受上传的文件类型, 详见 [input accept Attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attr-accept) | string | 无 |
 | action | 上传的地址 | string\|(file) => `Promise` | 无 |
 | directory | 支持上传文件夹（[caniuse](https://caniuse.com/#feat=input-file-directory)）| boolean | false |
-| beforeUpload | 上传文件之前的钩子，参数为上传的文件，若返回 `false` 则停止上传。支持返回一个 Promise 对象，Promise 对象 reject 时则停止上传，resolve 时开始上传。**注意：IE9 不支持该方法**。 | (file, fileList) => `boolean | Promise` | 无 |
+| beforeUpload | 上传文件之前的钩子，参数为上传的文件，若返回 `false` 则停止上传。支持返回一个 Promise 对象，Promise 对象 reject 时则停止上传，resolve 时开始上传（ resolve 传入 `File` 或 `Blob` 对象则上传 resolve 传入对象）。**注意：IE9 不支持该方法**。 | (file, fileList) => `boolean | Promise` | 无 |
 | customRequest | 通过覆盖默认的上传行为，可以自定义自己的上传实现 | Function | 无 |
 | data | 上传所需参数或返回上传参数的方法 | object\|(file) => object | 无 |
 | defaultFileList | 默认已经上传的文件列表 | object\[] | 无 |