Accessibility and field focus order
Unanswered
Transvaal lion posted this in #help-forum
Transvaal lionOP
I have a form (NextJS using react-hook-form) that takes an address using a Loqate component, and our accessibility testers are reporting an issue with the focus resetting to the top of the page after selecting an address.
We have ensured that all fields are present in the DOM and use the inert attribute when they don't need to be focused. We've also implemented some code that sets the focus to the next field upon address selection but it's still resetting to the top of the page briefly before that fires.
Is there anyone here with some accessibility knowledge around screen-readers that can point me in the right direction?
When a user enters an address, the tabbing still resets to the top of the page. It then tabs to the edit address option. Please see attached video.
We have ensured that all fields are present in the DOM and use the inert attribute when they don't need to be focused. We've also implemented some code that sets the focus to the next field upon address selection but it's still resetting to the top of the page briefly before that fires.
Is there anyone here with some accessibility knowledge around screen-readers that can point me in the right direction?