Skip to content

Commit 3ea7a25

Browse files
ibeeliotibeeliot
authored
Merge pull request #66 from ibeeliot/master
Added 5 reducer tests for the left side panel
2 parents 2fd5bef + 393b774 commit 3ea7a25

File tree

4 files changed

+97
-46
lines changed

4 files changed

+97
-46
lines changed

‎src/components/bottom/AddChildProps.tsx

Lines changed: 2 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ class AddChildProps extends Component<ChildPropsTypes> {
2525
return (
2626
<span key={`span-${idx}`}>
2727
<input
28-
type='checkbox'
28+
type="checkbox"
2929
id={`${prop}checkbox-${prop.key}`}
3030
name={`${prop}checkbox-${prop.key}`}
3131
key={`checkbox-${idx}`}
@@ -41,30 +41,6 @@ class AddChildProps extends Component<ChildPropsTypes> {
4141
);
4242
});
4343

44-
// const arrayPropsAvailable = [];
45-
// // IIFE : so that it runs without needing to be invoked
46-
// (() => {
47-
// focusComponent.props.map(prop => {
48-
// // console.log('this is component Name from props array', prop.key);
49-
// arrayPropsAvailable.push(
50-
// <span>
51-
// <input
52-
// type='checkbox'
53-
// id={`${prop}checkbox-${prop.key}`}
54-
// name={`${prop}checkbox-${prop.key}`}
55-
// />
56-
// <label
57-
// className={`labelForPropsToAddToChild`}
58-
// for={`${prop}checkbox-${prop.key}`}
59-
// >
60-
// {prop.key}
61-
// </label>
62-
// </span>
63-
// );
64-
// });
65-
// })();
66-
// console.log('this is the array of props available', arrayPropsAvailable);
67-
6844
return (
6945
<div>
7046
<MaterialTable
@@ -86,7 +62,7 @@ class AddChildProps extends Component<ChildPropsTypes> {
8662
}
8763
]}
8864
data={focusComponent.childrenArray}
89-
title='Add Your Child Props Here!'
65+
title="Add Your Child Props Here!"
9066
/>
9167

