microsoft / BotFramework-WebChat

A highly-customizable web-based client for Azure Bot Services.
https://www.botframework.com/
MIT License
1.57k stars 1.52k forks source link

On screen keyboard covers the webchat and sendbox on Android and IOS devices when suggested actions are shown. #4732

Open n-sri opened 1 year ago

n-sri commented 1 year ago
  1. Load mock bot in chrome/safari browser of an android/ios device.
  2. Type help and select "Show all activities related to accessibility test" to get suggested actions showup ("IM back as string", "Post back as string", "Post back as JSON", "Message back as JSON with display text", "Message back as JSON without display text", "Message back as string with display text") at the bottom of chat window and just above send box.
  3. Click to get focus on the webchat section above the suggested actions and now click on send box. This brings up the onscreen keyboard to type but it hides the webchat and sendbox behind it. The webchat and sendbox need to resize accordingly when on screen keyboard shows up. 1  select webchat section 2  Keyboard covering the sendbox and suggested actions webchat selection
compulim commented 1 year ago

After some intensive investigations, this is a bug on iOS/iPadOS Safari side.

I have built a repo outside of Web Chat and show how "scroll form control into view" could be interfered when placeholder text is styled. The repo is https://github.com/compulim/experiment-safari-auto-scroll-keyboard.

Looks like there is a race condition on Safari side.

n-sri commented 1 year ago

This issue has been reproduced on android devices also.