diff options
author | Matthew Shao <me@matshao.com> | 2017-05-28 19:20:09 +0800 |
---|---|---|
committer | Matthew Shao <me@matshao.com> | 2017-05-28 19:20:09 +0800 |
commit | 9c90d13149ec2db5bbe6db3b076bf3da78e0cac9 (patch) | |
tree | bbd7040bcf058fab4ba3aadd91a1f0ffc7e37175 | |
parent | fbaa842a462bbe8360d68b24eed9e7b2d7d3c7dc (diff) | |
download | mitmproxy-9c90d13149ec2db5bbe6db3b076bf3da78e0cac9.tar.gz mitmproxy-9c90d13149ec2db5bbe6db3b076bf3da78e0cac9.tar.bz2 mitmproxy-9c90d13149ec2db5bbe6db3b076bf3da78e0cac9.zip |
[web] Add tests for js/components/Header/MainMenu.js
3 files changed, 117 insertions, 1 deletions
diff --git a/web/src/js/__tests__/components/Header/MainMenuSpec.js b/web/src/js/__tests__/components/Header/MainMenuSpec.js new file mode 100644 index 00000000..927166fd --- /dev/null +++ b/web/src/js/__tests__/components/Header/MainMenuSpec.js @@ -0,0 +1,26 @@ +jest.mock('../../../ducks/settings') + +import React from 'react' +import renderer from 'react-test-renderer' +import MainMenu, { setIntercept } from '../../../components/Header/MainMenu' +import { Provider } from 'react-redux' +import { update as updateSettings } from '../../../ducks/settings' +import { TStore } from '../../ducks/tutils' + +describe('MainMenu Component', () => { + let store = TStore() + + it('should render and connect to state', () => { + let provider = renderer.create( + <Provider store={store}> + <MainMenu/> + </Provider>), + tree = provider.toJSON() + expect(tree).toMatchSnapshot() + }) + + it('should handle change on interceptInput', () => { + setIntercept('foo') + expect(updateSettings).toBeCalledWith({ intercept: 'foo' }) + }) +}) diff --git a/web/src/js/__tests__/components/Header/__snapshots__/MainMenuSpec.js.snap b/web/src/js/__tests__/components/Header/__snapshots__/MainMenuSpec.js.snap new file mode 100644 index 00000000..b9735aa5 --- /dev/null +++ b/web/src/js/__tests__/components/Header/__snapshots__/MainMenuSpec.js.snap @@ -0,0 +1,86 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`MainMenu Component should render and connect to state 1`] = ` +<div + className="menu-main" +> + <div + className="filter-input input-group" + > + <span + className="input-group-addon" + > + <i + className="fa fa-fw fa-search" + style={ + Object { + "color": "black", + } + } + /> + </span> + <input + className="form-control" + onBlur={[Function]} + onChange={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + placeholder="Search" + type="text" + value="~u foo" + /> + </div> + <div + className="filter-input input-group" + > + <span + className="input-group-addon" + > + <i + className="fa fa-fw fa-tag" + style={ + Object { + "color": "hsl(48, 100%, 50%)", + } + } + /> + </span> + <input + className="form-control" + onBlur={[Function]} + onChange={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + placeholder="Highlight" + type="text" + value="~a bar" + /> + </div> + <div + className="filter-input input-group" + > + <span + className="input-group-addon" + > + <i + className="fa fa-fw fa-pause" + style={ + Object { + "color": "hsl(208, 56%, 53%)", + } + } + /> + </span> + <input + className="form-control" + onBlur={[Function]} + onChange={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + placeholder="Intercept" + type="text" + value="" + /> + </div> +</div> +`; diff --git a/web/src/js/components/Header/MainMenu.jsx b/web/src/js/components/Header/MainMenu.jsx index 465649d7..162ed0f5 100644 --- a/web/src/js/components/Header/MainMenu.jsx +++ b/web/src/js/components/Header/MainMenu.jsx @@ -17,6 +17,10 @@ export default function MainMenu() { ) } +export function setIntercept(intercept) { + updateSettings({ intercept }) +} + const InterceptInput = connect( state => ({ value: state.settings.intercept || '', @@ -24,7 +28,7 @@ const InterceptInput = connect( type: 'pause', color: 'hsl(208, 56%, 53%)' }), - { onChange: intercept => updateSettings({ intercept }) } + { onChange: setIntercept } )(FilterInput); const FlowFilterInput = connect( |