Skip to content

Commit a00b618

Browse files
ahsan-raoahsan-rao
committed
uncommenting all tests to test now with server running
1 parent 69cad30 commit a00b618

File tree

2 files changed

+262
-262
lines changed

2 files changed

+262
-262
lines changed

‎__tests__/enzyme.test.tsx

Lines changed: 144 additions & 144 deletions
Original file line numberDiff line numberDiff line change
@@ -1,157 +1,157 @@
1-
// import { shallow} from 'enzyme';
2-
// import React from 'react';
3-
// import { DndProvider } from 'react-dnd';
4-
// import { HTML5Backend } from 'react-dnd-html5-backend';
5-
// import StateContext from '../app/src/context/context';
6-
// import initialState from '../app/src/context/initialState';
7-
// import MainContainer from '../app/src/containers/MainContainer';
8-
// import BottomPanel from '../app/src/components/bottom/BottomPanel';
9-
// import BottomTabs from '../app/src/components/bottom/BottomTabs';
10-
// import CanvasContainer from '../app/src/components/main/CanvasContainer';
11-
// import Canvas from '../app/src/components/main/Canvas';
12-
// import HTMLPanel from '../app/src/components/left/HTMLPanel';
13-
// import HTMLItem from '../app/src/components/left/HTMLItem';
14-
// import LeftContainer from '../app/src/containers/LeftContainer';
15-
// import AppContainer from '../app/src/containers/AppContainer';
16-
// import NavBar from '../app/src/components/top/NavBar';
17-
// import MenuItem from '@material-ui/core/MenuItem';
18-
// import Tab from '@material-ui/core/Tab';
19-
// import LoginButton from '../app/src/components/right/LoginButton';
1+
import { shallow} from 'enzyme';
2+
import React from 'react';
3+
import { DndProvider } from 'react-dnd';
4+
import { HTML5Backend } from 'react-dnd-html5-backend';
5+
import StateContext from '../app/src/context/context';
6+
import initialState from '../app/src/context/initialState';
7+
import MainContainer from '../app/src/containers/MainContainer';
8+
import BottomPanel from '../app/src/components/bottom/BottomPanel';
9+
import BottomTabs from '../app/src/components/bottom/BottomTabs';
10+
import CanvasContainer from '../app/src/components/main/CanvasContainer';
11+
import Canvas from '../app/src/components/main/Canvas';
12+
import HTMLPanel from '../app/src/components/left/HTMLPanel';
13+
import HTMLItem from '../app/src/components/left/HTMLItem';
14+
import LeftContainer from '../app/src/containers/LeftContainer';
15+
import AppContainer from '../app/src/containers/AppContainer';
16+
import NavBar from '../app/src/components/top/NavBar';
17+
import MenuItem from '@material-ui/core/MenuItem';
18+
import Tab from '@material-ui/core/Tab';
19+
import LoginButton from '../app/src/components/right/LoginButton';
2020

21-
// /* 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 */
21+
/* 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 */
2222

23-
// describe('Test the CanvasContainer component', () => {
24-
// const target = shallow(<CanvasContainer />);
25-
// it('Matches snapshot', () => {
26-
// expect(target).toMatchSnapshot();
27-
// });
28-
// // test if Canvas component is rendered
29-
// it('Contains Canvas component', () => {
30-
// expect(target.contains(<Canvas />)).toBe(true);
31-
// });
32-
// });
23+
describe('Test the CanvasContainer component', () => {
24+
const target = shallow(<CanvasContainer />);
25+
it('Matches snapshot', () => {
26+
expect(target).toMatchSnapshot();
27+
});
28+
// test if Canvas component is rendered
29+
it('Contains Canvas component', () => {
30+
expect(target.contains(<Canvas />)).toBe(true);
31+
});
32+
});
3333

34-
// describe('Test the MainContainer component', () => {
35-
// const target = shallow(<MainContainer />);
36-
// // test it canvas container is rendered
37-
// it('Contains CanvasContainer component', () => {
38-
// expect(target.contains(<CanvasContainer />)).toBe(true);
39-
// });
40-
// // test if bottom panel is rendered
41-
// it('Contains BottomPanel component', () => {
42-
// expect(target.contains(<BottomPanel />)).toBe(true);
43-
// });
44-
// });
34+
describe('Test the MainContainer component', () => {
35+
const target = shallow(<MainContainer />);
36+
// test it canvas container is rendered
37+
it('Contains CanvasContainer component', () => {
38+
expect(target.contains(<CanvasContainer />)).toBe(true);
39+
});
40+
// test if bottom panel is rendered
41+
it('Contains BottomPanel component', () => {
42+
expect(target.contains(<BottomPanel />)).toBe(true);
43+
});
44+
});
4545

