Skip to content
This repository was archived by the owner on Oct 8, 2018. It is now read-only.

Commit cdc6c80

Browse files
author
Travis Mathis
committed
adds tests
1 parent 01baaa1 commit cdc6c80

File tree

8 files changed

+3539
-42
lines changed

8 files changed

+3539
-42
lines changed

‎.babelrc‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,6 @@
11
{
2-
"presets": [ "es2015", "stage-0", "react"]
2+
"presets": [ "es2015", "stage-0", "react"],
3+
"plugins": [
4+
"transform-class-properties"
5+
]
36
}

‎README.md‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,2 @@
1-
# react-file-input
2-
Flexible ReactJS component for handling file uploads with custom style inputs.
1+
# React File Reader
2+
A flexible ReactJS component for handling file uploads with custom style inputs.

‎ReactFileReader.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -82,7 +82,7 @@ export default class ReactFileReader extends React.Component {
8282

8383
ReactFileReader.defaultProps = {
8484
fileTypes: 'image/*',
85-
multipleImages: false,
85+
multipleFiles: false,
8686
base64: false,
8787
};
8888

‎__tests__/ReactFileReader.test.js‎

Lines changed: 44 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,53 @@
11
import React from 'react';
22
import ReactFileReader from '../ReactFileReader';
3-
import renderer from 'react-test-renderer';
3+
import { mount } from 'enzyme';
44

5-
test('the component renders', () => {
6-
const component = renderer.create(
5+
test('the base component renders', () => {
6+
const component = mount(
77
<ReactFileReader elementId='test-render' handleFiles={() => ''}>
88
<p>Upload</p>
99
</ReactFileReader>
1010
);
1111

12-
let tree = component.toJSON();
13-
expect(tree).toMatchSnapshot();
12+
expect(component).toMatchSnapshot();
13+
expect(component.props().multipleFiles).toEqual(false)
14+
expect(component.props().base64).toEqual(false)
15+
expect(component.props().fileTypes).toEqual('image/*')
1416
});
17+
18+
test('returns base64 image', () => {
19+
const component = mount(
20+
<ReactFileReader base64={true} elementId='test-render' handleFiles={() => ''}>
21+
<p>Upload</p>
22+
</ReactFileReader>
23+
);
24+
25+
expect(component).toMatchSnapshot();
26+
expect(component.props().base64).toEqual(true);
27+
});
28+
29+
test('accepts multiple files', () => {
30+
const component = mount(
31+
<ReactFileReader multipleFiles={true} elementId='test-render' handleFiles={() => ''}>
32+
<p>Upload</p>
33+
</ReactFileReader>
34+
);
35+
36+
expect(component).toMatchSnapshot();
37+
expect(component.props().multipleFiles).toEqual(true)
38+
expect(component.props().base64).toEqual(false)
39+
expect(component.props().fileTypes).toEqual('image/*')
40+
});
41+
42+
test('accepted file type should be csv', () => {
43+
const component = mount(
44+
<ReactFileReader fileTypes='.csv' elementId='test-render' handleFiles={() => ''}>
45+
<p>Upload</p>
46+
</ReactFileReader>
47+
);
48+
49+
expect(component).toMatchSnapshot();
50+
expect(component.props().multipleFiles).toEqual(false);
51+
expect(component.props().base64).toEqual(false);
52+
expect(component.props().fileTypes).toEqual('.csv');
53+
})

‎__tests__/__snapshots__/ReactFileReader.test.js.snap‎

Lines changed: 149 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,157 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

3-
exports[`the component renders 1`] = `
4-
<div
5-
className="react-file-reader"
3+
exports[`accepted file type should be csv 1`] = `
4+
<ReactFileReader
5+
base64={false}
6+
elementId="test-render"
7+
fileTypes=".csv"
8+
handleFiles={[Function]}
9+
multipleFiles={false}
610
>
7-
<input
8-
accept="image/*"
9-
className="react-file-reader-input"
10-
id="test-render"
11-
multiple={undefined}
12-
onChange={[Function]}
13-
style={
14-
Object {
15-
"left": "-99999999px",
16-
"opacity": "0px",
17-
"position": "fixed",
18-
"width": "0px",
11+
<div
12+
className="react-file-reader"
13+
>
14+
<input
15+
accept=".csv"
16+
className="react-file-reader-input"
17+
id="test-render"
18+
multiple={false}
19+
onChange={[Function]}
20+
style={
21+
Object {
22+
"left": "-99999999px",
23+
"opacity": "0px",
24+
"position": "fixed",
25+
"width": "0px",
26+
}
1927
}
20-
}
21-
type="file"
22-
/>
28+
type="file"
29+
/>
30+
<div
31+
className="react-file-reader-button"
32+
onClick={[Function]}
33+
>
34+
<p>
35+
Upload
36+
</p>
37+
</div>
38+
</div>
39+
</ReactFileReader>
40+
`;
41+
42+
exports[`should accept multiple files 1`] = `
43+
<ReactFileReader
44+
base64={false}
45+
elementId="test-render"
46+
fileTypes="image/*"
47+
handleFiles={[Function]}
48+
multipleFiles={true}
49+
>
2350
<div
24-
className="react-file-reader-button"
25-
onClick={[Function]}
51+
className="react-file-reader"
2652
>
27-
<p>
28-
Upload
29-
</p>
53+
<input
54+
accept="image/*"
55+
className="react-file-reader-input"
56+
id="test-render"
57+
multiple={true}
58+
onChange={[Function]}
59+
style={
60+
Object {
61+
"left": "-99999999px",
62+
"opacity": "0px",
63+
"position": "fixed",
64+
"width": "0px",
65+
}
66+
}
67+
type="file"
68+
/>
69+
<div
70+
className="react-file-reader-button"
71+
onClick={[Function]}
72+
>
73+
<p>
74+
Upload
75+
</p>
76+
</div>
77+
</div>
78+
</ReactFileReader>
79+
`;
80+
81+
exports[`should return base64 image 1`] = `
82+
<ReactFileReader
83+
base64={true}
84+
elementId="test-render"
85+
fileTypes="image/*"
86+
handleFiles={[Function]}
87+
multipleFiles={false}
88+
>
89+
<div
90+
className="react-file-reader"
91+
>
92+
<input
93+
accept="image/*"
94+
className="react-file-reader-input"
95+
id="test-render"
96+
multiple={false}
97+
onChange={[Function]}
98+
style={
99+
Object {
100+
"left": "-99999999px",
101+
"opacity": "0px",
102+
"position": "fixed",
103+
"width": "0px",
104+
}
105+
}
106+
type="file"
107+
/>
108+
<div
109+
className="react-file-reader-button"
110+
onClick={[Function]}
111+
>
112+
<p>
113+
Upload
114+
</p>
115+
</div>
116+
</div>
117+
</ReactFileReader>
118+
`;
119+
120+
exports[`the base component renders 1`] = `
121+
<ReactFileReader
122+
base64={false}
123+
elementId="test-render"
124+
fileTypes="image/*"
125+
handleFiles={[Function]}
126+
multipleFiles={false}
127+
>
128+
<div
129+
className="react-file-reader"
130+
>
131+
<input
132+
accept="image/*"
133+
className="react-file-reader-input"
134+
id="test-render"
135+
multiple={false}
136+
onChange={[Function]}
137+
style={
138+
Object {
139+
"left": "-99999999px",
140+
"opacity": "0px",
141+
"position": "fixed",
142+
"width": "0px",
143+
}
144+
}
145+
type="file"
146+
/>
147+
<div
148+
className="react-file-reader-button"
149+
onClick={[Function]}
150+
>
151+
<p>
152+
Upload
153+
</p>
154+
</div>
30155
</div>
31-
</div>
156+
</ReactFileReader>
32157
`;

‎index.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -131,7 +131,7 @@ exports.default = ReactFileReader;
131131

132132
ReactFileReader.defaultProps = {
133133
fileTypes: 'image/*',
134-
multipleImages: false,
134+
multipleFiles: false,
135135
base64: false
136136
};
137137

‎package.json‎

Lines changed: 24 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -8,23 +8,39 @@
88
"license": "MIT",
99
"dependencies": {
1010
"prop-types": "^15.5.4",
11-
"react": "^15.4.2",
12-
"react-dom": "^15.4.2",
1311
"uuid4": "^1.0.0"
1412
},
15-
"scripts": {
16-
"build": "./node_modules/.bin/babel ReactFileReader.js -o index.js",
17-
"prepublish": "npm run build",
18-
"test": "jest"
19-
},
2013
"devDependencies": {
2114
"babel-cli": "^6.24.0",
2215
"babel-core": "^6.7.6",
16+
"babel-jest": "^19.0.0",
2317
"babel-loader": "^6.2.4",
2418
"babel-preset-es2015": "^6.24.0",
2519
"babel-preset-react": "^6.23.0",
2620
"babel-preset-stage-0": "^6.22.0",
21+
"babel-register": "^6.24.1",
22+
"enzyme": "^2.8.0",
23+
"enzyme-to-json": "^1.5.0",
24+
"identity-obj-proxy": "^3.0.0",
2725
"jest": "^19.0.2",
28-
"react-test-renderer": "^15.5.3"
26+
"react": "15.4.2",
27+
"react-addons-test-utils": "15.4.2",
28+
"react-dom": "15.4.2"
29+
},
30+
"scripts": {
31+
"build": "./node_modules/.bin/babel ReactFileReader.js -o index.js",
32+
"prepublish": "npm run build",
33+
"test": "jest",
34+
"test:watch": "jest --watch",
35+
"test:coverage": "jest --coverage"
36+
},
37+
"jest": {
38+
"snapshotSerializers": [
39+
"<rootDir>/node_modules/enzyme-to-json/serializer"
40+
],
41+
"moduleNameMapper": {
42+
"^.+\\.(css|scss)$": "identity-obj-proxy",
43+
"^uuid/v4$": "<rootDir>/node_modules/uuid4"
44+
}
2945
}
3046
}

0 commit comments

Comments
 (0)