Typescript download manager unit test (#579)

* adding enzyme

* download manager unit test
This commit is contained in:
VICTOR RAPHAEL BRAGA DE SALES MASCARENHAS 2019-03-06 13:30:55 -03:00 committed by Kiran Niranjan
parent 68efbfa0e8
commit 670735a4e9
7 changed files with 322 additions and 2 deletions

View File

@ -36,5 +36,8 @@
"sort": "status",
"outputPath": "./out/Unit Tests Report.html"
}]
],
"setupFiles": [
"./spec/setup/test-setup.js"
]
}

View File

@ -80,6 +80,7 @@
},
"devDependencies": {
"@types/auto-launch": "^5.0.0",
"@types/enzyme": "^3.9.0",
"@types/ffi": "0.2.1",
"@types/jest": "23.3.12",
"@types/lodash.omit": "^4.5.4",
@ -103,6 +104,8 @@
"electron-chromedriver": "4.0.0-beta.1",
"electron-packager": "13.0.1",
"electron-rebuild": "1.8.2",
"enzyme": "^3.9.0",
"enzyme-adapter-react-16": "^1.10.0",
"eslint": "5.6.1",
"eslint-config-airbnb": "17.1.0",
"eslint-plugin-import": "2.14.0",

View File

@ -0,0 +1,181 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`download manager should render correctly 1`] = `
ShallowWrapper {
Symbol(enzyme.__root__): [Circular],
Symbol(enzyme.__unrendered__): <DownloadManager />,
Symbol(enzyme.__renderer__): Object {
"batchedUpdates": [Function],
"checkPropTypes": [Function],
"getNode": [Function],
"render": [Function],
"simulateError": [Function],
"simulateEvent": [Function],
"unmount": [Function],
},
Symbol(enzyme.__node__): Object {
"instance": null,
"key": undefined,
"nodeType": "host",
"props": Object {
"children": <div
className="download-bar"
id="download-manager-footer"
>
<ul
id="download-main"
/>
<span
className="close-download-bar tempo-icon tempo-icon--close"
id="close-download-bar"
onClick={[Function]}
/>
</div>,
},
"ref": null,
"rendered": Object {
"instance": null,
"key": undefined,
"nodeType": "host",
"props": Object {
"children": Array [
<ul
id="download-main"
/>,
<span
className="close-download-bar tempo-icon tempo-icon--close"
id="close-download-bar"
onClick={[Function]}
/>,
],
"className": "download-bar",
"id": "download-manager-footer",
},
"ref": null,
"rendered": Array [
Object {
"instance": null,
"key": undefined,
"nodeType": "host",
"props": Object {
"children": Array [],
"id": "download-main",
},
"ref": null,
"rendered": Array [],
"type": "ul",
},
Object {
"instance": null,
"key": undefined,
"nodeType": "host",
"props": Object {
"className": "close-download-bar tempo-icon tempo-icon--close",
"id": "close-download-bar",
"onClick": [Function],
},
"ref": null,
"rendered": null,
"type": "span",
},
],
"type": "div",
},
"type": "div",
},
Symbol(enzyme.__nodes__): Array [
Object {
"instance": null,
"key": undefined,
"nodeType": "host",
"props": Object {
"children": <div
className="download-bar"
id="download-manager-footer"
>
<ul
id="download-main"
/>
<span
className="close-download-bar tempo-icon tempo-icon--close"
id="close-download-bar"
onClick={[Function]}
/>
</div>,
},
"ref": null,
"rendered": Object {
"instance": null,
"key": undefined,
"nodeType": "host",
"props": Object {
"children": Array [
<ul
id="download-main"
/>,
<span
className="close-download-bar tempo-icon tempo-icon--close"
id="close-download-bar"
onClick={[Function]}
/>,
],
"className": "download-bar",
"id": "download-manager-footer",
},
"ref": null,
"rendered": Array [
Object {
"instance": null,
"key": undefined,
"nodeType": "host",
"props": Object {
"children": Array [],
"id": "download-main",
},
"ref": null,
"rendered": Array [],
"type": "ul",
},
Object {
"instance": null,
"key": undefined,
"nodeType": "host",
"props": Object {
"className": "close-download-bar tempo-icon tempo-icon--close",
"id": "close-download-bar",
"onClick": [Function],
},
"ref": null,
"rendered": null,
"type": "span",
},
],
"type": "div",
},
"type": "div",
},
],
Symbol(enzyme.__options__): Object {
"adapter": ReactSixteenAdapter {
"options": Object {
"enableComponentDidUpdateOnSetState": true,
"legacyContextMode": "parent",
"lifecycles": Object {
"componentDidUpdate": Object {
"onSetState": true,
},
"getChildContext": Object {
"calledByRenderer": false,
},
"getDerivedStateFromProps": true,
"getSnapshotBeforeUpdate": true,
"setState": Object {
"skipsComponentDidUpdateOnNullish": true,
},
},
},
},
},
Symbol(enzyme.__childContext__): null,
}
`;

View File

