diff --git a/packages/patternfly-4/react-core/src/components/Button/Button.test.tsx b/packages/patternfly-4/react-core/src/components/Button/Button.test.tsx
index 115e917e3ec..9354c078c35 100644
--- a/packages/patternfly-4/react-core/src/components/Button/Button.test.tsx
+++ b/packages/patternfly-4/react-core/src/components/Button/Button.test.tsx
@@ -78,3 +78,9 @@ test('aria-disabled is set to true and tabIndex to -1 if component is not a butt
);
expect(view).toMatchSnapshot();
});
+
+test('setting tab index through props', () => {
+ const view = mount()
+ console.log(view.find('button').debug())
+ expect(view.find('button').props().tabIndex).toBe(0)
+})
\ No newline at end of file
diff --git a/packages/patternfly-4/react-core/src/components/Button/Button.tsx b/packages/patternfly-4/react-core/src/components/Button/Button.tsx
index 9af794411fe..675c8a089eb 100644
--- a/packages/patternfly-4/react-core/src/components/Button/Button.tsx
+++ b/packages/patternfly-4/react-core/src/components/Button/Button.tsx
@@ -46,6 +46,8 @@ export interface ButtonProps extends React.HTMLProps {
'aria-label'?: string;
/** Icon for the button if variant is a link */
icon?: React.ReactNode | null;
+ /** Set button tab index unless component is not a button and is disabled */
+ tabIndex?: number;
}
const Button: React.FunctionComponent = ({
@@ -64,6 +66,7 @@ const Button: React.FunctionComponent = ({
icon = null,
ouiaContext = null,
ouiaId = null,
+ tabIndex = null as number,
...props
}: ButtonProps & InjectedOuiaProps) => {
const Component = component as any;
@@ -85,7 +88,7 @@ const Button: React.FunctionComponent = ({
className
)}
disabled={isButtonElement ? isDisabled : null}
- tabIndex={isDisabled && !isButtonElement ? -1 : null}
+ tabIndex={isDisabled && !isButtonElement ? -1 : tabIndex}
type={isButtonElement ? type : null}
{...(ouiaContext.isOuia && {
'data-ouia-component-type': 'Button',