mirror of
https://gitee.com/ant-design/ant-design.git
synced 2024-12-05 05:28:20 +08:00
afedb4127f
* patch route * use data for promise * rename Article file * Article in TS * clean up * use collect * adjust css * card it * listing * res * hiring * add footer * english it * rm others * fix lint * fix navigation * add dropdown button * Header with TS * split input & logo * navigation out * use flex * flex everything * stretch * hide search when narrow * init category * global rules * more cat * pages * level 2 width * level 3 * level 4 * skip before ready * clean up * unqiue shadow variable * update eslintignore * update ignore * fix ssr * fix location param * replace images * shake more * fix top of navigation * remove home * reorder nav & adjust padding style * narrow res style * Update research-form-page.zh-CN.md (#21426) Co-authored-by: Golevka <huangsamfisher@163.com> * rm skip * narrow merge in * reset p style * update svg * fix lint * update ignore * update lint ignore * Update research-result-page.zh-CN.md (#21432) Co-authored-by: mihaideyu <zxy1010414746@163.com> * Update research-result-page.zh-CN.md * Update research-workbench.zh-CN.md (#21438) Co-authored-by: yingxirz <inseeing@gmail.com> * Update research-workbench.zh-CN.md * Update research-list-page.zh-CN.md (#21441) Co-authored-by: yingxirz <inseeing@gmail.com> * Update research-list-page.zh-CN.md * padding use 40px * add responsive of ref * fix p margin * Update research-workbench.zh-CN.md * Update buttons.md (#21456) Co-authored-by: yingxirz <inseeing@gmail.com> * Update resources.en-US.md (#21457) * Update research-navigation.zh-CN.md (#21453) * Update research-navigation.zh-CN.md * Update research-navigation.zh-CN.md * Update research-navigation.zh-CN.md * Update research-empty.zh-CN.md (#21451) * Update research-empty.zh-CN.md * Update research-empty.zh-CN.md * Update research-empty.zh-CN.md * Update research-empty.zh-CN.md Co-authored-by: 二货机器人 <smith3816@gmail.com> * Update research-exception-page.zh-CN.md (#21452) * Update research-exception-page.zh-CN.md * Update research-exception-page.zh-CN.md * Update research-message-and-feedback.zh-CN.md (#21463) * Update research-message-and-feedback.zh-CN.md (#21467) * Update research-message-and-feedback.zh-CN.md * Update research-message-and-feedback.zh-CN.md * Update research-message-and-feedback.zh-CN.md * Update research-message-and-feedback.zh-CN.md * replace background * fix lines margin * home padding * patch minTilda doc * Update resources.zh-CN.md (#21503) * clean up * Update research-workbench.zh-CN.md (#21512) Co-authored-by: yingxirz <inseeing@gmail.com> * Update research-overview.zh-CN.md (#21513) Co-authored-by: yingxirz <inseeing@gmail.com> * Update research-result-page.zh-CN.md (#21514) Co-authored-by: mihaideyu <zxy1010414746@163.com> * Update research-list-page.zh-CN.md (#21515) Co-authored-by: yingxirz <inseeing@gmail.com> * fix doc * Update research-message-and-feedback.zh-CN.md (#21516) * adjust home nav width * Update research-message-and-feedback.zh-CN.md (#21535) * Update research-form-page.zh-CN.md (#21554) Co-authored-by: Golevka <huangsamfisher@163.com> * patch file * clean up * update shadow.zh-CN update shadow.zh-CN * add shadow table * Update visual.zh-CN.md (#21577) Co-authored-by: shuwenliu0116 <33922479+shuwenliu0116@users.noreply.github.com> * Update docs/spec/shadow.zh-CN.md Co-Authored-By: 偏右 <afc163@gmail.com> * Update docs/spec/shadow.zh-CN.md Co-Authored-By: 偏右 <afc163@gmail.com> * Update docs/spec/shadow.zh-CN.md Co-Authored-By: 偏右 <afc163@gmail.com> * Update docs/spec/shadow.zh-CN.md Co-Authored-By: 偏右 <afc163@gmail.com> * Update docs/spec/shadow.zh-CN.md Co-Authored-By: 偏右 <afc163@gmail.com> * patch docs * fix doc * rm page suffix * fix style * mobile it * Update resources.en-US.md (#21561) * chart res * add qr code * adjust qr * Update visual.zh-CN.md (#21603) Co-authored-by: shuwenliu0116 <33922479+shuwenliu0116@users.noreply.github.com> * fix site qr * mobile height of it * book update * 3.x site link * isMobile is new cnotext * Update research-form.zh-CN.md (#21604) Co-authored-by: Golevka <huangsamfisher@163.com> * adjust form doc * mobile use link * adjust order * flush * fix ts * Update research-navigation.zh-CN.md (#21606) * Update research-navigation.zh-CN.md (#21609) * rm useless lines * add mobile icon * Update research-exception.zh-CN.md (#21612) * Update research-empty.zh-CN.md (#21610) * Update research-workbench.zh-CN.md * Update visual.zh-CN.md * adjust mobile icon * Update research-message-and-feedback.zh-CN.md (#21613) * Update research-list.zh-CN.md (#21617) Co-authored-by: yingxirz <inseeing@gmail.com> * Update research-workbench.zh-CN.md (#21618) Co-authored-by: yingxirz <inseeing@gmail.com> * Update visual.zh-CN.md (#21619) Co-authored-by: shuwenliu0116 <33922479+shuwenliu0116@users.noreply.github.com> * Update research-result.zh-CN.md (#21620) Co-authored-by: mihaideyu <zxy1010414746@163.com> * Update research-form.zh-CN.md (#21615) * Update research-message-and-feedback.zh-CN.md (#21616) * Update research-list.zh-CN.md (#21621) Co-authored-by: yingxirz <inseeing@gmail.com> * Update research-result.zh-CN.md (#21624) Co-authored-by: mihaideyu <zxy1010414746@163.com> * update ref color * update zip file * fix mobile icon * rm skip dark * fix cat * update zip link * update zip link Co-authored-by: Golevka <huangsamfisher@163.com> Co-authored-by: mihaideyu <zxy1010414746@163.com> Co-authored-by: yingxirz <inseeing@gmail.com> Co-authored-by: 偏右 <afc163@gmail.com> Co-authored-by: myeunhyuk <39618466+myeunhyuk@users.noreply.github.com> Co-authored-by: minTilda <31951290+minTilda@users.noreply.github.com> Co-authored-by: ziyuan-174774 <61226089+ziyuan-174774@users.noreply.github.com> Co-authored-by: 竹尔 <54707870+AntDesigners@users.noreply.github.com> Co-authored-by: shuwenliu0116 <33922479+shuwenliu0116@users.noreply.github.com>
516 lines
14 KiB
JavaScript
516 lines
14 KiB
JavaScript
/* eslint-disable react/no-string-refs, react/prefer-es6-class */
|
|
import React from 'react';
|
|
import { mount } from 'enzyme';
|
|
import Upload from '..';
|
|
import Form from '../../form';
|
|
import { T, fileToObject, getFileItem, removeFileItem } from '../utils';
|
|
import { setup, teardown } from './mock';
|
|
import { resetWarned } from '../../_util/warning';
|
|
import mountTest from '../../../tests/shared/mountTest';
|
|
import rtlTest from '../../../tests/shared/rtlTest';
|
|
|
|
describe('Upload', () => {
|
|
mountTest(Upload);
|
|
rtlTest(Upload);
|
|
|
|
beforeEach(() => setup());
|
|
afterEach(() => teardown());
|
|
|
|
// https://github.com/react-component/upload/issues/36
|
|
it('should get refs inside Upload in componentDidMount', () => {
|
|
let ref;
|
|
class App extends React.Component {
|
|
componentDidMount() {
|
|
ref = this.refs.input;
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<Upload supportServerRender={false}>
|
|
<input ref="input" />
|
|
</Upload>
|
|
);
|
|
}
|
|
}
|
|
mount(<App />);
|
|
expect(ref).toBeDefined();
|
|
});
|
|
|
|
it('return promise in beforeUpload', done => {
|
|
const data = jest.fn();
|
|
const props = {
|
|
action: 'http://upload.com',
|
|
beforeUpload: () => new Promise(resolve => setTimeout(() => resolve('success'), 100)),
|
|
data,
|
|
onChange: ({ file }) => {
|
|
if (file.status !== 'uploading') {
|
|
expect(data).toHaveBeenCalled();
|
|
done();
|
|
}
|
|
},
|
|
};
|
|
|
|
const wrapper = mount(
|
|
<Upload {...props}>
|
|
<button type="button">upload</button>
|
|
</Upload>,
|
|
);
|
|
|
|
wrapper.find('input').simulate('change', {
|
|
target: {
|
|
files: [{ file: 'foo.png' }],
|
|
},
|
|
});
|
|
});
|
|
|
|
it('beforeUpload can be falsy', done => {
|
|
const props = {
|
|
action: 'http://upload.com',
|
|
beforeUpload: false,
|
|
onChange: ({ file }) => {
|
|
if (file.status !== 'uploading') {
|
|
done();
|
|
}
|
|
},
|
|
};
|
|
|
|
const wrapper = mount(
|
|
<Upload {...props}>
|
|
<button type="button">upload</button>
|
|
</Upload>,
|
|
);
|
|
|
|
wrapper.find('input').simulate('change', {
|
|
target: {
|
|
files: [{ file: 'foo.png' }],
|
|
},
|
|
});
|
|
});
|
|
|
|
it('upload promise return file in beforeUpload', done => {
|
|
const data = jest.fn();
|
|
const props = {
|
|
action: 'http://upload.com',
|
|
beforeUpload: file =>
|
|
new Promise(resolve =>
|
|
setTimeout(() => {
|
|
const result = file;
|
|
result.name = 'test.png';
|
|
resolve(result);
|
|
}, 100),
|
|
),
|
|
data,
|
|
onChange: ({ file }) => {
|
|
if (file.status !== 'uploading') {
|
|
expect(data).toHaveBeenCalled();
|
|
expect(file.name).toEqual('test.png');
|
|
done();
|
|
}
|
|
},
|
|
};
|
|
|
|
const wrapper = mount(
|
|
<Upload {...props}>
|
|
<button type="button">upload</button>
|
|
</Upload>,
|
|
);
|
|
|
|
wrapper.find('input').simulate('change', {
|
|
target: {
|
|
files: [{ file: 'foo.png' }],
|
|
},
|
|
});
|
|
});
|
|
|
|
it('should not stop upload when return value of beforeUpload is false', done => {
|
|
const fileList = [
|
|
{
|
|
uid: 'bar',
|
|
name: 'bar.png',
|
|
},
|
|
];
|
|
const mockFile = new File(['foo'], 'foo.png', {
|
|
type: 'image/png',
|
|
});
|
|
const data = jest.fn();
|
|
const props = {
|
|
action: 'http://upload.com',
|
|
fileList,
|
|
beforeUpload: () => false,
|
|
data,
|
|
onChange: ({ file, fileList: updatedFileList }) => {
|
|
expect(file instanceof File).toBe(true);
|
|
expect(updatedFileList.map(f => f.name)).toEqual(['bar.png', 'foo.png']);
|
|
expect(data).not.toHaveBeenCalled();
|
|
done();
|
|
},
|
|
};
|
|
|
|
const wrapper = mount(
|
|
<Upload {...props}>
|
|
<button type="button">upload</button>
|
|
</Upload>,
|
|
);
|
|
|
|
wrapper.find('input').simulate('change', {
|
|
target: {
|
|
files: [mockFile],
|
|
},
|
|
});
|
|
});
|
|
|
|
it('should not stop upload when return value of beforeUpload is not false', done => {
|
|
const data = jest.fn();
|
|
const props = {
|
|
action: 'http://upload.com',
|
|
beforeUpload() {},
|
|
data,
|
|
onChange: () => {
|
|
expect(data).toHaveBeenCalled();
|
|
done();
|
|
},
|
|
};
|
|
|
|
const wrapper = mount(
|
|
<Upload {...props}>
|
|
<button type="button">upload</button>
|
|
</Upload>,
|
|
);
|
|
|
|
wrapper.find('input').simulate('change', {
|
|
target: {
|
|
files: [{ file: 'foo.png' }],
|
|
},
|
|
});
|
|
});
|
|
|
|
// https://github.com/ant-design/ant-design/issues/14779
|
|
it('should contain input file control if upload button is hidden', () => {
|
|
const wrapper = mount(
|
|
<Upload action="http://upload.com">
|
|
<button type="button">upload</button>
|
|
</Upload>,
|
|
);
|
|
|
|
expect(wrapper.find('input[type="file"]').length).toBe(1);
|
|
wrapper.setProps({ children: null });
|
|
expect(wrapper.find('input[type="file"]').length).toBe(1);
|
|
});
|
|
|
|
// https://github.com/ant-design/ant-design/issues/14298
|
|
it('should not have id if upload children is null, avoid being triggered by label', () => {
|
|
// eslint-disable-next-line
|
|
const Demo = ({ children }) => (
|
|
<Form>
|
|
<Form.Item name="upload" label="Upload" valuePropName="fileList">
|
|
<Upload>{children}</Upload>
|
|
</Form.Item>
|
|
</Form>
|
|
);
|
|
|
|
const wrapper = mount(
|
|
<Demo>
|
|
<div>upload</div>
|
|
</Demo>,
|
|
);
|
|
|
|
expect(wrapper.find('input#upload').length).toBe(1);
|
|
wrapper.setProps({ children: null });
|
|
expect(wrapper.find('input#upload').length).toBe(0);
|
|
});
|
|
|
|
// https://github.com/ant-design/ant-design/issues/16478
|
|
it('should not have id if upload is disabled, avoid being triggered by label', () => {
|
|
// eslint-disable-next-line
|
|
const Demo = ({ disabled }) => (
|
|
<Form>
|
|
<Form.Item name="upload" label="Upload" valuePropName="fileList">
|
|
<Upload disabled={disabled}>
|
|
<div>upload</div>
|
|
</Upload>
|
|
</Form.Item>
|
|
</Form>
|
|
);
|
|
|
|
const wrapper = mount(<Demo />);
|
|
expect(wrapper.find('input#upload').length).toBe(1);
|
|
wrapper.setProps({ disabled: true });
|
|
expect(wrapper.find('input#upload').length).toBe(0);
|
|
});
|
|
|
|
it('should be controlled by fileList', () => {
|
|
const fileList = [
|
|
{
|
|
uid: '-1',
|
|
name: 'foo.png',
|
|
status: 'done',
|
|
url: 'http://www.baidu.com/xxx.png',
|
|
},
|
|
];
|
|
const wrapper = mount(<Upload />);
|
|
expect(wrapper.instance().state.fileList).toEqual([]);
|
|
wrapper.setProps({ fileList });
|
|
expect(wrapper.instance().state.fileList).toEqual(fileList);
|
|
});
|
|
|
|
describe('util', () => {
|
|
// https://github.com/react-component/upload/issues/36
|
|
it('should T() return true', () => {
|
|
const res = T();
|
|
expect(res).toBe(true);
|
|
});
|
|
|
|
it('should be able to copy file instance', () => {
|
|
const file = new File([], 'aaa.zip');
|
|
const copiedFile = fileToObject(file);
|
|
['uid', 'lastModified', 'lastModifiedDate', 'name', 'size', 'type'].forEach(key => {
|
|
expect(key in copiedFile).toBe(true);
|
|
});
|
|
});
|
|
|
|
it('should be able to get fileItem', () => {
|
|
const file = { uid: '-1', name: 'item.jpg' };
|
|
const fileList = [
|
|
{
|
|
uid: '-1',
|
|
name: 'item.jpg',
|
|
},
|
|
];
|
|
const targetItem = getFileItem(file, fileList);
|
|
expect(targetItem).toBe(fileList[0]);
|
|
});
|
|
|
|
it('should be able to remove fileItem', () => {
|
|
const file = { uid: '-1', name: 'item.jpg' };
|
|
const fileList = [
|
|
{
|
|
uid: '-1',
|
|
name: 'item.jpg',
|
|
},
|
|
{
|
|
uid: '-2',
|
|
name: 'item2.jpg',
|
|
},
|
|
];
|
|
const targetItem = removeFileItem(file, fileList);
|
|
expect(targetItem).toEqual(fileList.slice(1));
|
|
});
|
|
|
|
it('should not be able to remove fileItem', () => {
|
|
const file = { uid: '-3', name: 'item.jpg' };
|
|
const fileList = [
|
|
{
|
|
uid: '-1',
|
|
name: 'item.jpg',
|
|
},
|
|
{
|
|
uid: '-2',
|
|
name: 'item2.jpg',
|
|
},
|
|
];
|
|
const targetItem = removeFileItem(file, fileList);
|
|
expect(targetItem).toBe(null);
|
|
});
|
|
});
|
|
|
|
it('should support linkProps as object', () => {
|
|
const fileList = [
|
|
{
|
|
uid: '-1',
|
|
name: 'foo.png',
|
|
status: 'done',
|
|
url: 'http://www.baidu.com/xxx.png',
|
|
linkProps: {
|
|
download: 'image',
|
|
rel: 'noopener',
|
|
},
|
|
},
|
|
];
|
|
const wrapper = mount(<Upload fileList={fileList} />);
|
|
const linkNode = wrapper.find('a.ant-upload-list-item-name');
|
|
expect(linkNode.props().download).toBe('image');
|
|
expect(linkNode.props().rel).toBe('noopener');
|
|
});
|
|
|
|
it('should support linkProps as json stringify', () => {
|
|
const linkPropsString = JSON.stringify({
|
|
download: 'image',
|
|
rel: 'noopener',
|
|
});
|
|
const fileList = [
|
|
{
|
|
uid: '-1',
|
|
name: 'foo.png',
|
|
status: 'done',
|
|
url: 'http://www.baidu.com/xxx.png',
|
|
linkProps: linkPropsString,
|
|
},
|
|
];
|
|
const wrapper = mount(<Upload fileList={fileList} />);
|
|
const linkNode = wrapper.find('a.ant-upload-list-item-name');
|
|
expect(linkNode.props().download).toBe('image');
|
|
expect(linkNode.props().rel).toBe('noopener');
|
|
});
|
|
|
|
it('should not stop remove when return value of onRemove is false', done => {
|
|
const mockRemove = jest.fn(() => false);
|
|
const props = {
|
|
onRemove: mockRemove,
|
|
fileList: [
|
|
{
|
|
uid: '-1',
|
|
name: 'foo.png',
|
|
status: 'done',
|
|
url: 'http://www.baidu.com/xxx.png',
|
|
},
|
|
],
|
|
};
|
|
|
|
const wrapper = mount(<Upload {...props} />);
|
|
|
|
wrapper.find('div.ant-upload-list-item .anticon-delete').simulate('click');
|
|
|
|
setImmediate(() => {
|
|
wrapper.update();
|
|
|
|
expect(mockRemove).toHaveBeenCalled();
|
|
expect(props.fileList).toHaveLength(1);
|
|
expect(props.fileList[0].status).toBe('done');
|
|
done();
|
|
});
|
|
});
|
|
|
|
// https://github.com/ant-design/ant-design/issues/18902
|
|
it('should not abort uploading until return value of onRemove is resolved as true', done => {
|
|
let wrapper;
|
|
|
|
const props = {
|
|
onRemove: () =>
|
|
new Promise(
|
|
resolve =>
|
|
setTimeout(() => {
|
|
wrapper.update();
|
|
expect(props.fileList).toHaveLength(1);
|
|
expect(props.fileList[0].status).toBe('uploading');
|
|
resolve(true);
|
|
}),
|
|
100,
|
|
),
|
|
fileList: [
|
|
{
|
|
uid: '-1',
|
|
name: 'foo.png',
|
|
status: 'uploading',
|
|
url: 'http://www.baidu.com/xxx.png',
|
|
},
|
|
],
|
|
onChange: () => {
|
|
expect(props.fileList).toHaveLength(1);
|
|
expect(props.fileList[0].status).toBe('removed');
|
|
done();
|
|
},
|
|
};
|
|
|
|
wrapper = mount(<Upload {...props} />);
|
|
|
|
wrapper.find('div.ant-upload-list-item .anticon-delete').simulate('click');
|
|
});
|
|
|
|
it('should not stop download when return use onDownload', done => {
|
|
const mockRemove = jest.fn(() => false);
|
|
const props = {
|
|
onRemove: mockRemove,
|
|
showUploadList: {
|
|
showDownloadIcon: true,
|
|
},
|
|
fileList: [
|
|
{
|
|
uid: '-1',
|
|
name: 'foo.png',
|
|
status: 'done',
|
|
url: 'http://www.baidu.com/xxx.png',
|
|
},
|
|
],
|
|
};
|
|
|
|
const wrapper = mount(<Upload {...props} onDownload={() => {}} />);
|
|
|
|
wrapper.find('div.ant-upload-list-item .anticon-download').simulate('click');
|
|
|
|
setImmediate(() => {
|
|
wrapper.update();
|
|
|
|
expect(props.fileList).toHaveLength(1);
|
|
expect(props.fileList[0].status).toBe('done');
|
|
done();
|
|
});
|
|
});
|
|
|
|
// https://github.com/ant-design/ant-design/issues/14439
|
|
it('should allow call abort function through upload instance', () => {
|
|
const wrapper = mount(
|
|
<Upload>
|
|
<button type="button">upload</button>
|
|
</Upload>,
|
|
);
|
|
expect(typeof wrapper.instance().upload.abort).toBe('function');
|
|
});
|
|
|
|
it('unmount', () => {
|
|
const wrapper = mount(
|
|
<Upload>
|
|
<button type="button">upload</button>
|
|
</Upload>,
|
|
);
|
|
const clearIntervalSpy = jest.spyOn(global, 'clearInterval');
|
|
expect(clearIntervalSpy).not.toHaveBeenCalled();
|
|
wrapper.unmount();
|
|
expect(clearIntervalSpy).toHaveBeenCalled();
|
|
clearIntervalSpy.mockRestore();
|
|
});
|
|
|
|
it('correct dragCls when type is drag', () => {
|
|
const fileList = [{ status: 'uploading', uid: 'file' }];
|
|
const wrapper = mount(
|
|
<Upload type="drag" fileList={fileList}>
|
|
<button type="button">upload</button>
|
|
</Upload>,
|
|
);
|
|
expect(wrapper.find('.ant-upload-drag-uploading').length).toBe(1);
|
|
});
|
|
|
|
it('return when targetItem is null', () => {
|
|
const fileList = [{ uid: 'file' }];
|
|
const wrapper = mount(
|
|
<Upload type="drag" fileList={fileList}>
|
|
<button type="button">upload</button>
|
|
</Upload>,
|
|
).instance();
|
|
expect(wrapper.onSuccess('', { uid: 'fileItem' })).toBe(undefined);
|
|
expect(wrapper.onProgress('', { uid: 'fileItem' })).toBe(undefined);
|
|
expect(wrapper.onError('', '', { uid: 'fileItem' })).toBe(undefined);
|
|
});
|
|
|
|
it('warning if set `value`', () => {
|
|
resetWarned();
|
|
|
|
const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
|
|
mount(<Upload value={[]} />);
|
|
expect(errorSpy).toHaveBeenCalledWith(
|
|
'Warning: [antd: Upload] `value` is not validate prop, do you mean `fileList`?',
|
|
);
|
|
errorSpy.mockRestore();
|
|
});
|
|
|
|
it('it should be treated as file but not an image', () => {
|
|
const file = {
|
|
status: 'done',
|
|
uid: '-1',
|
|
type: 'video/mp4',
|
|
url: 'https://zos.alipayobjects.com/rmsportal/IQKRngzUuFzJzGzRJXUs.png',
|
|
};
|
|
const wrapper = mount(<Upload listType="picture-card" fileList={[file]} />);
|
|
expect(wrapper.find('img').length).toBe(0);
|
|
});
|
|
});
|