QSelect. Input is not focused properly

[suyundukov]

What happened?

On iPhone after tapping on QSelect dialog pops up, but input in that dialog is not focused. User needs to tap on input himself, to focus properly on input.

https://github.com/quasarframework/quasar/assets/14142638/52504658-b244-41fb-8550-bf7e7c721447

What did you expect to happen?

After tapping on QSelect dialog pops up and the input is focused properly, meaning the keyboard should be visible.

Reproduction URL

https://codepen.io/suyundukov/full/abPoWQm

How to reproduce?

1. Go to the provided reproduction link
2. Tap on select
3. Dialog pops up
4. ???
5. ~~profit~~ Input is not focused properly

Flavour

Quasar CLI with Vite (@quasar/cli | @quasar/app-vite)

Areas

Components (quasar)

Platforms/Browsers

iOS (Chrome, Safari)

Additional context

On Android everything works as expected:

https://github.com/quasarframework/quasar/assets/14142638/8536b137-148b-4bf6-be71-0944d14bc214

[akash-melkeri]

you need to add prop autofocus. you can read about it here Input API

[RedShift1]

This worked for me:

<q-select @popup-show="fixFocus" ref="select" use-input></q-select>

import {nextTick} from 'vue';

export default
{
    methods:
    {
        async fixFocus()
        {
            await nextTick();
            this.$refs.select.$el.children[0].children[0].children[0].children[0].children[0].focus();
        }
    }
}