Skip to content

Commit fab2f28

Browse files
negative0negative0
committed
Add tests for FileActions.
1 parent c346743 commit fab2f28

File tree

6 files changed

+185
-50
lines changed

6 files changed

+185
-50
lines changed

‎package-lock.json

Lines changed: 20 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -58,8 +58,8 @@
5858
"enzyme-adapter-react-16": "^1.15.2",
5959
"enzyme-to-json": "^3.4.4",
6060
"fetch-mock": "^9.4.0",
61-
"react-dnd-test-backend": "^7.7.0",
62-
"react-dnd-test-utils": "^7.4.4",
61+
"react-dnd-test-backend": "^11.1.3",
62+
"react-dnd-test-utils": "^11.1.3",
6363
"react-scripts": "^3.3.1",
6464
"redux-mock-store": "^1.5.4"
6565
},

‎src/utils/testData.js

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -352,4 +352,13 @@ export const FILE_ITEM_DATA = {
352352
MimeType: 'application/octet-stream',
353353
ModTime: '2019-06-07T22:44:37.357539000+05:30',
354354
IsDir: false
355+
};
356+
357+
export const DIR_ITEM_DATA = {
358+
Path: 'abc',
359+
Name: 'abc',
360+
Size: 0,
361+
MimeType: '',
362+
ModTime: '2019-06-07T22:44:37.357539000+05:30',
363+
IsDir: true
355364
};

‎src/views/Explorer/FilesView/FileActions.js

Lines changed: 24 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -17,54 +17,30 @@ function FileActions({downloadHandle, deleteHandle, item, linkShareHandle}) {
1717
// ID = Name;
1818
// }
1919

20-
21-
if (!IsDir) {
22-
23-
return (
24-
<React.Fragment>
25-
<Button color="link" onClick={() => downloadHandle(item)}>
26-
<i className={"fa fa-cloud-download fa-lg d-inline"}/>
27-
</Button>
28-
<Button color="link">
29-
<i className="fa fa-info-circle"/>
30-
</Button>
31-
32-
<UncontrolledButtonDropdown>
33-
<DropdownToggle color="link">
34-
<i className="fa fa-ellipsis-v"/>
35-
</DropdownToggle>
36-
<DropdownMenu>
37-
<DropdownItem header>Actions</DropdownItem>
38-
<DropdownItem onClick={() => linkShareHandle(item)}><i
39-
className="fa fa-share fa-lg d-inline"/> Share with link</DropdownItem>
40-
<DropdownItem divider/>
41-
<DropdownItem onClick={() => confirmDelete(deleteHandle, item)}><i
42-
className="fa fa-remove fa-lg d-inline text-danger"/> Delete </DropdownItem>
43-
</DropdownMenu>
44-
</UncontrolledButtonDropdown>
45-
</React.Fragment>
46-
47-
);
48-
} else {
49-
return (
50-
<React.Fragment>
51-
52-
<UncontrolledButtonDropdown>
53-
<DropdownToggle color="link">
54-
<i className="fa fa-ellipsis-v"/>
55-
</DropdownToggle>
56-
<DropdownMenu>
57-
<DropdownItem header>Actions</DropdownItem>
58-
<DropdownItem onClick={() => linkShareHandle(item)}><i
59-
className="fa fa-share fa-lg d-inline"/> Share with link</DropdownItem>
60-
<DropdownItem divider/>
61-
<DropdownItem onClick={() => confirmDelete(deleteHandle, item)}><i
62-
className="fa fa-remove fa-lg d-inline text-danger"/> Delete </DropdownItem>
63-
</DropdownMenu>
64-
</UncontrolledButtonDropdown>
65-
</React.Fragment>
66-
)
67-
}
20+
return (
21+
<div data-test="fileActionsComponent">
22+
{!IsDir && <Button color="link" onClick={() => downloadHandle(item)} data-test="btn-download">
23+
<i className={"fa fa-cloud-download fa-lg d-inline"}/>
24+
</Button>}
25+
<Button color="link">
26+
<i className="fa fa-info-circle"/>
27+
</Button>
28+
29+
<UncontrolledButtonDropdown>
30+
<DropdownToggle color="link">
31+
<i className="fa fa-ellipsis-v"/>
32+
</DropdownToggle>
33+
<DropdownMenu>
34+
<DropdownItem header>Actions</DropdownItem>
35+
<DropdownItem data-test="btn-share-with-link" onClick={() => linkShareHandle(item)}><i
36+
className="fa fa-share fa-lg d-inline"/> Share with link</DropdownItem>
37+
<DropdownItem divider/>
38+
<DropdownItem data-test="btn-delete-item" onClick={() => confirmDelete(deleteHandle, item)}><i
39+
className="fa fa-remove fa-lg d-inline text-danger"/> Delete </DropdownItem>
40+
</DropdownMenu>
41+
</UncontrolledButtonDropdown>
42+
</div>
43+
)
6844
}
6945

