Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -83,7 +83,7 @@ React.render(<Upload />, container);
|beforeUpload| function |null| before upload check, return false or a rejected Promise will stop upload, only for modern browsers|
|customRequest | function | null | provide an override for the default xhr behavior for additional customization|
|withCredentials | boolean | false | ajax upload with cookie send |
|openFileDialogOnClick | boolean | true | useful for drag only upload as it does not trigger on enter key or click event |
|openFileDialogOnClick | boolean/function():boolean | true | useful for drag only upload as it does not trigger on enter key or click event |
|pastable | boolean | false | support paste upload |

#### onError arguments
Expand Down
9 changes: 7 additions & 2 deletions src/AjaxUploader.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -305,6 +305,11 @@
this.fileInput = node;
};

eventHandler = (fn: (() => boolean) | boolean, originFn: (e: React.MouseEvent<HTMLDivElement> | React.KeyboardEvent<HTMLDivElement>) => void, e: React.MouseEvent<HTMLDivElement> | React.KeyboardEvent<HTMLDivElement>) => {
if (typeof fn === 'function' ? fn() : fn) {
originFn(e);
}
};
render() {
const {
component: Tag,
Expand Down Expand Up @@ -339,8 +344,8 @@
const events = disabled
? {}
: {
onClick: openFileDialogOnClick ? this.onClick : () => {},
onKeyDown: openFileDialogOnClick ? this.onKeyDown : () => {},
onClick: (e) => this.eventHandler(openFileDialogOnClick, this.onClick, e),
onKeyDown: (e) => this.eventHandler(openFileDialogOnClick, this.onKeyDown, e),

Check warning on line 348 in src/AjaxUploader.tsx

View check run for this annotation

Codecov / codecov/patch

src/AjaxUploader.tsx#L348

Added line #L348 was not covered by tests
onMouseEnter,
onMouseLeave,
onDrop: this.onFileDrop,
Expand Down
2 changes: 1 addition & 1 deletion src/interface.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ export interface UploadProps
) => BeforeUploadFileType | Promise<void | BeforeUploadFileType> | void;
customRequest?: (option: UploadRequestOption) => void | { abort: () => void };
withCredentials?: boolean;
openFileDialogOnClick?: boolean;
openFileDialogOnClick?: boolean | (() => boolean);
prefixCls?: string;
id?: string;
onMouseEnter?: (e: React.MouseEvent<HTMLDivElement>) => void;
Expand Down
47 changes: 47 additions & 0 deletions tests/uploader.spec.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -1187,6 +1187,53 @@ describe('uploader', () => {
});
});

describe('openFileDialogOnClick', () => {
it('should block click when set to false', () => {
const onClick = jest.fn();
const { container } = render(<Upload openFileDialogOnClick={false} onClick={onClick} />);
fireEvent.click(container.querySelector('.rc-upload')!);
expect(onClick).not.toHaveBeenCalled();
});

it('should allow click when set to true', () => {
const onClick = jest.fn();
const { container } = render(<Upload openFileDialogOnClick={true} onClick={onClick} />);
fireEvent.click(container.querySelector('.rc-upload')!);
expect(onClick).toHaveBeenCalled();
});

it('should block click when function returns false', () => {
const onClick = jest.fn();
const { container } = render(<Upload openFileDialogOnClick={() => false} onClick={onClick} />);
fireEvent.click(container.querySelector('.rc-upload')!);
expect(onClick).not.toHaveBeenCalled();
});

it('should allow click when function returns true', () => {
const onClick = jest.fn();
const { container } = render(<Upload openFileDialogOnClick={() => true} onClick={onClick} />);
fireEvent.click(container.querySelector('.rc-upload')!);
expect(onClick).toHaveBeenCalled();
});

it('should support dynamic function return value', () => {
let shouldOpen = false;
const onClick = jest.fn();
const { container, rerender } = render(<Upload openFileDialogOnClick={() => shouldOpen} onClick={onClick} />);

// first click (shouldOpen = false)
fireEvent.click(container.querySelector('.rc-upload')!);
expect(onClick).not.toHaveBeenCalled();

shouldOpen = true;
rerender(<Upload openFileDialogOnClick={() => shouldOpen} onClick={onClick} />);

// second click (shouldOpen = true)
fireEvent.click(container.querySelector('.rc-upload')!);
expect(onClick).toHaveBeenCalled();
});
});

it('dynamic change action in beforeUpload should work', async () => {
const Test = () => {
const [action, setAction] = React.useState('light');
Expand Down