Botframework-webchat: The keyboard opens automatically after clicking on a suggestion action button on Webchat with version 4.7.1 or 4.7.0 or latest

[didaskein]

Issue with webchat version : 4.7.1 or 4.7.0 or latest
On Mobile Anroid (Samsung S9), or Iphone (8)

Sample of the issue (the keyboard open automatically after clicking on a suggestion action button)
Before clicking on the suggest action button "Oui"

After clicking on the suggest action button "Oui", we have the keyboard opened.

The code we are using in order to send the suggested action

When you click on the button, we need to have the value clicked on the right of the transcript of the conversation.

The behavior we have in 4.6.0, the keyboard stay closed ! :)
@stevkan thanks for you help ;)

[tdurnford]

@didaskein It looks like this behavior is intended. The suggested action onClick handler calls focusSendBox which should trigger the keyboard to appear. However, I do agree that this creates a clunky user experience for mobile devices. @compulim @corinagum We should consider changing this behavior for mobile or only focus on the send box if it had focus prior to the user clicking the suggested action.

https://github.com/microsoft/BotFramework-WebChat/blob/dfb489304834de8b9579da2adea1474f37cba655/packages/component/src/SendBox/SuggestedAction.js#L47

[corinagum]

There are at least 2 issues related to this topic in previous issues. Can we try and pull those up?

[daveta]

Hi @didaskein : @tdurnford gave a response. Please reopen if you have any further questions. Thanks.

[tdurnford]

Reopening to track this work item

[compulim]

Prefer not to detect whether it is mobile or not, but put the behavior across both platforms (not focus on send box after click). Because if you use Surface on tablet mode, it could suffer the same problem too.

[compulim]

Please link two issues with this so we can understand the bigger picture.

[corinagum]

https://github.com/microsoft/BotFramework-WebChat/pull/2087
https://github.com/microsoft/BotFramework-WebChat/issues/1789
@tdurnford could you take a look at these?

[carlosscastro]

@tdurnford @corinagum could you please update this issue? Thanks :)

[cwhitten]

@compulim to look at suggested actions and focus management on other channels in mobile environments (teams, facebook, etc)

[compulim]

After suggested actions button is clicked, we can focus back to role="complementary" as it has tabIndex="-1". It also have keypress trap to send focus to send box on keydown.

[compulim]

The original fix (no keyboard) was #1971.

But it was reverted because of an accessibility issue #2608.

I am reading the WCAG 2.4.3 Focus Order to see which path we should choose.

[compulim]

FYI, we have a PR for this now, #3213.

[didaskein]

Thank you guys ! :)