46-
// describe('Test the BottomTabs component', () => {
47-
// const target = shallow(<BottomTabs />);
48-
// it('Matches snapshot', () => {
49-
// expect(target).toMatchSnapshot();
50-
// });
51-
// // test if bottom tab has a Code Preview and a Component Tree button
52-
// it('Has two tabs called "Code Preview" and "Component Tree" ', () => {
53-
// expect(target.find(Tab)).toHaveLength(2);
54-
// expect(target.find(Tab).at(0).prop('label')).toEqual('Code Preview');
55-
// expect(target.find(Tab).at(1).prop('label')).toEqual('Component Tree');
56-
// });
57-
// // test if the dropdown menu exists on the bottom tab
58-
// it('Has a dropdown selection menu for Classic React, Gatsby.js, and Next.js', () => {
59-
// expect(target.find(MenuItem)).toHaveLength(3);
60-
// expect(target.find(MenuItem).at(0).text()).toEqual('Classic React');
61-
// expect(target.find(MenuItem).at(1).text()).toEqual('Gatsby.js');
62-
// expect(target.find(MenuItem).at(2).text()).toEqual('Next.js');
63-
// });
64-
// });
65-
// // test the drag and drop component in the left panel
66-
// describe('Test HTMLPanel Component', () => {
67-
// const target = shallow(
68-
// <DndProvider backend={HTML5Backend}>
69-
// <StateContext.Provider value={initialState}>
70-
// <HTMLPanel />
71-
// </StateContext.Provider>
72-
// </DndProvider>
73-
// );
46+
describe('Test the BottomTabs component', () => {
47+
const target = shallow(<BottomTabs />);
48+
it('Matches snapshot', () => {
49+
expect(target).toMatchSnapshot();
50+
});
51+
// test if bottom tab has a Code Preview and a Component Tree button
52+
it('Has two tabs called "Code Preview" and "Component Tree" ', () => {
53+
expect(target.find(Tab)).toHaveLength(2);
54+
expect(target.find(Tab).at(0).prop('label')).toEqual('Code Preview');
55+
expect(target.find(Tab).at(1).prop('label')).toEqual('Component Tree');
56+
});
57+
// test if the dropdown menu exists on the bottom tab
58+
it('Has a dropdown selection menu for Classic React, Gatsby.js, and Next.js', () => {
59+
expect(target.find(MenuItem)).toHaveLength(3);
60+
expect(target.find(MenuItem).at(0).text()).toEqual('Classic React');
61+
expect(target.find(MenuItem).at(1).text()).toEqual('Gatsby.js');
62+
expect(target.find(MenuItem).at(2).text()).toEqual('Next.js');
63+
});
64+
});
65+
// test the drag and drop component in the left panel
66+
describe('Test HTMLPanel Component', () => {
67+
const target = shallow(
68+
<DndProvider backend={HTML5Backend}>
69+
<StateContext.Provider value={initialState}>
70+
<HTMLPanel />
71+
</StateContext.Provider>
72+
</DndProvider>
73+
);
7474

75-
// const props = {
76-
// name: 'abc',
77-
// key:'html-abc',
78-
// id:1,
79-
// Icon:'icon',
80-
// handleDelete: jest.fn()
81-
// };
75+
const props = {
76+
name: 'abc',
77+
key:'html-abc',
78+
id:1,
79+
Icon:'icon',
80+
handleDelete: jest.fn()
81+
};
8282

83-
// it('Matches snapshot', () => {
84-
// expect(target).toMatchSnapshot();
85-
// });
86-
// // test if there are html items such as form, img, etc. on the left side
87-
// it('Should render HTMLItem', () => {
88-
// expect(target.find(<HTMLItem {...props} />)).toBeDefined();
89-
// });
83+
it('Matches snapshot', () => {
84+
expect(target).toMatchSnapshot();
85+
});
86+
// test if there are html items such as form, img, etc. on the left side
87+
it('Should render HTMLItem', () => {
88+
expect(target.find(<HTMLItem {...props} />)).toBeDefined();
89+
});
9090

91-
// // testing for AppContainer
92-
// describe('Test AppContainer container', () => {
93-
// const target = shallow(<AppContainer />);
91+
// testing for AppContainer
92+
describe('Test AppContainer container', () => {
93+
const target = shallow(<AppContainer />);
9494

95-
// const props = {
96-
// setTheme: jest.fn(),
97-
// isThemeLight: jest.fn(),
98-
// };
95+
const props = {
96+
setTheme: jest.fn(),
97+
isThemeLight: jest.fn(),
98+
};
9999

100-
// // testing if there is a NavBar
101-
// it('Should render NavBar', () => {
102-
// expect(
103-
// target.find(
104-
// <NavBar setTheme={props.setTheme} isThemeLight={props.isThemeLight} />
105-
// )
106-
// ).toBeDefined();
107-
// });
108-
// // testing for a RightContainer
109-
// it('Should render RightContainer', () => {
110-
// expect(
111-
// target.find(RightContainer)
112-
// ).toHaveLength(1);
113-
// });
100+
// testing if there is a NavBar
101+
it('Should render NavBar', () => {
102+
expect(
103+
target.find(
104+
<NavBar setTheme={props.setTheme} isThemeLight={props.isThemeLight} />
105+
)
106+
).toBeDefined();
107+
});
108+
// testing for a RightContainer
109+
it('Should render RightContainer', () => {
110+
expect(
111+
target.find(RightContainer)
112+
).toHaveLength(1);
113+
});
114114

115-
// // testing for NavBar component
116-
// describe('Test NavBar component', () => {
117-
// const props = {
118-
// setTheme: jest.fn(),
119-
// isThemeLight: jest.fn(),
120-
// };
121-
// const target = shallow (
122-
// <NavBar setTheme={props.setTheme} isThemeLight={props.isThemeLight} />
123-
// );
124-
// // testing for 4 generic buttons in NavBar
125-
// it('Should render 2 buttons: "Clear Canvas", "Dark Mode"', () => {
126-
// expect(target.find('.navbarButton')).toHaveLength(2);
127-
// expect(
128-
// target
129-
// .find('.navbarButton')
130-
// .at(0)
131-
// .text(),
132-
// ).toEqual('Clear Canvas');
133-
// expect(
134-
// target
135-
// .find('.navbarButton')
136-
// .at(1)
137-
// .text(),
138-
// ).toEqual('Dark Mode');
115+
// testing for NavBar component
116+
describe('Test NavBar component', () => {
117+
const props = {
118+
setTheme: jest.fn(),
119+
isThemeLight: jest.fn(),
120+
};
121+
const target = shallow (
122+
<NavBar setTheme={props.setTheme} isThemeLight={props.isThemeLight} />
123+
);
124+
// testing for 4 generic buttons in NavBar
125+
it('Should render 2 buttons: "Clear Canvas", "Dark Mode"', () => {
126+
expect(target.find('.navbarButton')).toHaveLength(2);
127+
expect(
128+
target
129+
.find('.navbarButton')
130+
.at(0)
131+
.text(),
132+
).toEqual('Clear Canvas');
133+
expect(
134+
target
135+
.find('.navbarButton')
136+
.at(1)
137+
.text(),
138+
).toEqual('Dark Mode');
139139

140-
// });
140+
});
141141

142-
// it('Should render "Login" button', () => {
143-
// const wrapper = shallow( <LoginButton />);
144-
// expect(wrapper).toHaveLength(1);
145-
// expect(
146-
// wrapper
147-
// .find('.navbarButton')
148-
// ).toHaveLength(1);
149-
// });
142+
it('Should render "Login" button', () => {
143+
const wrapper = shallow( <LoginButton />);
144+
expect(wrapper).toHaveLength(1);
145+
expect(
146+
wrapper
147+
.find('.navbarButton')
148+
).toHaveLength(1);
149+
});
150150

151-
// describe('Test LeftContainer container', () => {
152-
// const target = shallow(<LeftContainer />);
153-
// // test for the HTML panel (with all the html elements) on the left panel
154-
// it('Should render HTMLPanel', () => {
155-
// expect(target.find(<HTMLPanel />)).toBeDefined();
156-
// });
157-
// });
151+
describe('Test LeftContainer container', () => {
152+
const target = shallow(<LeftContainer />);
153+
// test for the HTML panel (with all the html elements) on the left panel
154+
it('Should render HTMLPanel', () => {
155+
expect(target.find(<HTMLPanel />)).toBeDefined();
156+
});
157+
});

0 commit comments

Comments
 (0)