2017-02-22 16:06:08 +08:00
|
|
|
/* eslint-disable react/no-string-refs, react/prefer-es6-class */
|
|
|
|
import React from 'react';
|
|
|
|
import { mount } from 'enzyme';
|
|
|
|
import Upload from '..';
|
2018-05-02 13:56:54 +08:00
|
|
|
import { fileToObject } from '../utils';
|
2018-05-31 22:37:09 +08:00
|
|
|
import { setup, teardown } from './mock';
|
2017-02-22 16:06:08 +08:00
|
|
|
|
|
|
|
describe('Upload', () => {
|
2018-05-31 22:37:09 +08:00
|
|
|
beforeEach(() => setup());
|
|
|
|
afterEach(() => teardown());
|
|
|
|
|
2017-02-22 16:06:08 +08:00
|
|
|
// https://github.com/react-component/upload/issues/36
|
|
|
|
it('should get refs inside Upload in componentDidMount', () => {
|
|
|
|
let ref;
|
2017-04-30 18:47:15 +08:00
|
|
|
class App extends React.Component {
|
2017-02-22 16:06:08 +08:00
|
|
|
componentDidMount() {
|
|
|
|
ref = this.refs.input;
|
2017-04-27 21:12:23 +08:00
|
|
|
}
|
2018-06-22 21:05:13 +08:00
|
|
|
|
2017-02-22 16:06:08 +08:00
|
|
|
render() {
|
|
|
|
return (
|
|
|
|
<Upload supportServerRender={false}>
|
|
|
|
<input ref="input" />
|
|
|
|
</Upload>
|
|
|
|
);
|
2017-04-27 21:12:23 +08:00
|
|
|
}
|
|
|
|
}
|
2017-02-22 16:06:08 +08:00
|
|
|
mount(<App />);
|
|
|
|
expect(ref).toBeDefined();
|
|
|
|
});
|
2017-10-10 14:45:18 +08:00
|
|
|
|
|
|
|
it('return promise in beforeUpload', (done) => {
|
|
|
|
const data = jest.fn();
|
|
|
|
const props = {
|
|
|
|
action: 'http://upload.com',
|
2018-06-22 21:05:13 +08:00
|
|
|
beforeUpload: () => new Promise(resolve => (
|
2017-11-09 19:34:36 +08:00
|
|
|
setTimeout(() => resolve('success'), 100)
|
2018-06-22 21:05:13 +08:00
|
|
|
)),
|
2017-10-10 14:45:18 +08:00
|
|
|
data,
|
|
|
|
onChange: ({ file }) => {
|
|
|
|
if (file.status !== 'uploading') {
|
|
|
|
expect(data).toBeCalled();
|
|
|
|
done();
|
|
|
|
}
|
|
|
|
},
|
|
|
|
};
|
|
|
|
|
|
|
|
const wrapper = mount(
|
|
|
|
<Upload {...props}>
|
2018-06-22 21:05:13 +08:00
|
|
|
<button type="button">upload</button>
|
2017-10-10 14:45:18 +08:00
|
|
|
</Upload>
|
|
|
|
);
|
|
|
|
|
|
|
|
wrapper.find('input').simulate('change', {
|
|
|
|
target: {
|
|
|
|
files: [
|
2018-04-19 11:54:28 +08:00
|
|
|
{ file: 'foo.png' },
|
2017-10-10 14:45:18 +08:00
|
|
|
],
|
|
|
|
},
|
|
|
|
});
|
|
|
|
});
|
2017-10-12 14:48:35 +08:00
|
|
|
|
2018-04-28 11:06:32 +08:00
|
|
|
it('should not stop upload when return value of beforeUpload is false', (done) => {
|
2018-06-06 12:13:06 +08:00
|
|
|
const fileList = [{
|
|
|
|
uid: 'bar',
|
|
|
|
name: 'bar.png',
|
|
|
|
}];
|
2018-04-28 11:06:32 +08:00
|
|
|
const mockFile = new File(['foo'], 'foo.png', {
|
|
|
|
type: 'image/png',
|
|
|
|
});
|
2017-10-12 14:48:35 +08:00
|
|
|
const data = jest.fn();
|
|
|
|
const props = {
|
|
|
|
action: 'http://upload.com',
|
2018-06-06 12:13:06 +08:00
|
|
|
fileList,
|
2017-10-12 14:48:35 +08:00
|
|
|
beforeUpload: () => false,
|
|
|
|
data,
|
2018-06-06 12:13:06 +08:00
|
|
|
onChange: ({ file, fileList: updatedFileList }) => {
|
2018-04-28 11:06:32 +08:00
|
|
|
expect(file instanceof File).toBe(true);
|
2018-06-06 12:13:06 +08:00
|
|
|
expect(updatedFileList.map(f => f.name)).toEqual(['bar.png', 'foo.png']);
|
2017-10-12 14:48:35 +08:00
|
|
|
expect(data).not.toBeCalled();
|
|
|
|
done();
|
|
|
|
},
|
|
|
|
};
|
|
|
|
|
|
|
|
const wrapper = mount(
|
|
|
|
<Upload {...props}>
|
2018-06-22 21:05:13 +08:00
|
|
|
<button type="button">upload</button>
|
2017-10-12 14:48:35 +08:00
|
|
|
</Upload>
|
|
|
|
);
|
|
|
|
|
|
|
|
wrapper.find('input').simulate('change', {
|
|
|
|
target: {
|
|
|
|
files: [
|
2018-04-28 11:06:32 +08:00
|
|
|
mockFile,
|
2017-10-12 14:48:35 +08:00
|
|
|
],
|
|
|
|
},
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2018-05-22 15:36:25 +08:00
|
|
|
it('should increase percent automaticly when call autoUpdateProgress in IE', (done) => {
|
|
|
|
let uploadInstance;
|
|
|
|
let lastPercent = -1;
|
|
|
|
const props = {
|
2018-05-31 22:37:09 +08:00
|
|
|
action: 'http://upload.com',
|
2018-05-22 15:36:25 +08:00
|
|
|
onChange: ({ file }) => {
|
|
|
|
if (file.percent === 0 && file.status === 'uploading') {
|
|
|
|
// manually call it
|
|
|
|
uploadInstance.autoUpdateProgress(0, file);
|
|
|
|
}
|
|
|
|
if (file.status === 'uploading') {
|
|
|
|
expect(file.percent).toBeGreaterThan(lastPercent);
|
|
|
|
lastPercent = file.percent;
|
|
|
|
}
|
|
|
|
if (file.status === 'done' || file.status === 'error') {
|
|
|
|
done();
|
|
|
|
}
|
|
|
|
},
|
|
|
|
};
|
|
|
|
|
|
|
|
const wrapper = mount(
|
|
|
|
<Upload {...props}>
|
2018-06-22 21:05:13 +08:00
|
|
|
<button type="button">upload</button>
|
2018-05-22 15:36:25 +08:00
|
|
|
</Upload>
|
|
|
|
);
|
|
|
|
|
|
|
|
wrapper.find('input').simulate('change', {
|
|
|
|
target: {
|
|
|
|
files: [
|
|
|
|
{ file: 'foo.png' },
|
|
|
|
],
|
|
|
|
},
|
|
|
|
});
|
|
|
|
|
|
|
|
uploadInstance = wrapper.instance();
|
|
|
|
});
|
|
|
|
|
2017-10-12 14:48:35 +08:00
|
|
|
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).toBeCalled();
|
|
|
|
done();
|
|
|
|
},
|
|
|
|
};
|
|
|
|
|
|
|
|
const wrapper = mount(
|
|
|
|
<Upload {...props}>
|
2018-06-22 21:05:13 +08:00
|
|
|
<button type="button">upload</button>
|
2017-10-12 14:48:35 +08:00
|
|
|
</Upload>
|
|
|
|
);
|
|
|
|
|
|
|
|
wrapper.find('input').simulate('change', {
|
|
|
|
target: {
|
|
|
|
files: [
|
2018-04-19 11:54:28 +08:00
|
|
|
{ file: 'foo.png' },
|
2017-10-12 14:48:35 +08:00
|
|
|
],
|
|
|
|
},
|
|
|
|
});
|
|
|
|
});
|
2018-05-02 13:56:54 +08:00
|
|
|
|
|
|
|
describe('util', () => {
|
|
|
|
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);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
2017-02-22 16:06:08 +08:00
|
|
|
});
|