chips: SPACE separator does not work with virtual keyboards on Android · angular/components#9237

(12 comments) (10 reactions) (0 assignees)TypeScript (24,044 stars) (6,650 forks)batch import

P3androidarea: material/chipshelp wanted

説明

Bug, feature request, or proposal:

Bug

What is the expected behavior?

Separate chips on space when SPACE is set in MatChipInput.matChipInputSeparatorKeyCodes

What is the current behavior?

On Android devices it does not. (I personally tried Nesus X5 and pixel xl v1)

What are the steps to reproduce?

https://stackblitz.com/edit/chipinput "android friendly chip input" uses keyup and looks at the last char of the input's value, to get around Android's "bad" keyboard event w/o keys and indistinguishable keycode 229.

What is the use-case or motivation for changing an existing behavior?

To be able to use MatChipInput on Android.

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

All but on Android devices

Is there anything else we should know?

Android produces keycode 229 on space and other special characters. Related to https://stackoverflow.com/questions/36753548/keycode-on-android-is-always-229/42552368

コントリビューターガイド

技術スタック: typescriptjavascripthtmlcss
領域: frontend
Issue 種別: bug
難度: 3
推定時間: 1-3 hours
活動状況: stale
明確さ: clear
前提条件: Angular MaterialTypeScriptkeyboard events
初心者向け度: 50
調査方針: Focus on the MatChipInput directive in the chips module. The current implementation uses keydown event with keyCode. For Android (keyCode 229), switch to keyup event and compare the input value's last character to detect space. Check the StackBlitz example mentioned for reference. Ensure the fix does not break existing behavior on desktop.