diff options
author | Maximilian Hils <git@maximilianhils.com> | 2017-07-20 18:01:53 +0200 |
---|---|---|
committer | GitHub <noreply@github.com> | 2017-07-20 18:01:53 +0200 |
commit | e1d0bc6de975c377cb42022209ea1b5bce515433 (patch) | |
tree | 4f52c967b9312dd0c08e3f88f51b93dd2849dffe /web/src/js/__tests__ | |
parent | 8526ca9e175af4a903348c39928535ae10f7543d (diff) | |
parent | cb73658dd43e01bdedd84aa31601887b19c106ca (diff) | |
download | mitmproxy-e1d0bc6de975c377cb42022209ea1b5bce515433.tar.gz mitmproxy-e1d0bc6de975c377cb42022209ea1b5bce515433.tar.bz2 mitmproxy-e1d0bc6de975c377cb42022209ea1b5bce515433.zip |
Merge pull request #2430 from MatthewShao/mitmweb-options
[web] [WIP] Mitmweb options
Diffstat (limited to 'web/src/js/__tests__')
7 files changed, 394 insertions, 81 deletions
diff --git a/web/src/js/__tests__/components/Modal/OptionSpec.js b/web/src/js/__tests__/components/Modal/OptionSpec.js new file mode 100644 index 00000000..a275aee6 --- /dev/null +++ b/web/src/js/__tests__/components/Modal/OptionSpec.js @@ -0,0 +1,99 @@ +import React from 'react' +import renderer from 'react-test-renderer' +import { Options, ChoicesOption } from '../../../components/Modal/Option' + +describe('BooleanOption Component', () => { + let BooleanOption = Options['bool'], + onChangeFn = jest.fn(), + booleanOption = renderer.create( + <BooleanOption value={true} onChange={onChangeFn}/> + ), + tree = booleanOption.toJSON() + + it('should render correctly', () => { + expect(tree).toMatchSnapshot() + }) + + it('should handle onChange', () => { + let input = tree.children[0].children[0], + mockEvent = { target: { checked: true }} + input.props.onChange(mockEvent) + expect(onChangeFn).toBeCalledWith(mockEvent.target.checked) + }) +}) + +describe('StringOption Component', () => { + let StringOption = Options['str'], + onChangeFn = jest.fn(), + stringOption = renderer.create( + <StringOption value="foo" onChange={onChangeFn}/> + ), + tree = stringOption.toJSON() + + it('should render correctly', () => { + expect(tree).toMatchSnapshot() + }) + + it('should handle onChange', () => { + let mockEvent = { target: { value: 'bar' }} + tree.props.onChange(mockEvent) + expect(onChangeFn).toBeCalledWith(mockEvent.target.value) + }) + +}) + +describe('NumberOption Component', () => { + let NumberOption = Options['int'], + onChangeFn = jest.fn(), + numberOption = renderer.create( + <NumberOption value={1} onChange={onChangeFn}/> + ), + tree = numberOption.toJSON() + + it('should render correctly', () => { + expect(tree).toMatchSnapshot() + }) + + it('should handle onChange', () => { + let mockEvent = {target: { value: '2'}} + tree.props.onChange(mockEvent) + expect(onChangeFn).toBeCalledWith(2) + }) +}) + +describe('ChoiceOption Component', () => { + let onChangeFn = jest.fn(), + choiceOption = renderer.create( + <ChoicesOption value='a' choices={['a', 'b', 'c']} onChange={onChangeFn}/> + ), + tree = choiceOption.toJSON() + + it('should render correctly', () => { + expect(tree).toMatchSnapshot() + }) + + it('should handle onChange', () => { + let mockEvent = { target: {value: 'b'} } + tree.props.onChange(mockEvent) + expect(onChangeFn).toBeCalledWith(mockEvent.target.value) + }) +}) + +describe('StringOption Component', () => { + let onChangeFn = jest.fn(), + StringSequenceOption = Options['sequence of str'], + stringSequenceOption = renderer.create( + <StringSequenceOption value={['a', 'b']} onChange={onChangeFn}/> + ), + tree = stringSequenceOption.toJSON() + + it('should render correctly', () => { + expect(tree).toMatchSnapshot() + }) + + it('should handle onChange', () => { + let mockEvent = { target: {value: 'a\nb\nc\n'}} + tree.props.onChange(mockEvent) + expect(onChangeFn).toBeCalledWith(['a', 'b', 'c', '']) + }) +}) diff --git a/web/src/js/__tests__/components/Modal/__snapshots__/ModalSpec.js.snap b/web/src/js/__tests__/components/Modal/__snapshots__/ModalSpec.js.snap index af587ae4..bfd855bd 100644 --- a/web/src/js/__tests__/components/Modal/__snapshots__/ModalSpec.js.snap +++ b/web/src/js/__tests__/components/Modal/__snapshots__/ModalSpec.js.snap @@ -47,94 +47,173 @@ exports[`Modal Component should render correctly 2`] = ` className="modal-body" > <div - className="menu-entry" + className="form-horizontal" > - <label> - booleanOption - <input - checked={false} - onChange={[Function]} - title="foo" - type="checkbox" - /> - </label> - </div> - <div - className="menu-entry" - > - <label - htmlFor="" + <div + className="form-group" > - choiceOption - <select - name="choiceOption" - onChange={[Function]} - selected="b" - title="foo" + <div + className="col-xs-6" > - <option - value="a" + <label + htmlFor="booleanOption" > - - a - - </option> - <option - value="b" + booleanOption + </label> + <div + className="help-block small" > - - b - - </option> - <option - value="c" + foo + </div> + </div> + <div + className="col-xs-6" + > + <div + className="" > - - c - - </option> - </select> - </label> - </div> - <div - className="menu-entry" - > - <label> - intOption - <input - onChange={[Function]} - onKeyDown={[Function]} - title="foo" - type="number" - value={1} - /> - </label> - </div> - <div - className="menu-entry" - > - <label> - strOption - <input - onChange={[Function]} - onKeyDown={[Function]} - title="foo" - type="text" - value="str content" - /> - </label> + <div + className="checkbox" + > + <label> + <input + checked={false} + name="booleanOption" + onChange={[Function]} + onKeyDown={[Function]} + type="checkbox" + /> + Enable + </label> + </div> + </div> + </div> + </div> + <div + className="form-group" + > + <div + className="col-xs-6" + > + <label + htmlFor="choiceOption" + > + choiceOption + </label> + <div + className="help-block small" + > + foo + </div> + </div> + <div + className="col-xs-6" + > + <div + className="" + > + <select + className="form-control" + name="choiceOption" + onChange={[Function]} + onKeyDown={[Function]} + selected="b" + > + <option + value="a" + > + a + </option> + <option + value="b" + > + b + </option> + <option + value="c" + > + c + </option> + </select> + </div> + </div> + </div> + <div + className="form-group" + > + <div + className="col-xs-6" + > + <label + htmlFor="intOption" + > + intOption + </label> + <div + className="help-block small" + > + foo + </div> + </div> + <div + className="col-xs-6" + > + <div + className="" + > + <input + className="form-control" + name="intOption" + onChange={[Function]} + onKeyDown={[Function]} + type="number" + value={1} + /> + </div> + </div> + </div> + <div + className="form-group" + > + <div + className="col-xs-6" + > + <label + htmlFor="strOption" + > + strOption + </label> + <div + className="help-block small" + > + foo + </div> + </div> + <div + className="col-xs-6" + > + <div + className="has-error" + > + <input + className="form-control" + name="strOption" + onChange={[Function]} + onKeyDown={[Function]} + type="text" + value="str content" + /> + </div> + <div + className="small text-danger" + /> + </div> + </div> </div> </div> <div className="modal-footer" - > - <button - className="btn btn-primary" - type="button" - > - Save Changes - </button> - </div> + /> </div> </div> </div> diff --git a/web/src/js/__tests__/components/Modal/__snapshots__/OptionSpec.js.snap b/web/src/js/__tests__/components/Modal/__snapshots__/OptionSpec.js.snap new file mode 100644 index 00000000..514e0eb5 --- /dev/null +++ b/web/src/js/__tests__/components/Modal/__snapshots__/OptionSpec.js.snap @@ -0,0 +1,64 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`BooleanOption Component should render correctly 1`] = ` +<div + className="checkbox" +> + <label> + <input + checked={true} + onChange={[Function]} + type="checkbox" + /> + Enable + </label> +</div> +`; + +exports[`ChoiceOption Component should render correctly 1`] = ` +<select + onChange={[Function]} + selected="a" +> + <option + value="a" + > + a + </option> + <option + value="b" + > + b + </option> + <option + value="c" + > + c + </option> +</select> +`; + +exports[`NumberOption Component should render correctly 1`] = ` +<input + onChange={[Function]} + type="number" + value={1} +/> +`; + +exports[`StringOption Component should render correctly 1`] = ` +<input + onChange={[Function]} + type="text" + value="foo" +/> +`; + +exports[`StringOption Component should render correctly 2`] = ` +<textarea + onChange={[Function]} + rows={2} + value="a +b" +/> +`; diff --git a/web/src/js/__tests__/ducks/optionsSpec.js b/web/src/js/__tests__/ducks/optionsSpec.js index 62019715..0925fcc1 100644 --- a/web/src/js/__tests__/ducks/optionsSpec.js +++ b/web/src/js/__tests__/ducks/optionsSpec.js @@ -1,6 +1,9 @@ -jest.mock('../../utils') - import reduceOptions, * as OptionsActions from '../../ducks/options' +import configureStore from 'redux-mock-store' +import thunk from 'redux-thunk' +import * as OptionsEditorActions from '../../ducks/ui/optionsEditor' + +const mockStore = configureStore([ thunk ]) describe('option reducer', () => { it('should return initial state', () => { @@ -18,8 +21,31 @@ describe('option reducer', () => { }) }) +let store = mockStore() + describe('option actions', () => { + it('should be possible to update option', () => { - expect(reduceOptions(undefined, OptionsActions.update())).toEqual({}) + let mockResponse = { status: 200 }, + promise = Promise.resolve(mockResponse) + global.fetch = r => { return promise } + store.dispatch(OptionsActions.update('foo', 'bar')) + expect(store.getActions()).toEqual([ + { type: OptionsEditorActions.OPTION_UPDATE_START, option: 'foo', value: 'bar'} + ]) + store.clearActions() + }) +}) + +describe('sendUpdate', () => { + + it('should handle error', () => { + let mockResponse = { status: 400, text: p => Promise.resolve('error') }, + promise = Promise.resolve(mockResponse) + global.fetch = r => { return promise } + OptionsActions.pureSendUpdate('bar', 'error') + expect(store.getActions()).toEqual([ + { type: OptionsEditorActions.OPTION_UPDATE_SUCCESS, option: 'foo'} + ]) }) }) diff --git a/web/src/js/__tests__/ducks/tutils.js b/web/src/js/__tests__/ducks/tutils.js index a3e9c168..22240448 100644 --- a/web/src/js/__tests__/ducks/tutils.js +++ b/web/src/js/__tests__/ducks/tutils.js @@ -35,6 +35,12 @@ export function TStore(){ }, modal: { activeModal: undefined + }, + optionsEditor: { + booleanOption: { isUpdating: true, error: false }, + strOption: { error: true }, + intOption: {}, + choiceOption: {}, } }, settings: { diff --git a/web/src/js/__tests__/ducks/ui/keyboardSpec.js b/web/src/js/__tests__/ducks/ui/keyboardSpec.js index 500733cb..cf17943f 100644 --- a/web/src/js/__tests__/ducks/ui/keyboardSpec.js +++ b/web/src/js/__tests__/ducks/ui/keyboardSpec.js @@ -6,6 +6,7 @@ import reduceFlows from '../../../ducks/flows' import reduceUI from '../../../ducks/ui/index' import * as flowsActions from '../../../ducks/flows' import * as UIActions from '../../../ducks/ui/flow' +import * as modalActions from '../../../ducks/ui/modal' import configureStore from 'redux-mock-store' import thunk from 'redux-thunk' import { fetchApi } from '../../../utils' @@ -154,4 +155,10 @@ describe('onKeyDown', () => { expect(fetchApi).not.toBeCalled() }) + it('should close modal', () => { + store.getState().ui.modal.activeModal = true + store.dispatch(createKeyEvent(Key.ESC)) + expect(store.getActions()).toEqual([ {type: modalActions.HIDE_MODAL} ]) + }) + }) diff --git a/web/src/js/__tests__/ducks/ui/optionEditorSpec.js b/web/src/js/__tests__/ducks/ui/optionEditorSpec.js new file mode 100644 index 00000000..df9161a4 --- /dev/null +++ b/web/src/js/__tests__/ducks/ui/optionEditorSpec.js @@ -0,0 +1,32 @@ +import reduceOptionsEditor, * as optionsEditorActions from '../../../ducks/ui/optionsEditor' +import { HIDE_MODAL } from '../../../ducks/ui/modal' + +describe('optionsEditor reducer', () => { + + it('should return initial state', () => { + expect(reduceOptionsEditor(undefined, {})).toEqual({}) + }) + + let state = undefined + it('should handle option update start', () => { + state = reduceOptionsEditor(undefined, optionsEditorActions.startUpdate('foo', 'bar')) + expect(state).toEqual({ foo: {error: false, isUpdating: true, value: 'bar'}}) + }) + + it('should handle option update success', () => { + expect(reduceOptionsEditor(state, optionsEditorActions.updateSuccess('foo'))).toEqual({foo: undefined}) + }) + + it('should handle option update error', () => { + state = reduceOptionsEditor(state, optionsEditorActions.updateError('foo', 'errorMsg')) + expect(state).toEqual({ foo: {error: 'errorMsg', isUpdating: false, value: 'bar'}}) + // boolean type + state = reduceOptionsEditor(undefined, optionsEditorActions.startUpdate('foo', true)) + state = reduceOptionsEditor(state, optionsEditorActions.updateError('foo', 'errorMsg')) + expect(state).toEqual({ foo: {error: 'errorMsg', isUpdating: false, value: false}}) + }) + + it('should handle hide modal', () => { + expect(reduceOptionsEditor(undefined, {type: HIDE_MODAL})).toEqual({}) + }) +}) |