ng-select: Selected value not shown, when keyboard has suggestion strip enabled on Android

Describe the bug When searching and selecting a value from an ng-select input, the selected value is not shown in the input. This happens only on Android, when the virtual keyboard has suggestion strip on.

To Reproduce Steps to reproduce the behavior:

  1. Go to ng-select demo page
  2. Click on the select under Backend data with async pipe
  3. Write for example “me”
  4. Click “Mendoza Ruiz”
  5. See empty select input

Expected behavior The selected value is displayed.

Screenshots

ng-select-bug 2019-11-25 17_07_59

Desktop:

  • Does not reproduce on desktop

Smartphone:

  • Device: Pixel 2
  • OS: Android 10
  • Browser: Chrome
  • Version: 78
  • Suggestion strip has to be enabled, for instance on Pixel device in Settings → System → Languages & input → Virtual keyboard → Gboard → Text correction → Show suggestion strip

Additional context It seems that the compositionstart event is fired, but a subsequent compositionend is never fired on the search input, when the option is clicked:

https://github.com/ng-select/ng-select/blob/87908d3903d8afdfe538c0f7ee1afcbd3d42bcef/src/ng-select/lib/ng-select.component.html#L38

This means, that the internal this._isComposing flag does not get turned off:

https://github.com/ng-select/ng-select/blob/87908d3903d8afdfe538c0f7ee1afcbd3d42bcef/src/ng-select/lib/ng-select.component.ts#L538-L545

This results in the selected value not being displayed due to:

https://github.com/ng-select/ng-select/blob/87908d3903d8afdfe538c0f7ee1afcbd3d42bcef/src/ng-select/lib/ng-select.component.ts#L179

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Reactions: 10
  • Comments: 15 (5 by maintainers)

Most upvoted comments

Could you please reopen this? The issue is still valid and there has been activity in this issue since the bot marked this stale.

Hotfix: <ng-select #select (close)="select.blur()"></ng-select>

As I mentioned in https://github.com/ng-select/ng-select/pull/1556 there is also a CSS hotfix:

.ng-select.ng-select.ng-select-single.ng-select-filtered:not(.ng-select-opened) .ng-select-container.ng-has-value .ng-value-container .ng-value{ visibility: visible; }

This issue still reproduces. Are there plans for fixing this? Currently this is blocking us from upgrading from v3.0.4.

@iRipVanWinkle you fix is working !!