fix: Upload preview should work with Blob (#17392)

* fix: Upload preview should work with Blob

* rm only
This commit is contained in:
zombieJ 2019-07-01 17:52:37 +08:00 committed by GitHub
parent d87bff6203
commit b5143df1a4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 33 additions and 23 deletions

View File

@ -42,19 +42,22 @@ export default class UploadList extends React.Component<UploadListProps, any> {
return;
}
(items || []).forEach(file => {
const isValidateFile =
file.originFileObj instanceof File || file.originFileObj instanceof Blob;
if (
typeof document === 'undefined' ||
typeof window === 'undefined' ||
!(window as any).FileReader ||
!(window as any).File ||
!(file.originFileObj instanceof File) ||
!isValidateFile ||
file.thumbUrl !== undefined
) {
return;
}
file.thumbUrl = '';
if (previewFile) {
previewFile(file.originFileObj).then((previewDataUrl: string) => {
previewFile(file.originFileObj as File).then((previewDataUrl: string) => {
// Need append '' to avoid dead loop
file.thumbUrl = previewDataUrl || '';
this.forceUpdate();

View File

@ -506,28 +506,35 @@ describe('Upload List', () => {
});
});
it('customize previewFile support', async () => {
const mockThumbnail = 'mock-image';
const previewFile = jest.fn(() => {
return Promise.resolve(mockThumbnail);
});
const file = {
...fileList[0],
originFileObj: new File([], 'xxx.png'),
};
delete file.thumbUrl;
describe('customize previewFile support', () => {
function test(name, renderInstance) {
it(name, async () => {
const mockThumbnail = 'mock-image';
const previewFile = jest.fn(() => {
return Promise.resolve(mockThumbnail);
});
const file = {
...fileList[0],
originFileObj: renderInstance(),
};
delete file.thumbUrl;
const wrapper = mount(
<Upload listType="picture" defaultFileList={[file]} previewFile={previewFile}>
<button type="button" />
</Upload>,
);
wrapper.setState({});
await delay(0);
const wrapper = mount(
<Upload listType="picture" defaultFileList={[file]} previewFile={previewFile}>
<button type="button" />
</Upload>,
);
wrapper.setState({});
await delay(0);
expect(previewFile).toHaveBeenCalledWith(file.originFileObj);
wrapper.update();
expect(previewFile).toHaveBeenCalledWith(file.originFileObj);
wrapper.update();
expect(wrapper.find('.ant-upload-list-item-thumbnail img').prop('src')).toBe(mockThumbnail);
expect(wrapper.find('.ant-upload-list-item-thumbnail img').prop('src')).toBe(mockThumbnail);
});
}
test('File', () => new File([], 'xxx.png'));
test('Blob', () => new Blob());
});
});

View File

@ -23,7 +23,7 @@ export interface UploadFile {
status?: UploadFileStatus;
percent?: number;
thumbUrl?: string;
originFileObj?: File;
originFileObj?: File | Blob;
response?: any;
error?: any;
linkProps?: any;