Skip to content

Onscreen Keyboard inconsistent behavior: disappears after tapping SendButton, but works correctly after tapping "Return" on keyboard #5689

@miketrexler

Description

@miketrexler

Is it an issue related to Adaptive Cards?

No response

Is this an accessibility issue?

No response

What version of Web Chat are you using?

Latest production

Which distribution are you using Web Chat from?

NPM

Which hosting environment does this issue primarily affect?

Cordova/PhoneGap

Which browsers and platforms do the issue happened?

Platform: iOS/iPadOS

Which area does this issue affect?

Send box

Which theme pack does this issue affect?

I did not test it on other theme packs

What is the public URL for the website?

No response

Please describe the bug

Steps to Reproduce:

  1. Type in the Text Input at the bottom of the page.
  2. Click the SendButton (paper airplane icon).

Expected Response: Onscreen Keyboard remains open
Actual Result: Onscreen Keyboard disappears. Tapping on the Text Input does not display the Onscreen Keyboard. The user must tap outside of the Text Input, then tap within the Text Input a second time to show the Onscreen Keyboard.

When the user interacts with the Onscreen Keyboard's "Return" button, the keyboard behaves differently: it does not disappear. This is the desired behavior we would like to see applied to the SendButton.

Do you see any errors in console log?

How to reproduce the issue?

Steps to Reproduce:

  1. Type in the Text Input at the bottom of the page.
  2. Click the SendButton (paper airplane icon).

What do you expect?

Expected Response: Onscreen Keyboard remains open.

However: When the user interacts with the Onscreen Keyboard's "Return" button, the keyboard behaves differently: it does not disappear. This is the expected/desired behavior we would like to see applied to the SendButton.

What actually happened?

Actual Result: Onscreen Keyboard disappears. Tapping on the Text Input does not display the Onscreen Keyboard. The user must tap outside of the Text Input, then tap within the Text Input a second time to show the Onscreen Keyboard.

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

Shared privately

Adaptive Card JSON

Additional context

We have a proposed solution! We have tested this locally and would like it to be incorporated into the codebase:
Change the following line:
const handleClick = useCallback(() => submit({ setFocus: 'sendBoxWithoutKeyboard' }), [submit]);
to:
const handleClick = useCallback(() => submit({ setFocus: 'sendBox' }), [submit]);

This resolved the issue for us.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Bot ServicesRequired for internal Azure reporting. Do not delete. Do not change color.bugIndicates an unexpected problem or an unintended behavior.customer-reportedRequired for internal Azure reporting. Do not delete.

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions