Focus in Web Chat UI is inconsistent when using tab key vs. down arrow key.

Is it an issue related to Adaptive Cards?

No.

What is the PWD impact?

From customer-raised issue in IcM #429138170

It's difficult to know when to use the Tab key versus the arrow down key; when a new message appears, the focus moves to different locations within the chatbot. The normal functionality is that arrow down moves to the next line and tab moves to the next interactive element. Screenreader, JAWS is being used while reproducing the issue.

What browsers and screen readers do this issue affect?

No response

Are there any code-based customization done to Web Chat?

No, I am using Web Chat without any customizations except "styleOptions".

What version of Web Chat are you using?

Latest production

Which area does this issue affect?

Focus management

What is the public URL for the website?

https://www.nationwide.com/insurance-claims/

How to reproduce the issue?

1. Interact with bot to get a new message
2. Test differences between using tab key vs. down arrow key

What do you expect?

The expected functionality is that the arrow down moves to the next line and the tab moves to the next interactive element.

What actually happened?

The issue we encounter is that its difficult to know when to use the Tab key versus the arrow down key; when a new message appears, the focus moves to different locations within the chatbot.

Do you have any screenshots or recordings to repro the issue?

No response

Did you find any DOM elements that might have caused the issue?

No response

MAS reference

No response

WCAG reference

No response

WAI-ARIA reference

No response

Adaptive Card JSON

No response

Additional context

Adding additional information to issue:
After choosing a button, the screen reader announces 'shift-tab 2 or 3 times to get back to the message', but focus never left the button that was clicked, meaning the user needs to use the arrow down key rather than shift-tab