diff --git a/src/App.js b/src/App.js index 6973202..8b662da 100644 --- a/src/App.js +++ b/src/App.js @@ -185,13 +185,12 @@ class App extends Component {

File Field

{ magicFieldValue = newValue; } } - isOpen={true} value={fileFieldValue} />
diff --git a/src/components/fields/FieldGroup.js b/src/components/fields/FieldGroup.js index 3633a72..943721f 100644 --- a/src/components/fields/FieldGroup.js +++ b/src/components/fields/FieldGroup.js @@ -11,7 +11,6 @@ import {Message} from './messages/Message'; import {messageObjectFactory} from './messages/messageObjectFactory'; import {fieldsetCheckboxHandler} from './field-group-change-handlers/fieldsetCheckboxHandler'; import {MagicFieldGroup} from './magic-select/MagicFieldGroup'; -import {FileFieldGroup} from './file-field/FileFieldGroup'; /** * Represents one configField -- wrapper, label and input. @@ -32,7 +31,7 @@ export const FieldGroup = (props) => { function idAttrForHelpElement() { return ariaDescribedbyAttr(props.id, props.help); } - + /** * Based on type, render the field. diff --git a/src/components/fields/file-field/FileFieldGroup.js b/src/components/fields/file-field/FileFieldGroup.js index 059ea64..e134a55 100644 --- a/src/components/fields/file-field/FileFieldGroup.js +++ b/src/components/fields/file-field/FileFieldGroup.js @@ -2,7 +2,6 @@ import React from 'react'; import classNames from 'classnames'; import {RenderGroup} from '../../RenderGroup'; import {Message} from '../messages/Message'; -import {FieldGroup} from '../FieldGroup'; import {FileSelect} from './FileSelect'; import {fieldGroupPropTypes} from '../propTypes'; @@ -18,13 +17,8 @@ export class FileFieldGroup extends React.PureComponent { */ constructor(props) { super(props); - this.state = { - isOpen: props.isOpen, - }; this.onChange = this.onChange.bind(this); this.onSelect = this.onSelect.bind(this); - this.onInputFocus = this.onInputFocus.bind(this); - this.onInputBlur = this.onInputBlur.bind(this); } /** @@ -35,27 +29,12 @@ export class FileFieldGroup extends React.PureComponent { this.props.onValueChange(newValue); } - /** - * Handle when the field gets focus - */ - onInputFocus() { - this.setState({isOpen: true}); - } - - /** - * Handle when the field is blurred - */ - onInputBlur() { - this.setState({isOpen: false}); - } - /** * Handle when the option is chosen * @param {String|number} value */ onSelect(value) { this.props.onValueChange(value); - this.setState({isOpen: false}); } /** @@ -72,23 +51,20 @@ export class FileFieldGroup extends React.PureComponent { ) } > + {this.props.message.message && + + } - {this.props.message.message && - - } - + { expect(component.toJSON()).toMatchSnapshot(); }); + it('matches snapshot with message', () => { + const component = renderer.create( + + ); + expect(component.toJSON()).toMatchSnapshot(); + }); + describe('Inner input', () => { it('Has inner input', () => { const component = mount( @@ -40,6 +56,24 @@ describe('FileFieldGroup component', () => { }); }); - + describe('Value', () => { + it('Passes updated value properly through the onChange handler', () => { + let updatedValue = null; + const component = mount( + { + updatedValue = newValue; + }} + value={'file1.jpg'} + /> + ); + + component.instance().onChange('file2.jpg'); + expect(updatedValue).toEqual('file2.jpg'); + }); + }); }); \ No newline at end of file diff --git a/src/components/fields/file-field/FileSelect.js b/src/components/fields/file-field/FileSelect.js index 84ce265..0f5eb51 100644 --- a/src/components/fields/file-field/FileSelect.js +++ b/src/components/fields/file-field/FileSelect.js @@ -19,8 +19,6 @@ export class FileSelect extends React.PureComponent { return ( +
+ Hi Roy +
+ + +`; + +exports[`FileFieldGroup component matches snapshot with no message 1`] = ` +
+
`; diff --git a/src/components/fields/file-field/__snapshots__/FileSelect.test.js.snap b/src/components/fields/file-field/__snapshots__/FileSelect.test.js.snap index 27beaa8..b9f28ea 100644 --- a/src/components/fields/file-field/__snapshots__/FileSelect.test.js.snap +++ b/src/components/fields/file-field/__snapshots__/FileSelect.test.js.snap @@ -5,8 +5,6 @@ exports[`FileSelect component Matches snapshot 1`] = ` accept="image/*" id="file-1" onChange={[Function]} - onSelect={undefined} type="file" - value={undefined} /> `;