Polaris-react: Autocomplete with loading status is not working

Created on 12 Jun 2020  ยท  7Comments  ยท  Source: Shopify/polaris-react

Issue summary

When typing into an autocomplete field to filter out options, the options dialog collapses to a thin line.

Expected behavior

When typing into the autocomplete field the dialog should show the filtered options

Actual behavior

The options dialog collapses into a thin line

Steps to reproduce the problem

  1. Go to the docs for autocomplete component https://polaris.shopify.com/components/forms/autocomplete#navigation
  2. Select "Autocomplete with loading" example
  3. Type into the textfield a string that matches one of the options (e.g. Rustic)
๐Ÿ›Bug

Most helpful comment

๐Ÿ‘‹ Hey all, just want to mention that this issue (as far as I know) affects Shopify Payments Japan's onboarding bank info section as well as it uses the same autocomplete dropdown component. Will be following this issue. ๐Ÿ™‡โ€โ™‚๏ธ

@aya-kamikawa, @winston, @yishus, @codeAbul

All 7 comments

To add to this: in the Autocomplete with loading example, if you type two characters quickly, the options dialog will show up.

i.e. Type re and the Refurbished option will show up. If you type r then e, it won't.

The bug also occurs without using the loading prop. Here's an example

So did I. Did anyone fix it???

@BPScott

If this error still occurs on polaris.shopify.com then it sounds like it remains unfixed.
I've not got much context on Autocomplete, though I believe @dleroux was looking at improvements to it a while back.

Alternatively if you're able to identify and fix the problem we'd welcome a PR as most of the team's focus is elsewhere currently.

Iโ€™m planning on improving the autocomplete but no timeline has been set for this work yet. In the meantime a PR to fix this issue would be more than welcomed.

@dfmcphee anything we can do to get this prioritized on the Polaris team? It seems, uh.. not great.. to have this visibly broken on our public style guide, product page tags, HS code search, etc.

@Flufd did some initial investigation, but our devs are all hustling for our Code Red deadline Oct 30th so I don't think we're able to prioritize it on cross-border team. Anyone that can help out here?

๐Ÿ‘‹ Hey all, just want to mention that this issue (as far as I know) affects Shopify Payments Japan's onboarding bank info section as well as it uses the same autocomplete dropdown component. Will be following this issue. ๐Ÿ™‡โ€โ™‚๏ธ

@aya-kamikawa, @winston, @yishus, @codeAbul

Was this page helpful?
0 / 5 - 0 ratings

Related issues

shahab65 picture shahab65  ยท  3Comments

greghesp picture greghesp  ยท  3Comments

andrewpye picture andrewpye  ยท  3Comments

andrewpye picture andrewpye  ยท  3Comments

janklimo picture janklimo  ยท  3Comments