7046
FileActions.propTypes = {

‎src/views/Explorer/FilesView/FileActions.test.js

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
import React from "react";
2+
import {shallow} from "enzyme";
3+
import toJson from "enzyme-to-json";
4+
import FileActions from "./FileActions";
5+
import {findByTestAttr, testStore} from "../../../../Utils";
6+
import {FILE_ITEM_DATA} from "../../../utils/testData";
7+
8+
const setUp = (intialState = {}, props = {}) => {
9+
const store = testStore(intialState);
10+
11+
const component = shallow(<FileActions {...props} store={store}/>);
12+
return component;
13+
};
14+
15+
16+
describe('File Actions', function () {
17+
describe('renders', function () {
18+
let wrapper;
19+
let downloadHandle = jest.fn();
20+
let deleteHandle = jest.fn();
21+
let linkShareHandle = jest.fn();
22+
beforeEach(() => {
23+
const initialState = {};
24+
25+
const props = {
26+
item: FILE_ITEM_DATA,
27+
downloadHandle,
28+
deleteHandle,
29+
linkShareHandle
30+
};
31+
wrapper = setUp(initialState, props)
32+
});
33+
34+
it('should render without crashing', function () {
35+
const component = findByTestAttr(wrapper, "fileActionsComponent");
36+
expect(component).toHaveLength(1);
37+
});
38+
it('should contain buttons', function () {
39+
const downloadButton = findByTestAttr(wrapper, "btn-download");
40+
expect(downloadButton).toHaveLength(1);
41+
42+
const shareWithLinkButton = findByTestAttr(wrapper, "btn-share-with-link");
43+
expect(shareWithLinkButton).toHaveLength(1);
44+
45+
const deleteItemButton = findByTestAttr(wrapper, "btn-delete-item");
46+
expect(deleteItemButton).toHaveLength(1);
47+
48+
});
49+
50+
it('should match snapshot', function () {
51+
expect(toJson(wrapper)).toMatchSnapshot();
52+
});
53+
54+
});
55+
});

‎src/views/Explorer/FilesView/__snapshots__/FileActions.test.js.snap

Lines changed: 75 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`File Actions renders should match snapshot 1`] = `
4+
<div
5+
data-test="fileActionsComponent"
6+
>
7+
<Button
8+
color="link"
9+
data-test="btn-download"
10+
onClick={[Function]}
11+
tag="button"
12+
>
13+
<i
14+
className="fa fa-cloud-download fa-lg d-inline"
15+
/>
16+
</Button>
17+
<Button
18+
color="link"
19+
tag="button"
20+
>
21+
<i
22+
className="fa fa-info-circle"
23+
/>
24+
</Button>
25+
<UncontrolledButtonDropdown>
26+
<DropdownToggle
27+
aria-haspopup={true}
28+
color="link"
29+
>
30+
<i
31+
className="fa fa-ellipsis-v"
32+
/>
33+
</DropdownToggle>
34+
<DropdownMenu
35+
flip={true}
36+
tag="div"
37+
>
38+
<DropdownItem
39+
header={true}
40+
tag="button"
41+
toggle={true}
42+
>
43+
Actions
44+
</DropdownItem>
45+
<DropdownItem
46+
data-test="btn-share-with-link"
47+
onClick={[Function]}
48+
tag="button"
49+
toggle={true}
50+
>
51+
<i
52+
className="fa fa-share fa-lg d-inline"
53+
/>
54+
Share with link
55+
</DropdownItem>
56+
<DropdownItem
57+
divider={true}
58+
tag="button"
59+
toggle={true}
60+
/>
61+
<DropdownItem
62+
data-test="btn-delete-item"
63+
onClick={[Function]}
64+
tag="button"
65+
toggle={true}
66+
>
67+
<i
68+
className="fa fa-remove fa-lg d-inline text-danger"
69+
/>
70+
Delete
71+
</DropdownItem>
72+
</DropdownMenu>
73+
</UncontrolledButtonDropdown>
74+
</div>
75+
`;

0 commit comments

Comments
 (0)