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:
Aleksandr Chernokondratenko 2019-03-18 04:47:17 +02:00 committed by 偏右
parent 554fdd4a3c
commit 357e79cf48
3 changed files with 36 additions and 6 deletions

View File

@ -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,

View File

@ -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);

View File

@ -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('');
});
});