+
{ this.btnGrpRef = btnGrpRef; }} role={btnRole === 'radio' ? 'radiogroup' : 'group'} className={buttonGroupClassNames}>
{allButtons}
);
diff --git a/packages/terra-button-group/src/ButtonGroupButton.jsx b/packages/terra-button-group/src/ButtonGroupButton.jsx
index 414b7e354e1..8128589f476 100644
--- a/packages/terra-button-group/src/ButtonGroupButton.jsx
+++ b/packages/terra-button-group/src/ButtonGroupButton.jsx
@@ -88,7 +88,7 @@ class ButtonGroupButton extends React.Component {
handleKeyUp(event) {
// Apply focus styles for keyboard navigation.
// The onFocus event doesn't get triggered in some browsers, hence, the focus state needs to be managed here.
- if (event.nativeEvent.keyCode === KeyCode.KEY_TAB) {
+ if (event.nativeEvent.keyCode === KeyCode.KEY_TAB || event.nativeEvent.keyCode === KeyCode.KEY_LEFT || event.nativeEvent.keyCode === KeyCode.KEY_RIGHT) {
this.setState({ focused: true });
this.shouldShowFocus = true;
}
@@ -140,6 +140,7 @@ class ButtonGroupButton extends React.Component {
onFocus={this.handleFocus}
variant={Button.Opts.Variants.NEUTRAL}
className={buttonClassName}
+ data-terra-button-group-button
/>
);
}
diff --git a/packages/terra-button-group/tests/jest/ButtonGroup.test.jsx b/packages/terra-button-group/tests/jest/ButtonGroup.test.jsx
index 0a3c8743575..da35fd01693 100644
--- a/packages/terra-button-group/tests/jest/ButtonGroup.test.jsx
+++ b/packages/terra-button-group/tests/jest/ButtonGroup.test.jsx
@@ -84,6 +84,28 @@ it('should select a button', () => {
expect(buttonGroup).toMatchSnapshot();
});
+it('should apply correct role for multiSelect button group', () => {
+ const onChange = jest.fn();
+ const buttonGroup = shallow((
+
+ {button1}
+ {button2}
+
+ ));
+ expect(buttonGroup).toMatchSnapshot();
+});
+
+it('should apply correct role for single select button group', () => {
+ const onChange = jest.fn();
+ const buttonGroup = shallow((
+
+ {button1}
+ {button2}
+
+ ));
+ expect(buttonGroup).toMatchSnapshot();
+});
+
it('correctly applies the theme context className', () => {
const buttonGroup = mount(
diff --git a/packages/terra-button-group/tests/jest/__snapshots__/ButtonGroup.test.jsx.snap b/packages/terra-button-group/tests/jest/__snapshots__/ButtonGroup.test.jsx.snap
index 6d981b6cd5d..f35b6eb830a 100644
--- a/packages/terra-button-group/tests/jest/__snapshots__/ButtonGroup.test.jsx.snap
+++ b/packages/terra-button-group/tests/jest/__snapshots__/ButtonGroup.test.jsx.snap
@@ -10,10 +10,12 @@ exports[`correctly applies the theme context className 1`] = `
>