diff --git a/recipe-server/client/control/components/forms/CheckBox.js b/recipe-server/client/control/components/forms/CheckBox.js index 9b450680..1ba2a831 100644 --- a/recipe-server/client/control/components/forms/CheckBox.js +++ b/recipe-server/client/control/components/forms/CheckBox.js @@ -10,19 +10,13 @@ export default class LabeledCheckbox extends LabeledInput { } getElementProps() { - const { value } = this.props; - - return { - checked: value, - }; + return { checked: this.props.value }; } getLabelProps() { - const { value } = this.props; - return { role: 'checkbox', - 'aria-checked': value, + 'aria-checked': this.props.value, }; } } diff --git a/recipe-server/client/control/components/forms/LabeledInput.js b/recipe-server/client/control/components/forms/LabeledInput.js index 0a6a94ad..2b418e86 100644 --- a/recipe-server/client/control/components/forms/LabeledInput.js +++ b/recipe-server/client/control/components/forms/LabeledInput.js @@ -10,13 +10,11 @@ import React from 'react'; export default class LabeledInput extends React.Component { static propTypes = { children: PropTypes.node, - element: PropTypes.node, onChange: PropTypes.func, }; static defaultProps = { children: null, - element: undefined, onChange: () => {}, } diff --git a/recipe-server/client/control/tests/components/recipes/test_SwitchBox.js b/recipe-server/client/control/tests/components/recipes/test_LabeledInput.js similarity index 66% rename from recipe-server/client/control/tests/components/recipes/test_SwitchBox.js rename to recipe-server/client/control/tests/components/recipes/test_LabeledInput.js index e4118f3c..43c918c8 100644 --- a/recipe-server/client/control/tests/components/recipes/test_SwitchBox.js +++ b/recipe-server/client/control/tests/components/recipes/test_LabeledInput.js @@ -1,17 +1,25 @@ import { Switch } from 'antd'; +import autobind from 'autobind-decorator'; import React from 'react'; import { mount } from 'enzyme'; -import SwitchBox from 'control/components/forms/SwitchBox'; +import LabeledInput from 'control/components/forms/LabeledInput'; -describe('', () => { +@autobind +class TestInput extends LabeledInput { + getElement() { return Switch; } + getElementProps() { return { checked: this.props.value, testProp: 123 }; } + handleLabelClick() { this.props.onChange(); } +} + +describe('', () => { const props = { children: null, onChange: () => {}, value: null, }; - const factory = (customProps = {}) => mount(); + const factory = (customProps = {}) => mount(); it('should work', () => { expect(factory).not.toThrow(); @@ -43,8 +51,14 @@ describe('', () => { }); }); - describe('the Switch', () => { - it('should inherit the `value` as a `checked` prop', () => { + describe('getElementProps', () => { + it('should pass properties into the internal component', () => { + const wrapper = factory(); + expect(wrapper.find(Switch).length).toBe(1); + expect(wrapper.find(Switch).props().testProp).toBe(123); + }); + + it('should pass dynamic props (`value` as a `checked` prop)', () => { const wrapper = factory({ value: true }); expect(wrapper.find(Switch).length).toBe(1); expect(wrapper.find(Switch).props().checked).toBe(true);