Autofocus

I am trying to implement an autofocus attribute feature, so when it renders and I add an autofocus attribute, my power select will automatically be open and have the cursor ready to go

Here is my power select

{{#power-select renderInPlace=true selected=productSelected
                                    search=(action "searchForProducts") allowClear=true
                                    placeholder="Search for Product" onchange=(action (mut productSelected))
                                    onfocus=(action "selectFocused") class="product-select"
                                    autofocus="autofocus"
                                    as |item|}}
                        {{item.name}}
                    {{/power-select}}

I was playing around with this, but I can’t quite figure out how to force the power select to open. Do you know of a solution that would work?

import Ember from 'ember';
import EmberPowerSelect from 'ember-power-select/components/power-select';
export function initialize(/* application */) {
    EmberPowerSelect.reopen({
        didInsertElement: function() {
            this._super(...arguments);
            Ember.run.next(() => {}
                if (this.get('autofocus')) {


                }
            });
        }
    });
}

export default {
  name: 'power-select',
  initialize
};

[perlun]

@cibernox This has been disturbing me for a while, and today I found this issue.

Would it make sense if we added this to the public API? Being able to automatically give focus to “the most important form field” in a form is IMHO good practice, and will improve the user experience greatly for certain (app-like) web pages & web apps.

[cibernox]

@lougreenwood The problem is that autofocus is an html attributes that only works on native inputs, textareas and selects. EPS is not a real select and AFAIK it’s impossible to replicate it reliably. Focusing the select on didInsertElement is the closest we can get, but in reality it is more complex than that, that’s why I am reluctant to implement it that way.