@ -0,0 +1,123 @@
import { shallow, ShallowWrapper } from 'enzyme';
import * as React from 'react';
import DownloadManager from '../src/renderer/components/download-manager';
describe('download manager', () => {
it('should render correctly', () => {
const wrapper = shallow(React.createElement(DownloadManager));
expect(wrapper).toMatchSnapshot();
});
it('should call `close` correctly', () => {
const spy: jest.SpyInstance = jest.spyOn(DownloadManager.prototype, 'setState');
const wrapper: ShallowWrapper = shallow(React.createElement(DownloadManager));
wrapper.find('#close-download-bar').simulate('click');
expect(spy).toBeCalledWith({ items: [], showMainComponent: true });
});
it('should call `injectItem` correctly', () => {
const { ipcRenderer } = require('./__mocks__/electron');
const spy: jest.SpyInstance = jest.spyOn(DownloadManager.prototype, 'setState');
const objectDownloadCompleted: object = {
_id: 1,
fileName: 'test.png',
savedPath: 'path://test',
total: 1,
flashing: false,
};
shallow(React.createElement(DownloadManager));
ipcRenderer.send('downloadCompleted', objectDownloadCompleted);
expect(spy).toBeCalledWith({
items: [{
_id: 1,
fileName: 'test.png',
savedPath: 'path://test',
total: 1,
flashing: false,
}], showMainComponent: true,
});
});
describe('download element ready', () => {
let wrapper: ShallowWrapper;
beforeEach(() => {
wrapper = shallow(React.createElement(DownloadManager));
wrapper.setState({
items: [
{
_id: 1,
fileName: 'test.png',
savedPath: 'path://test',
total: 1,
flashing: false,
}],
});
});
it('should exist `download-element` class when there are items', () => {
expect(wrapper.find('.download-element')).toHaveLength(1);
});
it('should call `onOpenFile` correctly', () => {
const { ipcRenderer } = require('./__mocks__/electron');
const sendEventLabel: string = 'send';
const spy: jest.SpyInstance = jest.spyOn(ipcRenderer, sendEventLabel);
wrapper.find('#download-open').simulate('click');
expect(spy).toBeCalledWith('symphony-api', {
cmd: 'download-manager-action',
path: 'path://test',
type: 'open',
});
});
it('should call `showInFinder` correctly', () => {
const { ipcRenderer } = require('./__mocks__/electron');
const sendEventLabel: string = 'send';
const spy: jest.SpyInstance = jest.spyOn(ipcRenderer, sendEventLabel);
wrapper.find('#download-show-in-folder').simulate('click');
expect(spy).toBeCalledWith('symphony-api', {
cmd: 'download-manager-action',
path: 'path://test',
type: 'show',
});
});
});
describe('download completed event', () => {
const { ipcRenderer } = require('./__mocks__/electron');
const downloadCompletedLabelEvent: string = 'downloadCompleted';
const onLabelEvent: string = 'on';
const removeListenerLabelEvent: string = 'removeListener';
it('should call the `downloadCompleted event when mount component', () => {
const spy: jest.SpyInstance = jest.spyOn(ipcRenderer, onLabelEvent);
shallow(React.createElement(DownloadManager));
expect(spy).toBeCalledWith(downloadCompletedLabelEvent, expect.any(Function));
});
it('should remove listen `downloadCompleted` when component is unmount', () => {
const spyMount: jest.SpyInstance = jest.spyOn(ipcRenderer, onLabelEvent);
const spyUnmount: jest.SpyInstance = jest.spyOn(ipcRenderer, removeListenerLabelEvent);
const wrapper: ShallowWrapper = shallow(React.createElement(DownloadManager));
expect(spyMount).toBeCalledWith(downloadCompletedLabelEvent, expect.any(Function));
wrapper.unmount();
expect(spyUnmount).toBeCalledWith(downloadCompletedLabelEvent, expect.any(Function));
});
});
});

View File

@ -13,7 +13,7 @@ jest.mock('../src/common/utils', () => {
jest.mock('../src/common/env', () => {
return {
isWindowsOS: false,
isMac: true
isMac: true,
};
});

10
spec/setup/test-setup.js Normal file
View File

@ -0,0 +1,10 @@
/**
* Defines the React 16 Adapter for Enzyme.
*
* @link http://airbnb.io/enzyme/docs/installation/#working-with-react-16
* @copyright 2017 Airbnb, Inc.
*/
const enzyme = require("enzyme");
const Adapter = require("enzyme-adapter-react-16");
enzyme.configure({ adapter: new Adapter() });

View File

@ -83,7 +83,7 @@ export default class DownloadManager extends React.Component<{}, IManagerState>
const fileDisplayName = this.getFileDisplayName(fileName);
// TODO: fix flashing issue
return (
<li id={_id} className='download-element'>
<li key={_id} id={_id} className='download-element'>
<div className='download-item' id='dl-item' onClick={this.eventHandlers.onOpenFile(_id)}>
<div className='file'>
<div id='download-progress' className='download-complete flash'>