baloise / design-system

The Baloise Design System consists of reusable components and a clearly defined visual style, that can be assembled together to build any number of applications.
https://design.baloise.dev
Apache License 2.0
100 stars 27 forks source link

:bug: fix(bal-date): Tabnavigation get stuck in the date input #1167

Closed NoraKurzbein closed 12 months ago

NoraKurzbein commented 1 year ago

Current Behavior

We habe a bal-date Component and two buttons (today and yesterday) to set a value on the date we do this by the following code when you click "today":

this.form?.controls[this.CLAIM_DATE].setValue(BalDateUtil.format.date.iso(new Date()));

When we set this and then navigate with tab to the date input we get stuck there. So with tab navigation you are not able to continue, if you click on the date input field, then you can use the tab navigation again.

Expected Behavior

It should be possible to navigate with tab without clicking into the field.

Steps to Reproduce

Create a button that sets the value of bal-date to today with the code above. Button must be before the bal-date, navigate just with the keyboard, use Enter to select the button and set the value, use tabnavigation to focus on the date input field, try to continue with the tab navigation

Version

14.3.0

Browsers

Chrome

Device

Desktop

Code Reproduction URL

No response

Additional Information

No response

Code of Conduct

hirsch88 commented 12 months ago

/cib

github-actions[bot] commented 12 months ago

Branch fix/issue-1167 created!