diff --git a/packages/Form/Input/radio/src/Radio.js b/packages/Form/Input/radio/src/Radio.js index 3bcb0a511..5e7182d16 100644 --- a/packages/Form/Input/radio/src/Radio.js +++ b/packages/Form/Input/radio/src/Radio.js @@ -1,26 +1,32 @@ import React from 'react'; import PropTypes from 'prop-types'; -import { InputList, InputConstants as Constants, withInput, omit } from '@axa-fr/react-toolkit-form-core'; +import { + InputConstants as Constants, + InputList, + omit, + withInput, +} from '@axa-fr/react-toolkit-form-core'; import RadioItem from './RadioItem'; import RadioModes from './RadioModes'; const omitProperties = omit(['mode', 'helpMessage', 'id']); const Radio = ({ - isVisible, - className, - disabled, - options, - value, - name, - onBlur, - onFocus, - readOnly, - classModifier, - children, - onChange, - ...otherProps - }) => options.map(option => { + isVisible, + className, + disabled, + options, + value, + name, + onBlur, + onFocus, + readOnly, + classModifier, + children, + onChange, + ...otherProps +}) => + options.map(option => { const isChecked = option.value === value; return ( e => { + onChange: ({ onChange, name }) => ({ value, id }) => { onChange({ - value: e.value, - name, + value, id, + name, }); }, }; diff --git a/packages/Form/Input/radio/src/RadioInput.spec.js b/packages/Form/Input/radio/src/RadioInput.spec.js index c8fdd5d8d..13d848792 100644 --- a/packages/Form/Input/radio/src/RadioInput.spec.js +++ b/packages/Form/Input/radio/src/RadioInput.spec.js @@ -1,21 +1,65 @@ import React from 'react'; import renderer from 'react-test-renderer'; +import ReactTestUtils, { act } from 'react-dom/test-utils'; +import ReactDOM from 'react-dom'; import RadioInput from './RadioInput'; -describe('', () => { - it('renders DateInput correctly', () => { +describe('', () => { + let container; + + beforeEach(() => { + container = document.createElement('div'); + document.body.appendChild(container); + }); + + afterEach(() => { + document.body.removeChild(container); + container = null; + }); + + it('renders RadioInput correctly', () => { const tree = renderer .create( {}} /> ) .toJSON(); expect(tree).toMatchSnapshot(); }); + + it('should send the id, name and value on change', () => { + const onChange = jest.fn(); + const Element = ( + + ); + + act(() => { + ReactDOM.render(Element, container); + ReactTestUtils.Simulate.change(container.querySelector('#option1_id')); + }); + + expect(onChange.mock.calls).toHaveLength(1); + expect(onChange.mock.calls[0][0]).toEqual({ + id: 'option1_id', + name: 'name', + value: '1', + }); + }); }); diff --git a/packages/Form/Input/radio/src/__snapshots__/RadioInput.spec.js.snap b/packages/Form/Input/radio/src/__snapshots__/RadioInput.spec.js.snap index ccacf39de..40355c4c8 100644 --- a/packages/Form/Input/radio/src/__snapshots__/RadioInput.spec.js.snap +++ b/packages/Form/Input/radio/src/__snapshots__/RadioInput.spec.js.snap @@ -1,6 +1,6 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[` renders DateInput correctly 1`] = ` +exports[` renders RadioInput correctly 1`] = `
@@ -11,11 +11,70 @@ exports[` renders DateInput correctly 1`] = ` className="af-form__group-label" htmlFor="" > - Image * + Label
+ > +
+ + +
+
+ + +
+
`;