Skip to content

Commit a3b29f9

Browse files
authored
Merge pull request #9 from khuongdn16/supertest
Fixed all existing tests and added graphql project test file
2 parents 7dc986b + 0f57dd1 commit a3b29f9

File tree

17 files changed

+951
-244
lines changed

17 files changed

+951
-244
lines changed

__tests__/__snapshots__/enzyme.test.tsx.snap

Lines changed: 458 additions & 0 deletions
Large diffs are not rendered by default.

__tests__/componentReducer.test.ts

Lines changed: 52 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { State, Action } from '../app/src/interfaces/InterfacesNew';
33

44
import initialState from '../app/src/context/initialState';
55

6-
describe('Testing componentReducer functionality', function () {
6+
describe('Testing componentReducer functionality', () => {
77
let state: State = initialState;
88

99
// TEST 'ADD COMPONENT'
@@ -12,18 +12,18 @@ describe('Testing componentReducer functionality', function () {
1212
const action: Action = {
1313
type: 'ADD COMPONENT',
1414
payload: {
15-
componentName: "TestRegular",
16-
root: false
17-
}
18-
}
15+
componentName: 'TestRegular',
16+
root: false,
17+
},
18+
};
1919
state = reducer(state, action);
2020
// expect state.components array to have length 2
2121
const length = state.components.length;
2222
expect(length).toEqual(2);
2323
// expect new component name to match name of last elem in state.components array
2424
expect(state.components[length - 1].name).toEqual(action.payload.componentName);
25-
})
26-
})
25+
});
26+
});
2727

2828
// TEST 'ADD CHILD'
2929
describe('ADD CHILD reducer', () => {
@@ -33,9 +33,9 @@ describe('Testing componentReducer functionality', function () {
3333
payload: {
3434
type: 'Component',
3535
typeId: 2,
36-
childId: null
37-
}
38-
}
36+
childId: null,
37+
},
38+
};
3939
// switch focus to very first root component
4040
state.canvasFocus = { componentId: 1, childId: null };
4141
state = reducer(state, action);
@@ -49,8 +49,8 @@ describe('Testing componentReducer functionality', function () {
4949
const addedChild = state.components.find(comp => comp.id === newParent.children[1].typeId);
5050
// expect new child typeId to correspond to component with name 'TestRegular'
5151
expect(addedChild.name).toEqual('TestRegular');
52-
})
53-
})
52+
});
53+
});
5454

5555
// TEST 'CHANGE POSITION'
5656
describe('CHANGE POSITION reducer ', () => {
@@ -60,43 +60,43 @@ describe('Testing componentReducer functionality', function () {
6060
payload: {
6161
type: 'HTML Element',
6262
typeId: 9,
63-
childId: null
64-
}
65-
}
63+
childId: null,
64+
},
65+
};
6666
state = reducer(state, actionHtml);
6767
const actionChangePos: Action = {
6868
type: 'CHANGE POSITION',
6969
payload: {
7070
currentChildId: 1,
71-
newParentChildId: null
72-
}
73-
}
71+
newParentChildId: null,
72+
},
73+
};
7474
state = reducer(state, actionChangePos);
7575
const changeParent = state.components.find(comp => comp.id === state.canvasFocus.componentId);
7676
const changeParentChildLength = changeParent.children.length;
7777
// expect last child of parent to be moved Component element
78-
expect(changeParent.children[changeParentChildLength-1].type).toEqual('Component');
78+
expect(changeParent.children[changeParentChildLength - 1].type).toEqual('Component');
7979
// expect last child of parent to have current child ID of payload
80-
expect(changeParent.children[changeParentChildLength-1].childId).toEqual(1);
81-
})
82-
})
80+
expect(changeParent.children[changeParentChildLength - 1].childId).toEqual(1);
81+
});
82+
});
8383

8484
// TEST 'DELETE CHILD'
8585
describe('DELETE CHILD reducer', () => {
8686
it('should delete child of focused top-level component', () => {
8787
// canvas still focused on childId: 2, which is an HTML element
8888
const action: Action = {
89-
type: 'DELETE CHILD'
90-
}
89+
type: 'DELETE CHILD',
90+
};
9191
state = reducer(state, action);
9292
// expect only one remaining child
9393
const delParent = state.components.find(comp => comp.id === state.canvasFocus.componentId);
9494
// expect remaining child to have type 'Component' and to be preceded by separator
9595
expect(delParent.children.length).toEqual(2);
96-
expect(delParent.children[delParent.children.length -1].type).toEqual('Component');
97-
expect(delParent.children[delParent.children.length -2].name).toEqual('separator');
98-
})
99-
})
96+
expect(delParent.children[delParent.children.length - 1].type).toEqual('Component');
97+
expect(delParent.children[delParent.children.length - 2].name).toEqual('separator');
98+
});
99+
});
100100

101101
// TEST 'CHANGE FOCUS'
102102
describe('CHANGE FOCUS reducer', () => {
@@ -105,14 +105,14 @@ describe('Testing componentReducer functionality', function () {
105105
type: 'CHANGE FOCUS',
106106
payload: {
107107
componentId: 2,
108-
childId: null
109-
}
110-
}
108+
childId: null,
109+
},
110+
};
111111
state = reducer(state, action);
112112
expect(state.canvasFocus.componentId).toEqual(2);
113113
expect(state.canvasFocus.childId).toEqual(null);
114-
})
115-
})
114+
});
115+
});
116116

