fd-button focus not visible for input type buttons

[yoganjan]

Describe the bug When input tag is used as a button (Type button and submit) , focus outline is not visible for fd-button classes when the button is in focus. This is failing the accessibility norms.

Is this issue related to a specific component? Yes . Button

What version of the Fundamental Library Styles are you using?

0.29

What offering/product do you work on? Any pressing ship or release dates we should be aware of?

Successfactors

What front-end framework are you implementing in, e.g., Angular, React, etc.?

Juic

Expected behavior Focus outline should be visible

Screenshots When Button tag is used as Button , when the button is in focus

When Input tag is used as button , when the button is in focus

Desktop (please complete the following information):

• OS: Windows
• Browser - All

[droshev]

@yoganjan You are right and this is due to the button design. We rely on the pseudo-selectors :before and :after, which are not supported by input. Can't you use the html element button instead?

[yoganjan]

Hi @droshev , We are trying to apply fundamental styles to all the legacy pages. We will not be able to modify for the all pages as that will have impact on automation scripts as well.

is there any other way we can fix these issue using css ?

Thanks, Yoganjan