Clicking Records in Groups Clears Multiple-Select

[drewcovi]

When pulling in a grouped and fully-resolved record set for multiple-select, everything works fine with keyboard and return, but clicking causes the component to clear the current selection instead.

[drewcovi]

For whatever reason, everything works fine when not grouped.

[drewcovi]

This could be resolved by simply ensuring that option.options is an array on line 98.

https://github.com/cibernox/ember-power-select/blob/a939d18b400e1e9151b7b689d5df5fbb4949610f/addon/components/power-select/options.js#L92-L100

option = option.options.toArray()[parseInt(parts[i], 10)];

[cibernox]

Can you provide a reproduction? Using ember twiddle should be enough

[drewcovi]

Totally. That said: ensuring option.options is an array shouldn't have any downside.

I'll take a look when I get a chance.

[thomaswelton]

I'm hitting the same issue.

[cibernox]

@thomaswelton perhaps you can build a repro?

[thomaswelton]

Similar to the above, but actually using @drewcovi comment above I cna fix it by calling toArray from within my computed options function

options: computed('corporations', 'corporateAccounts', function () {
    const corporations = this.get('corporations').toArray();
    const accounts = this.get('corporateAccounts').toArray();

    return [
      {
        groupName: 'Corporations',
        options: corporations,
      },
      {
        groupName: 'Accounts',
        options: accounts,
      },
    ];
  }),

[cibernox]

I think this is expected. See http://ember-power-select.com/docs/groups

You can nest groups inside groups with absolutely no depth limit, everything else like arrow navigation and filtering will just work. However, the options of a group cannot be a promise, it has to be a regular collection.

[ErvinSabic]

I think this is expected. See http://ember-power-select.com/docs/groups

You can nest groups inside groups with absolutely no depth limit, everything else like arrow navigation and filtering will just work. However, the options of a group cannot be a promise, it has to be a regular collection.

Is there any particular reason why it can't be a promise? It would be super useful if it could be haha. My models are loaded in when you open the select box so trying to toArray() it each time gets a bit trickier if the records are filled dynamically.