diff --git a/packages/checkbox/index.tsx b/packages/checkbox/index.tsx index cd349c4a2..287fd22f5 100644 --- a/packages/checkbox/index.tsx +++ b/packages/checkbox/index.tsx @@ -33,6 +33,7 @@ export interface CheckboxProps extends Ripple.InjectedProps) => void; initRipple: (surface: HTMLDivElement, activator?: HTMLInputElement) => void; @@ -171,6 +172,7 @@ export class Checkbox extends React.Component { /* eslint-enable no-unused-vars */ disabled, nativeControlId, + name, ...otherProps } = this.props; @@ -186,6 +188,7 @@ export class Checkbox extends React.Component { checked={this.state.checked} disabled={disabled} aria-checked={this.state['aria-checked']} + name={name} onChange={this.onChange} rippleActivatorRef={this.inputElement} /> diff --git a/test/unit/checkbox/index.test.tsx b/test/unit/checkbox/index.test.tsx index 2f122334f..c08c0d362 100644 --- a/test/unit/checkbox/index.test.tsx +++ b/test/unit/checkbox/index.test.tsx @@ -134,6 +134,11 @@ test('passes nativeControlId to NativeControl through props', () => { assert.equal(wrapper.childAt(0).props().id, 'test-id'); }); +test('passes name to NativeControl through props', () => { + const wrapper = shallow(); + assert.equal(wrapper.childAt(0).props().name, 'test-name'); +}); + test('calls foundation.handleChange in native control props.onChange', () => { const wrapper = shallow(); const nativeControl = wrapper.childAt(0);