Impossible to search on mobile with new DocSearch v3
Prerequisites
-
I have searched for duplicate or closed issues -
I have validated any HTML to avoid common problems -
I have read the contributing guidelines
Describe the issue
As soon as the DocSearch v3 popup is displayed from the offcanvas under 991px breakpoint, it is impossible to use the input and so to search in the documentation.
I don't think it is an issue coming from DocSearch v3 since search in https://docsearch.algolia.com/docs/how-does-it-work works pretty well on mobile. This is maybe coming from the fact that it is triggered from the offcanvas in the menu
Reduced test cases
Set your browser in responsive design mode at a width of 991px or under; or try it from a mobile phone.
- Go to https://twbs-bootstrap.netlify.app/docs/5.1/getting-started/introduction/
- Click on the "..." menu
- Click on "Search" → Search popup is displayed
- The input doesn't gain automatically the focus and clicking on it neither
You don't see it in the following .gif but I'm trying to click on the input
What operating system(s) are you seeing the problem on?
Android, Linux
What browser(s) are you seeing the problem on?
Chrome, Firefox
What version of Bootstrap are you using?
v5.2.0 (current main branch)