117117
// TEST 'UPDATE CSS'
118118
describe('UPDATE CSS reducer', () => {
@@ -121,59 +121,58 @@ describe('Testing componentReducer functionality', function () {
121121
type: 'UPDATE CSS',
122122
payload: {
123123
style: {
124-
backgroundColor: 'gray'
125-
}
126-
}
127-
}
124+
backgroundColor: 'gray',
125+
},
126+
},
127+
};
128128
state = reducer(state, action);
129129
const styledComp = state.components.find(comp => comp.id === state.canvasFocus.componentId);
130130
// expect the style property on targeted comp to equal style property in payload
131131
expect(styledComp.style.backgroundColor).toEqual(action.payload.style.backgroundColor);
132-
})
133-
})
132+
});
133+
});
134134

135135
// TEST 'UPDATE PROJECT NAME'
136136
describe('UPDATE PROJECT NAME reducer', () => {
137137
it('should update project with specified name', () => {
138138
const action: Action = {
139139
type: 'UPDATE PROJECT NAME',
140-
payload: 'TESTNAME'
141-
}
140+
payload: 'TESTNAME',
141+
};
142142
state = reducer(state, action);
143143
// expect state name to equal payload
144144
expect(state.name).toEqual(action.payload);
145-
})
146-
})
145+
});
146+
});
147147

148148
// TEST 'CHANGE PROJECT TYPE'
149149
describe('CHANGE PROJECT TYPE reducer', () => {
150150
it('should change project type to specified type', () => {
151151
const action: Action = {
152152
type: 'CHANGE PROJECT TYPE',
153153
payload: {
154-
projectType: 'Classic React'
155-
}
154+
projectType: 'Classic React',
155+
},
156156
};
157157
state = reducer(state, action);
158158
expect(state.projectType).toEqual(action.payload.projectType);
159-
})
160-
})
159+
});
160+
});
161161

162162
// TEST 'RESET STATE'
163163
describe('RESET STATE reducer', () => {
164164
it('should reset project to initial state', () => {
165165
const action: Action = {
166166
type: 'RESET STATE',
167-
payload: ''
168-
}
167+
payload: '',
168+
};
169169
state = reducer(state, action);
170170
// expect default project to have empty string as name
171171
expect(state.name).toEqual('TESTNAME');
172172
// expect default project to only have one component in components array
173173
expect(state.components.length).toEqual(1);
174174
// expect lone component to have no children :(
175175
expect(state.components[0].children.length).toEqual(0);
176-
})
177-
})
178-
179-
})
176+
});
177+
});
178+
});

__tests__/enzyme.test.tsx

Lines changed: 22 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { shallow } from 'enzyme';
1+
import { shallow, render, mount } from 'enzyme';
22
import React from 'react';
33
import { DndProvider } from 'react-dnd';
44
import { HTML5Backend } from 'react-dnd-html5-backend';
@@ -18,6 +18,7 @@ import NavBar from '../app/src/components/top/NavBar';
1818
import MenuItem from '@material-ui/core/MenuItem';
1919
import Tab from '@material-ui/core/Tab';
2020
import RightContainer from '../app/src/containers/RightContainer';
21+
import LoginButton from '../app/src/components/right/LoginButton';
2122

2223
/* If there is an error with unmatched snapshots because of intentionally modified codes, delete the contents in enzyme.test.tsx.snap to record new codes as blueprints */
2324

@@ -108,11 +109,14 @@ describe('Test AppContainer container', () => {
108109
});
109110
// testing for a RightContainer
110111
it('Should render RightContainer', () => {
112+
// This test doesnt work eventhough the component renders
113+
// expect(
114+
// target.contains(
115+
// <RightContainer isThemeLight={props.isThemeLight}/>
116+
// )).toBe(true);
111117
expect(
112-
target.contains(
113-
<RightContainer />,
114-
),
115-
).toBe(true);
118+
target.find(RightContainer)
119+
).toHaveLength(1);
116120
});
117121

118122
// testing for NavBar component
@@ -121,37 +125,34 @@ describe('Test NavBar component', () => {
121125
setTheme: jest.fn(),
122126
isThemeLight: jest.fn(),
123127
};
124-
const target = shallow(
128+
const target = shallow (
125129
<NavBar setTheme={props.setTheme} isThemeLight={props.isThemeLight} />
126130
);
127131
// testing for 4 generic buttons in NavBar
128-
it('Should render 4 buttons: "Clear Canvas", "Export", "Dark Mode", "Login"', () => {
129-
expect(target.find('.navbarButton')).toHaveLength(4);
132+
it('Should render 2 buttons: "Clear Canvas", "Dark Mode"', () => {
133+
expect(target.find('.navbarButton')).toHaveLength(2);
130134
expect(
131135
target
132136
.find('.navbarButton')
133137
.at(0)
134138
.text(),
135139
).toEqual('Clear Canvas');
136-
expect(
137-
target
138-
.find('.navbarButton')
139-
.at(1)
140-
.text(),
141-
).toEqual('Export');
142140
expect(
143141
target
144142
.find('.navbarButton')
145-
.at(2)
143+
.at(1)
146144
.text(),
147145
).toEqual('Dark Mode');
148-
expect(
149-
target
150-
.find('.navbarButton')
151-
.at(3)
152-
.text(),
153-
).toEqual('Login');
146+
154147
});
148+
149+
it('Should render "Login" button', () => {
150+
const wrapper = shallow( <LoginButton />);
151+
expect(wrapper).toHaveLength(1);
152+
expect(
153+
wrapper
154+
.find('.navbarButton')
155+
).toHaveLength(1);
155156
});
156157

157158
describe('Test LeftContainer container', () => {
@@ -161,5 +162,3 @@ describe('Test LeftContainer container', () => {
161162
expect(target.find(<HTMLPanel />)).toBeDefined();
162163
});
163164
});
164-
165-

0 commit comments

Comments
 (0)