Skip to content

Commit 1429ba4

Browse files
Rachel YooRachel Yoo
Rachel Yoo
authored and
Rachel Yoo
committed
added tests for hooks left panel
1 parent 6842d2d commit 1429ba4

File tree

4 files changed

+226
-66
lines changed

4 files changed

+226
-66
lines changed

‎src/containers/LeftPanel/TestMenu/HooksTestMenu.jsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -41,13 +41,13 @@ const HooksTestMenu = ({ dispatchToHooksTestCase }) => {
4141
id={styles.right}
4242
style={{ display: 'flex', flexWrap: 'wrap', justifyContent: 'center' }}
4343
>
44-
<button data-testid='hookRenderButton' onClick={handleAddHookRender}>
44+
<button className='hookRenderButton' onClick={handleAddHookRender}>
4545
Hook: Rendering
4646
</button>
47-
<button data-testid='hookUpdatesButton' onClick={handleAddHookUpdates}>
47+
<button className='hookUpdatesButton' onClick={handleAddHookUpdates}>
4848
Hook: Updates
4949
</button>
50-
<button data-testid='contextButton' onClick={handleAddContexts}>
50+
<button className='contextButton' onClick={handleAddContexts}>
5151
Context
5252
</button>
5353
</div>

‎src/containers/LeftPanel/__tests__/hooksLeftPanel.test.js‎

Lines changed: 89 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
import React from 'react';
2+
import HooksTestCase from '../TestCase/HooksTestCase';
3+
import HookUpdates from '../HookUpdates/HookUpdates';
4+
import HookRender from '../HookRender/HookRender';
5+
import { GlobalContext } from '../../../context/globalReducer';
6+
import { TestFileModalContext } from '../../../context/testFileModalReducer';
7+
import { HooksTestCaseContext } from '../../../context/hooksTestCaseReducer';
8+
9+
import '@testing-library/jest-dom/extend-expect';
10+
import { mount } from 'enzyme';
11+
import { configure } from 'enzyme';
12+
import Adapter from 'enzyme-adapter-react-16';
13+
14+
configure({ adapter: new Adapter() });
15+
16+
let wrapper,
17+
globalM,
18+
dispatchToGlobal,
19+
hooksTestCase,
20+
dispatchToHooksTestCase,
21+
testFileModal,
22+
dispatchToTestFileModal;
23+
24+
beforeEach(() => {
25+
globalM = {
26+
url: null,
27+
isProjectLoaded: false,
28+
fileTree: null,
29+
componentName: '',
30+
isFileDirectoryOpen: true,
31+
rightPanelDisplay: 'browserView',
32+
displayedFileCode: '',
33+
isFolderOpen: {},
34+
isFileHighlighted: '',
35+
projectFilePath: '',
36+
filePathMap: {},
37+
};
38+
dispatchToGlobal = jest.fn();
39+
40+
testFileModal = {
41+
isTestModalOpen: true,
42+
};
43+
dispatchToTestFileModal = jest.fn();
44+
45+
hooksTestCase = {
46+
hooksTestStatement: '',
47+
hooksStatements: [],
48+
hasHooks: 0,
49+
};
50+
dispatchToHooksTestCase = jest.fn();
51+
52+
wrapper = mount(
53+
<GlobalContext.Provider value={[globalM, dispatchToGlobal]}>
54+
<TestFileModalContext.Provider value={[testFileModal, dispatchToTestFileModal]}>
55+
<HooksTestCaseContext.Provider value={[hooksTestCase, dispatchToHooksTestCase]}>
56+
<HooksTestCase />
57+
</HooksTestCaseContext.Provider>
58+
</TestFileModalContext.Provider>
59+
</GlobalContext.Provider>
60+
);
61+
62+
jest.resetModules();
63+
});
64+
65+
describe('testing hooks left panel', () => {
66+
it('renders the hooks test case with corresponding buttons', () => {
67+
expect(wrapper.text()).toContain('Context');
68+
expect(wrapper.text()).toContain('Hook: Updates');
69+
expect(wrapper.text()).toContain('Hook: Rendering');
70+
});
71+
72+
it('hook: render button dispatches to test case', () => {
73+
const renderBtn = wrapper.find('.hookRenderButton');
74+
renderBtn.simulate('click');
75+
expect(dispatchToHooksTestCase).toHaveBeenCalled();
76+
});
77+
78+
it('hook: updates button dispatches to test case', () => {
79+
const updatesBtn = wrapper.find('.hookUpdatesButton');
80+
updatesBtn.simulate('click');
81+
expect(dispatchToHooksTestCase).toHaveBeenCalled();
82+
});
83+
84+
it('context button dispatches to test case', () => {
85+
const contextBtn = wrapper.find('.contextButton');
86+
contextBtn.simulate('click');
87+
expect(dispatchToHooksTestCase).toHaveBeenCalled();
88+
});
89+
});

‎src/containers/LeftPanel/__tests__/testFileModal.test.js‎

Lines changed: 130 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,130 @@
1+
import React from 'react';
2+
import ReactModal from 'react-modal';
3+
import TestFile from '../TestFile/TestFile';
4+
import { GlobalContext } from '../../../context/globalReducer';
5+
import { TestFileModalContext } from '../../../context/testFileModalReducer';
6+
import { HooksTestCaseContext } from '../../../context/hooksTestCaseReducer';
7+
import { ReduxTestCaseContext } from '../../../context/reduxTestCaseReducer';
8+
import { TestCaseContext } from '../../../context/testCaseReducer';
9+
import { EndpointTestCaseContext } from '../../../context/endpointTestCaseReducer';
10+
11+
import '@testing-library/jest-dom/extend-expect';
12+
import { mount } from 'enzyme';
13+
import { configure } from 'enzyme';
14+
import Adapter from 'enzyme-adapter-react-16';
15+
16+
configure({ adapter: new Adapter() });
17+
18+
let wrapper,
19+
globalM,
20+
dispatchToGlobal,
21+
hooksTestCase,
22+
dispatchToHooksTestCase,
23+
testFileModal,
24+
dispatchToTestFileModal,
25+
reduxTestCaseState,
26+
dispatchToReduxTestCase,
27+
testCase,
28+
dispatchToTestCase,
29+
endpointTestCaseState,
30+
dispatchToEndpointTestCase;
31+
32+
beforeEach(() => {
33+
globalM = {
34+
url: null,
35+
isProjectLoaded: false,
36+
fileTree: null,
37+
componentName: '',
38+
isFileDirectoryOpen: true,
39+
rightPanelDisplay: 'browserView',
40+
displayedFileCode: '',
41+
isFolderOpen: {},
42+
isFileHighlighted: '',
43+
projectFilePath: '',
44+
filePathMap: {},
45+
};
46+
dispatchToGlobal = jest.fn();
47+
48+
testFileModal = {
49+
isTestModalOpen: true,
50+
};
51+
dispatchToTestFileModal = jest.fn();
52+
53+
testCase = {
54+
testStatement: '',
55+
statements: [
56+
{
57+
id: 0,
58+
type: 'render',
59+
componentName: '',
60+
filePath: '',
61+
props: [],
62+
hasProp: false,
63+
},
64+
{
65+
id: 1,
66+
type: 'assertion',
67+
queryVariant: '',
68+
querySelector: '',
69+
queryValue: '',
70+
isNot: false,
71+
matcherType: '',
72+
matcherValue: '',
73+
suggestions: [],
74+
},
75+
],
76+
};
77+
dispatchToTestCase = jest.fn();
78+
79+
hooksTestCase = {
80+
hooksTestStatement: '',
81+
hooksStatements: [],
82+
hasHooks: 0,
83+
};
84+
dispatchToHooksTestCase = jest.fn();
85+
86+
reduxTestCaseState = {
87+
reduxTestStatement: '',
88+
reduxStatements: [],
89+
hasRedux: 0,
90+
};
91+
dispatchToReduxTestCase = jest.fn();
92+
93+
endpointTestCaseState = {
94+
endpointTestStatement: '',
95+
endpointStatements: [],
96+
hasEndpoint: 0,
97+
};
98+
dispatchToEndpointTestCase = jest.fn();
99+
100+
wrapper = mount(
101+
<GlobalContext.Provider value={[globalM, dispatchToGlobal]}>
102+
<TestFileModalContext.Provider value={[testFileModal, dispatchToTestFileModal]}>
103+
<HooksTestCaseContext.Provider value={[hooksTestCase, dispatchToHooksTestCase]}>
104+
<ReduxTestCaseContext.Provider value={[reduxTestCaseState, dispatchToReduxTestCase]}>
105+
<TestCaseContext.Provider value={[testCase, dispatchToTestCase]}>
106+
<EndpointTestCaseContext.Provider
107+
value={[endpointTestCaseState, dispatchToEndpointTestCase]}
108+
>
109+
<TestFile />
110+
</EndpointTestCaseContext.Provider>
111+
</TestCaseContext.Provider>
112+
</ReduxTestCaseContext.Provider>
113+
</HooksTestCaseContext.Provider>
114+
</TestFileModalContext.Provider>
115+
</GlobalContext.Provider>
116+
);
117+
118+
jest.resetModules();
119+
});
120+
121+
it('app opens test file modal', () => {
122+
let testFileModal = wrapper.find(ReactModal);
123+
expect(testFileModal.length).toEqual(1);
124+
expect(testFileModal.prop('isOpen')).toEqual(true);
125+
expect(testFileModal.text()).toContain('What would you like to test?');
126+
expect(testFileModal.text()).toContain('React');
127+
expect(testFileModal.text()).toContain('Redux');
128+
expect(testFileModal.text()).toContain('Hooks/Context');
129+
expect(testFileModal.text()).toContain('Endpoint');
130+
});

‎src/containers/ProjectLoader/__tests__/projectLoader.test.js‎

Lines changed: 4 additions & 63 deletions
Original file line numberDiff line numberDiff line change
@@ -1,66 +1,7 @@
1-
import React from 'react';
2-
import { GlobalContext } from '../../../context/globalReducer';
3-
import BrowserView from '../../RightPanel/BrowserView/BrowserView';
4-
import EditorView from '../../RightPanel/EditorView/EditorView';
5-
import RightPanel from '../../RightPanel/RightPanel';
1+
it('displays browser view of when URL is correctly inputted', () => {});
62

7-
import { render, fireEvent } from '@testing-library/react';
8-
import { build, fake } from 'test-data-bot';
9-
import '@testing-library/jest-dom/extend-expect';
3+
it(`omitting 'www' from URL still displays browser view`, () => {});
104

11-
import Enzyme from 'enzyme';
12-
import { shallow, mount } from 'enzyme';
13-
import ReactDOM from 'react-dom';
14-
import { act } from 'react-dom/test-utils';
5+
it('displays file directory of project that is loaded', () => {});
156

16-
import { configure } from 'enzyme';
17-
import Adapter from 'enzyme-adapter-react-16';
18-
import { exportAllDeclaration } from '@babel/types';
19-
20-
Enzume.configure({ adapter: new Adapter() });
21-
22-
let globalM = {
23-
url: null,
24-
isProjectLoaded: false,
25-
fileTree: null,
26-
componentName: '',
27-
isFileDirectoryOpen: true,
28-
rightPanelDisplay: 'browserView',
29-
displayedFileCode: '',
30-
isFolderOpen: {},
31-
isFileHighlighted: '',
32-
projectFilePath: '',
33-
filePathMap: {},
34-
};
35-
36-
let dispatchToGlobal = jest.fn();
37-
38-
let wrapper = mount(
39-
<GlobalContext.Provider value={[globalM, dispatchToGlobal]}>
40-
<ProjectLoader />
41-
<Navbar>
42-
<FileDirectory />
43-
</Navbar>
44-
<RightPanel>
45-
<BrowserView />
46-
<EditorView />
47-
</RightPanel>
48-
</GlobalContext.Provider>
49-
);
50-
51-
test('displays browser view of when URL is correctly inputted', () => {
52-
globalM.url !== null;
53-
const browserViewComponent = wrapper.find(<BrowserView />);
54-
expect(browserViewComponent).toMatchSnapshot();
55-
});
56-
57-
test(`omitting 'www' from URL still displays browser view`, () => {
58-
const addHttps = wrapper.find(addHttps());
59-
addHttps(!url.startsWith('www'));
60-
const browserViewComponent = wrapper.find(<BrowserView />);
61-
expect(browserViewComponent).toMatchSnapshot();
62-
});
63-
64-
test('displays file directory of project that is loaded', () => {});
65-
66-
test(`displays project's name on the top of the file directory view`, () => {});
7+
it(`displays project's name on the top of the file directory view`, () => {});

0 commit comments

Comments
 (0)