Options not showing after calling focus on input

[trumpet7347]

I have a multiselect panel setup like so

<MultiSelect bind:this={msApiClaims} id="msApiClaims" bind:selected={selectedApiClaims} options={options} />

By default, the input is hidden, but once it actually exists, I am calling focus to it

  $:{
        if (msApiClaims != null) {
            let inputElement = document.getElementById("msApiClaims")
            inputElement.focus();            
        }
    }

The issue I am having is that when I call focus, it doesn't show the dropdown and I am unable to select any options until I either click on the input, or tab out and back in. Is there a recommended way of pulling focus to the element programmatically, or maybe a method that can be called to display the dropdown?

[janosh]

thanks for reporting, i'm surprised the dropdown doesn't open when programmatically focusing the input. i'd have to do some troubleshooting and currently lack the time. maybe next weekend.

fwiw, no need for document.getElementById("msApiClaims"). you can directly <MultiSelect bind:input={select_input} />