mirror of
https://github.com/ant-design/ant-design.git
synced 2024-11-24 11:10:01 +08:00
Fix checking if file is image or not in the UploadList (#15412)
* Fix checking if file is image or not in the UploadList * Fix type * Add correct checking if file is image or not * Change startWith to indexOf, update test * Increase delay in test to pass CI * Update test
This commit is contained in:
parent
554fdd4a3c
commit
357e79cf48
@ -34,7 +34,7 @@ class Upload extends React.Component<UploadProps, UploadState> {
|
||||
accept: '',
|
||||
beforeUpload: T,
|
||||
showUploadList: true,
|
||||
listType: 'text' as UploadListType, // or pictrue
|
||||
listType: 'text' as UploadListType, // or picture
|
||||
className: '',
|
||||
disabled: false,
|
||||
supportServerRender: true,
|
||||
|
@ -7,7 +7,6 @@ import Tooltip from '../tooltip';
|
||||
import Progress from '../progress';
|
||||
import { ConfigConsumer, ConfigConsumerProps } from '../config-provider';
|
||||
|
||||
const imageTypes: string[] = ['image', 'webp', 'png', 'svg', 'gif', 'jpg', 'jpeg', 'bmp', 'dpg'];
|
||||
const extname = (url: string) => {
|
||||
if (!url) {
|
||||
return '';
|
||||
@ -17,8 +16,9 @@ const extname = (url: string) => {
|
||||
const filenameWithoutSuffix = filename.split(/#|\?/)[0];
|
||||
return (/\.[^./\\]*$/.exec(filenameWithoutSuffix) || [''])[0];
|
||||
};
|
||||
const isImageFileType = (type: string): boolean => !!type && type.indexOf('image/') === 0;
|
||||
const isImageUrl = (file: UploadFile): boolean => {
|
||||
if (imageTypes.includes(file.type)) {
|
||||
if (isImageFileType(file.type)) {
|
||||
return true;
|
||||
}
|
||||
const url: string = (file.thumbUrl || file.url) as string;
|
||||
@ -64,8 +64,8 @@ export default class UploadList extends React.Component<UploadListProps, any> {
|
||||
|
||||
// https://developer.mozilla.org/en-US/docs/Web/API/FileReader/readAsDataURL
|
||||
previewFile = (file: File | Blob, callback: Function) => {
|
||||
if (file.type && !imageTypes.includes(file.type)) {
|
||||
callback('');
|
||||
if (!isImageFileType(file.type)) {
|
||||
return callback('');
|
||||
}
|
||||
const reader = new FileReader();
|
||||
reader.onloadend = () => callback(reader.result);
|
||||
|
@ -279,7 +279,7 @@ describe('Upload List', () => {
|
||||
uid: '-12',
|
||||
url:
|
||||
'https://publish-pic-cpu.baidu.com/1296beb3-50d9-4276-885f-52645cbb378e.jpeg@w_228%2ch_152',
|
||||
type: 'image',
|
||||
type: 'image/png',
|
||||
},
|
||||
];
|
||||
|
||||
@ -403,4 +403,34 @@ describe('Upload List', () => {
|
||||
wrapper.find('.ant-upload-list-item-name').simulate('click');
|
||||
expect(onPreview).toBeCalled();
|
||||
});
|
||||
|
||||
it('upload image file should be converted to the base64', done => {
|
||||
const mockFile = new File([''], 'foo.png', {
|
||||
type: 'image/png',
|
||||
});
|
||||
|
||||
const wrapper = mount(
|
||||
<UploadList listType="picture-card" items={fileList} locale={{ uploading: 'uploading' }} />,
|
||||
);
|
||||
const instance = wrapper.instance();
|
||||
const callback = dataUrl => {
|
||||
expect(dataUrl).toEqual('data:image/png;base64,');
|
||||
done();
|
||||
};
|
||||
instance.previewFile(mockFile, callback);
|
||||
});
|
||||
|
||||
it("upload non image file shouldn't be converted to the base64", () => {
|
||||
const mockFile = new File([''], 'foo.7z', {
|
||||
type: 'application/x-7z-compressed',
|
||||
});
|
||||
|
||||
const wrapper = mount(
|
||||
<UploadList listType="picture-card" items={fileList} locale={{ uploading: 'uploading' }} />,
|
||||
);
|
||||
const instance = wrapper.instance();
|
||||
const callback = jest.fn();
|
||||
instance.previewFile(mockFile, callback);
|
||||
expect(callback).toBeCalledWith('');
|
||||
});
|
||||
});
|
||||
|
Loading…
Reference in New Issue
Block a user