ampproject / amp-by-example

DEPRECATED: AMP by Example has been merged into amp.dev
http://amp.dev
Apache License 2.0
753 stars 505 forks source link

Autosuggest arrow keys don't work #1007

Open rdadoune opened 6 years ago

rdadoune commented 6 years ago

https://ampbyexample.com/advanced/autosuggest/

It seems as though the intention is for the arrow keys to work for this example but they don't. The amp-selector has keyboard-select-mode="focus" but I was looking at the amp-selector source code and it doesn't seem like this is actually possible with the current implementation. I think for it to work, we'd need to be able to wrap the input along with the all the available options into a single amp-selector. On line 204 it selects all [options] within the amp-selector, so I tried to modify the example to make this work but amp-selector attaches the keydown event to amp-selector element and not my input (Note: line 114). However, even if that did work, since the options are loaded dynamically with amp-list, they aren't available when the component mounts. There'd also need to be a way to remount the options after amp-list updates.

Sorry in advance if this is not the right location for this issue, if need be, I can close and reopen in amphtml.

sebastianbenz commented 6 years ago

@cvializ could you please take a look?

cvializ commented 6 years ago

Thanks for reporting! This is a known issue https://github.com/ampproject/amphtml/issues/10946. For now, users must tab to the the list dropdown, then use the arrow keys.

cvializ commented 6 years ago

Will keep this issue open to track adding the keyboard input events to this example when AMP supports them