fix: action should delay fetch after beforeUpload done

Author: zombieJ

src/AjaxUploader.tsx

@@ -123,7 +123,7 @@ class AjaxUploader extends Component<UploadProps> {
    * Process file before upload. When all the file is ready, we start upload.
    */
   processFile = async (file: RcFile, fileList: RcFile[]): Promise<ParsedFileInfo> => {
-    const { beforeUpload, action, data } = this.props;
+    const { beforeUpload } = this.props;
 
     let transformedFile: BeforeUploadFileType | void = file;
     if (beforeUpload) {
@@ -143,13 +143,17 @@ class AjaxUploader extends Component<UploadProps> {
       }
     }
 
+    // Get latest action
+    const { action } = this.props;
     let mergedAction: string;
     if (typeof action === 'function') {
       mergedAction = await action(file);
     } else {
       mergedAction = action;
     }
 
+    // Get latest data
+    const { data } = this.props;
     let mergedData: object;
     if (typeof data === 'function') {
       mergedData = await data(file);

tests/uploader.spec.js

@@ -5,6 +5,8 @@ import { mount } from 'enzyme';
 import sinon from 'sinon';
 import Uploader from '../index';
 
+const sleep = (timeout = 500) => new Promise(resolve => setTimeout(resolve, timeout));
+
 function Item(name) {
   this.name = name;
   this.toString = () => this.name;
@@ -466,8 +468,6 @@ describe('uploader', () => {
       }),
     );
 
-    const sleep = (timeout = 500) => new Promise(resolve => setTimeout(resolve, timeout));
-
     async function testWrapper(props) {
       const onBatchStart = jest.fn();
       const wrapper = mount(<Uploader onBatchStart={onBatchStart} {...props} />);
@@ -555,4 +555,36 @@ describe('uploader', () => {
       expect(onBatchStart).toHaveBeenCalledWith(batchEventFiles);
     });
   });
+
+  it('dynamic change action in beforeUpload should work', async () => {
+    const Test = () => {
+      const [action, setAction] = React.useState('light');
+
+      async function beforeUpload() {
+        setAction('bamboo');
+        await sleep(100);
+        return true;
+      }
+
+      return <Uploader beforeUpload={beforeUpload} action={action} />;
+    };
+
+    const wrapper = mount(<Test />);
+    wrapper.find('input').simulate('change', {
+      target: {
+        files: [
+          {
+            name: 'little.png',
+            toString() {
+              return this.name;
+            },
+          },
+        ],
+      },
+    });
+
+    await sleep(200);
+
+    expect(requests[0].url).toEqual('bamboo');
+  });
 });