Skip to content

Commit 506aba2

Browse files
authored
Merge pull request #68 from sean1292/testing
Testing
2 parents 08fab24 + caf1c28 commit 506aba2

File tree

10 files changed

+204
-89
lines changed

10 files changed

+204
-89
lines changed

src/actions/__tests__/actionCreator.test.tsx

Lines changed: 0 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -115,14 +115,6 @@ describe('Testing All of The Action Creators', () => {
115115
expect(actions.editComponent(payld)).toEqual(expectedAction);
116116
});
117117

118-
it('handleClose returns a proper action', () => {
119-
const expectedAction = {
120-
type: types.HANDLE_CLOSE,
121-
payload: false
122-
};
123-
expect(actions.handleClose()).toEqual(expectedAction);
124-
});
125-
126118
it('handleTransform returns a proper action', () => {
127119
const payld = { x: 100, y: 200, width: 50, height: 75 };
128120
const componentId = 2;

src/actions/actionCreators.ts

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -241,11 +241,6 @@ export const exportFiles = ({
241241
);
242242
};
243243

244-
export const handleClose = (): Action => ({
245-
type: HANDLE_CLOSE,
246-
payload: false
247-
});
248-
249244
export const handleTransform = (
250245
componentId: number,
251246
childId: number,

src/components/bottom/BottomPanel.tsx

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import React, { Component } from 'react';
22
import { connect } from 'react-redux';
33
import {
4-
handleClose,
54
deleteProp,
65
addProp,
76
toggleNative,
@@ -16,7 +15,6 @@ const IPC = require('electron').ipcRenderer;
1615
const mapDispatchToProps = (dispatch: any) => ({
1716
addProp: (prop: PropInt) => dispatch(addProp(prop)),
1817
deleteProp: (id: number) => dispatch(deleteProp(id)),
19-
handleNotificationClose: () => dispatch(handleClose()),
2018
toggleNative: () => dispatch(toggleNative()),
2119
toggleCodeEdit: () => dispatch(toggleCodeEdit())
2220
});

src/components/bottom/CodePreview.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -85,6 +85,7 @@ class CodePreview extends Component<CodePreviewProps> {
8585
readOnly={this.props.codeReadOnly}
8686
editorProps={{ $blockScrolling: true }}
8787
fontSize={16}
88+
tabSize={2}
8889
/>
8990
<div style={{ display: 'flex', flexDirection: 'column' }}>
9091
<Button

src/components/bottom/Props.tsx

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -133,8 +133,6 @@ class Props extends Component<PropsPropsInt, StateInt> {
133133

134134
this.props.addProp({
135135
key: propVariable,
136-
value: propValue,
137-
required: propRequired,
138136
type: propType
139137
});
140138

src/helperFunctions/cloneDeep.ts

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,10 @@
11
// index signatures
2-
function cloneDeep(value: { [key: string]: any } | any[]): { [key: string]: any } | any[] {
2+
function cloneDeep(
3+
value: { [key: string]: any } | any[]
4+
): { [key: string]: any } | any {
35
if (Array.isArray(value)) {
46
const result: any[] = [];
5-
value.forEach((el) => {
7+
value.forEach(el => {
68
if (typeof el === 'object') {
79
result.push(cloneDeep(el));
810
} else {
@@ -13,7 +15,7 @@ function cloneDeep(value: { [key: string]: any } | any[]): { [key: string]: any
1315
}
1416
if (typeof value === 'object' && value !== null) {
1517
const result: { [key: string]: any } = {};
16-
Object.keys(value).forEach((key) => {
18+
Object.keys(value).forEach(key => {
1719
if (typeof value[key] === 'object') {
1820
result[key] = cloneDeep(value[key]);
1921
} else {

src/interfaces/Interfaces.ts

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,6 @@
33
export interface PropInt {
44
id?: number;
55
key: string;
6-
value: string;
7-
required: boolean;
86
type: string;
97
}
108

Lines changed: 147 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,147 @@
1+
import * as reducers from '../bottomReducers';
2+
import * as interfaces from '../../interfaces/Interfaces';
3+
import * as types from '../../actionTypes/index';
4+
import { initialApplicationState, testComponent } from '../initialState';
5+
6+
describe('Testing bottom reducer:', () => {
7+
let state: interfaces.ApplicationStateInt;
8+
// redefine the default state before each reducer test
9+
beforeEach(() => {
10+
state = initialApplicationState;
11+
state.components.push(testComponent);
12+
});
13+
14+
describe('addProp', () => {
15+
it('Properly adds prop to a focus component', () => {
16+
const payload = { key: 'test', type: 'string' };
17+
const newState = reducers.addProp(state, payload);
18+
let expectedProp = {
19+
id: state.focusComponent.nextPropId,
20+
key: 'test',
21+
type: 'string'
22+
};
23+
const newAppComp = newState.components.find(
24+
(comp: interfaces.ComponentInt) => comp.id === 1
25+
);
26+
27+
expect(newState.focusComponent.props[0]).toEqual(expectedProp);
28+
expect(newAppComp.props[0]).toEqual(expectedProp);
29+
});
30+
});
31+
32+
describe('deleteProp', () => {
33+
it('Properly deletes a prop for a focus component', () => {
34+
const payload = { key: 'test', type: 'string' };
35+
let newState = reducers.addProp(state, payload);
36+
37+
const propId = state.focusComponent.nextPropId;
38+
newState = reducers.deleteProp(newState, propId);
39+
40+
expect(newState.focusComponent.props.length).toEqual(0);
41+
});
42+
});
43+
44+
describe('toggleCodeEdit', () => {
45+
it('Properly switches the app into "Code Edit" mode', () => {
46+
const newState = reducers.toggleCodeEdit(state);
47+
expect(newState.codeReadOnly).toEqual(false);
48+
});
49+
});
50+
51+
describe('toggelNative', () => {
52+
let newState: any;
53+
it('Properly switches the app into "Native" mode', () => {
54+
window.confirm = jest.fn(() => true);
55+
56+
newState = reducers.toggleNative(state);
57+
58+
//check that it doesn't mutate original state
59+
expect(newState).not.toBe(state);
60+
//check if the native toggle switched
61+
expect(newState.native).toEqual(true);
62+
63+
//expect window confirm message to run
64+
expect(window.confirm).toBeCalled();
65+
66+
//check proper width and height
67+
expect(newState.focusComponent.position.width).toEqual(500);
68+
expect(newState.focusComponent.position.height).toEqual(850);
69+
70+
//check if it has been marked as changed
71+
expect(newState.focusComponent.changed).toEqual(true);
72+
73+
//check if it has been updated in components array
74+
const appInComps = newState.components.find(
75+
(e: interfaces.ComponentInt) => e.id === 1
76+
);
77+
78+
//check proper width and height
79+
expect(appInComps.position.width).toEqual(500);
80+
expect(appInComps.position.height).toEqual(850);
81+
82+
//check if it has been marked as changed
83+
expect(appInComps.changed).toEqual(true);
84+
});
85+
86+
it('Properly switches the app back into "React" mode', () => {
87+
window.confirm = jest.fn(() => true);
88+
89+
newState = reducers.toggleNative(newState);
90+
91+
//check if the native toggle switched
92+
expect(newState.native).toEqual(false);
93+
94+
//expect window confirm message to run
95+
expect(window.confirm).toBeCalled();
96+
97+
//check proper width and height
98+
expect(newState.focusComponent.position.width).toEqual(1200);
99+
expect(newState.focusComponent.position.height).toEqual(800);
100+
101+
//check if it has been marked as changed
102+
expect(newState.focusComponent.changed).toEqual(true);
103+
104+
//check if it has been updated in components array
105+
const appInComps = newState.components.find(
106+
(e: interfaces.ComponentInt) => e.id === 1
107+
);
108+
109+
//check proper width and height
110+
expect(appInComps.position.width).toEqual(1200);
111+
expect(appInComps.position.height).toEqual(800);
112+
113+
//check if it has been marked as changed
114+
expect(appInComps.changed).toEqual(true);
115+
});
116+
117+
it('Handles user choosing not to proceed when prompted', () => {
118+
window.confirm = jest.fn(() => false);
119+
120+
newState = reducers.toggleNative(newState);
121+
122+
//expect window confirm message to run
123+
expect(window.confirm).toBeCalled();
124+
});
125+
});
126+
127+
describe('updateCode', () => {
128+
it(' Properly updates the code of a given component', () => {
129+
const payload = { componentId: 1, code: 'testing code' };
130+
const newState = reducers.updateCode(state, payload);
131+
//check if it has been marked as changed
132+
expect(newState.focusComponent.changed).toEqual(false);
133+
134+
//check if it has been updated in components array
135+
const appInComps = newState.components.find(
136+
(e: interfaces.ComponentInt) => e.id === 1
137+
);
138+
139+
//check proper width and height
140+
expect(appInComps.code).toEqual(payload.code);
141+
expect(appInComps.changed).toEqual(false);
142+
143+
//doesn't mutate the state
144+
expect(newState).not.toBe(state);
145+
});
146+
});
147+
});

src/reducers/bottomReducers.ts

Lines changed: 49 additions & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -11,12 +11,7 @@ import { initialApplicationState } from './initialState';
1111

1212
export const addProp = (
1313
state: ApplicationStateInt,
14-
{
15-
key,
16-
value = null,
17-
required,
18-
type
19-
}: { key: string; value: string; required: boolean; type: string }
14+
{ key, type }: { key: string; type: string }
2015
) => {
2116
if (!state.focusComponent.id) {
2217
console.log('Add prop error. no focused component ');
@@ -30,8 +25,6 @@ export const addProp = (
3025
const newProp: PropInt = {
3126
id: selectedComponent.nextPropId,
3227
key,
33-
value: value || key,
34-
required,
3528
type
3629
};
3730
const newProps = [...selectedComponent.props, newProp];
@@ -101,12 +94,6 @@ export const deleteProp = (state: ApplicationStateInt, propId: number) => {
10194
};
10295
};
10396

104-
export const handleClose = (state: ApplicationStateInt, status: string) => ({
105-
...state,
106-
errorOpen: status,
107-
successOpen: status
108-
});
109-
11097
export const toggleCodeEdit = (state: ApplicationStateInt) => ({
11198
...state,
11299
codeReadOnly: !state.codeReadOnly
@@ -125,6 +112,7 @@ export const toggleNative = (state: ApplicationStateInt) => {
125112
}
126113
const components = cloneDeep(initialApplicationState.components);
127114
const app = components.find((e: ComponentInt) => e.id === 1);
115+
128116
app.position.width = !state.native ? 500 : 1200;
129117
app.position.height = !state.native ? 850 : 800;
130118
app.changed = true;
@@ -137,65 +125,65 @@ export const toggleNative = (state: ApplicationStateInt) => {
137125
};
138126
};
139127

140-
export const updateChildrenSort = (
141-
state: ApplicationStateInt,
142-
{ newSortValues }: { newSortValues: any }
143-
) => {
144-
const modifiedChildrenArray: any = cloneDeep(
145-
state.focusComponent.childrenArray
146-
);
147-
148-
for (let i = 0; i < modifiedChildrenArray.length; i += 1) {
149-
const currChild = modifiedChildrenArray[i];
150-
const currChildId = currChild.childId;
151-
const newValueObj = newSortValues.find(
152-
(n: any) => n.childId === currChildId
153-
);
154-
const newSortValue = newValueObj.childSort;
155-
console.log(
156-
` currChildId ${currChildId} currSortValue: ${currChild.childSort} newSortValue:${newSortValue}`
157-
);
158-
currChild.childSort = newSortValue;
159-
}
160-
161-
const modifiedComponent = state.components.find(
162-
(comp: ComponentInt) => comp.id === state.focusComponent.id
163-
);
164-
modifiedComponent.childrenArray = modifiedChildrenArray;
165-
166-
const modifiedComponentsArray = state.components.filter(
167-
(comp: ComponentInt) => comp.id !== state.focusComponent.id
168-
);
169-
modifiedComponentsArray.push(modifiedComponent);
170-
171-
return {
172-
...state,
173-
components: modifiedComponentsArray,
174-
focusComponent: modifiedComponent
175-
};
176-
};
128+
//CURRENTLY doesn't DO ANYTHING
129+
130+
// export const updateChildrenSort = (
131+
// state: ApplicationStateInt,
132+
// { newSortValues }: { newSortValues: any }
133+
// ) => {
134+
// const modifiedChildrenArray: any = cloneDeep(
135+
// state.focusComponent.childrenArray
136+
// );
137+
138+
// for (let i = 0; i < modifiedChildrenArray.length; i += 1) {
139+
// const currChild = modifiedChildrenArray[i];
140+
// const currChildId = currChild.childId;
141+
// const newValueObj = newSortValues.find(
142+
// (n: any) => n.childId === currChildId
143+
// );
144+
// const newSortValue = newValueObj.childSort;
145+
// console.log(
146+
// ` currChildId ${currChildId} currSortValue: ${currChild.childSort} newSortValue:${newSortValue}`
147+
// );
148+
// currChild.childSort = newSortValue;
149+
// }
150+
151+
// const modifiedComponent = state.components.find(
152+
// (comp: ComponentInt) => comp.id === state.focusComponent.id
153+
// );
154+
// modifiedComponent.childrenArray = modifiedChildrenArray;
155+
156+
// const modifiedComponentsArray = state.components.filter(
157+
// (comp: ComponentInt) => comp.id !== state.focusComponent.id
158+
// );
159+
// modifiedComponentsArray.push(modifiedComponent);
160+
161+
// return {
162+
// ...state,
163+
// components: modifiedComponentsArray,
164+
// focusComponent: modifiedComponent
165+
// };
166+
// };
177167

178168
export const updateCode = (
179169
state: ApplicationStateInt,
180170
{ componentId, code }: { componentId: number; code: string }
181171
) => {
182-
//creates a deep copy of the components
183-
const componentsCopy = cloneDeep(state.components);
184-
const focusCompCopy = cloneDeep(state.focusComponent);
185-
if (focusCompCopy.id === componentId) {
186-
focusCompCopy.code = code;
187-
focusCompCopy.changed = false;
172+
//creates a deep copy of the state
173+
const stateCopy: ApplicationStateInt = cloneDeep(state);
174+
175+
if (stateCopy.focusComponent.id === componentId) {
176+
stateCopy.focusComponent.code = code;
177+
stateCopy.focusComponent.changed = false;
188178
}
189-
componentsCopy.forEach((comp: ComponentInt) => {
179+
stateCopy.components.forEach((comp: ComponentInt) => {
190180
if (comp.id === componentId) {
191181
comp.code = code;
192182
comp.changed = false;
193183
}
194184
});
195185
return {
196-
...state,
197-
components: componentsCopy,
198-
focusComponent: focusCompCopy
186+
...stateCopy
199187
};
200188
};
201189

0 commit comments

Comments
 (0)