9268
{/* BUTTON FUNCTIONALITY PENDING

‎src/reducers/__tests__/leftReducers.test.ts

Lines changed: 84 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,6 @@ describe('Left reducers', () => {
1010
// redefine the default state before each reducer test
1111
beforeEach(() => {
1212
state = initialApplicationState;
13-
state.components.push(testComponent);
1413
});
1514

1615
describe('toggleComponentClass', () => {
@@ -70,6 +69,7 @@ describe('Left reducers', () => {
7069
type: types.CHANGE_FOCUS_COMPONENT,
7170
payload: { title: 'TEST' }
7271
};
72+
state.components.push(testComponent);
7373
const newState = reducers.changeFocusComponent(state, action.payload);
7474
// expecting new payload of "title" to the payload we just created
7575
expect(newState.focusComponent.title).toEqual(action.payload.title);
@@ -90,22 +90,87 @@ describe('Left reducers', () => {
9090
});
9191

9292
// TEST DELETE CHILD: test child should be deleted from local state components array
93-
// describe('deleteChild reducer', () => {
94-
// it('should delete test component', () => {
95-
// // CHANGE FOCUS COMPONENT FIRST
96-
// // const action = {
97-
// // type: types.CHANGE_FOCUS_COMPONENT,
98-
// // payload: { title: 'TEST' }
99-
// // };
100-
// // const newState = reducers.changeFocusComponent(state, action.payload);
101-
// const prevState = cloneDeep(state);
102-
// console.log('this is prevState', prevState)
103-
// const newState = reducers.deleteChild(state, {});
104-
// // expecting new payload of "title" to the payload we just created
105-
// expect(prevState.focusComponent.childrenArray).not.toEqual(
106-
// newState.focusComponent.childrenArray
107-
// );
108-
// });
109-
});
93+
describe('deleteChild reducer', () => {
94+
it('should delete test component', () => {
95+
// grab initial copy of current state
96+
const prevState = cloneDeep(state);
97+
// push into it the test component
98+
prevState.focusComponent.childrenArray.push(testComponent);
99+
100+
//take new state and delete from it the testComponent
101+
const newState = reducers.deleteChild(state, {});
102+
103+
// expecting previous state not to equal new state after deletion of test component
104+
expect(prevState.focusComponent.childrenArray).not.toEqual(
105+
newState.focusComponent.childrenArray
106+
);
107+
});
108+
});
109+
// TEST ADD COMPONENT: adds component to the global state components array
110+
describe('addComponent reducer', () => {
111+
it('return the state as it was if an empty title', () => {
112+
const action = {
113+
type: types.ADD_COMPONENT,
114+
payload: { title: '' }
115+
};
116+
// grab initial copy of current state
117+
const prevState = cloneDeep(state);
110118

111-
// NEXT TEST
119+
//take new state and add testComponent
120+
const newState = reducers.addComponent(state, action.payload);
121+
// expecting previous state not to equal new state after deletion of test component
122+
expect(prevState.components[2]).toEqual(newState.components[2]);
123+
});
124+
125+
it('should add test component', () => {
126+
const action = {
127+
type: types.ADD_COMPONENT,
128+
payload: { title: 'TESTCOMPONENT' }
129+
};
130+
// grab initial copy of current state
131+
const prevState = cloneDeep(state);
132+
133+
//take new state and add testComponent
134+
const newState = reducers.addComponent(prevState, action.payload);
135+
136+
// expecting previous state not to equal new state after deletion of test component
137+
expect(prevState.components[2]).not.toEqual(newState.components[2]);
138+
});
139+
});
140+
// TEST ADD CHILD: adds child to the focus component's childrenArray
141+
describe('addChild reducer', () => {
142+
it('return focus component childrenarray with test react component', () => {
143+
const actionReact = {
144+
type: types.ADD_CHILD,
145+
payload: {
146+
title: 'TestREACTComponent',
147+
childType: 'COMP'
148+
}
149+
};
150+
151+
state = reducers.addComponent(state, { title: 'TestREACTComponent' });
152+
const newState = reducers.addChild(state, actionReact.payload);
153+
154+
expect(state.focusComponent.childrenArray).not.toEqual(
155+
newState.focusComponent.childrenArray
156+
);
157+
});
158+
159+
it('return focus component childrenarray with test HTML component', () => {
160+
const actionHTML = {
161+
type: types.ADD_CHILD,
162+
payload: {
163+
title: 'TestHTMLComponent',
164+
childType: 'HTML'
165+
}
166+
};
167+
168+
state = reducers.addComponent(state, { title: 'TestHTMLComponent' });
169+
const newState = reducers.addChild(state, actionHTML.payload);
170+
171+
expect(state.focusComponent.childrenArray).not.toEqual(
172+
newState.focusComponent.childrenArray
173+
);
174+
});
175+
});
176+
});

‎src/utils/componentRender.util.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -179,7 +179,7 @@ const componentRender = (
179179
180180
/* Replace "any" with stricter types to reflect your usage*/
181181
interface Props {
182-
${props.map(prop => `${prop.key}: ${typeSwitcher(prop.type)};\n`)}
182+
${props.map(prop => `${prop.key}: ${typeSwitcher(prop.type)}\n`)}
183183
};
184184
185185
${

‎src/utils/htmlElements.util.ts

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -94,6 +94,16 @@ const HTMLelements: htmlElementsInt = {
9494
width: 50,
9595
height: 50,
9696
attributes: ['className', 'id', 'href']
97+
},
98+
HTML: {
99+
width: 50,
100+
height: 50,
101+
attributes: ['className', 'id']
102+
},
103+
NATIVE: {
104+
width: 50,
105+
height: 50,
106+
attributes: ['className', 'id']
97107
}
98108
};
99109

0 commit comments

Comments
 (0)