patternfly-react icon indicating copy to clipboard operation
patternfly-react copied to clipboard

Bug - Select - The first time you click on a filter input field, it does not have focus

Open AlexandrUSA opened this issue 1 year ago • 1 comments
trafficstars

Describe the problem The first time you click on a filter input field of the Select component with typeahead functionality, it does not have focus. Only after second click we get a focus and we can insert some text into it. This issue is reproducible in official documentation as well: https://www.patternfly.org/components/menus/select/#typeahead

How do you reproduce the problem?

  1. Add Select component on your page with typeahead functionality
  2. Click on it and try to insert some text in filter

Expected behavior Focus is set on the input field and we can enter values there for filtering

Actual behavior The input field does not have focus and we cannot enter filtering values there. Only after second click we get a focus and can insert some text for filtering

Screenshots First click on the filter field (no focus on the input field): image Second click (filter gets focus but options are not visible): image

What is your environment?

  • OS: iOS, Windows 10, 11
  • Browser: chrome, safari
  • Version: any version

AlexandrUSA avatar May 02 '24 17:05 AlexandrUSA

This behavior was fixed in one of the latest PRs: https://github.com/patternfly/patternfly-react/pull/10207/files by adding the shouldFocusFirstItemOnOpen prop and setting it to false in all typeahead select examples.

I believe it was just not released yet (or at least not in the 5.3.0 release which is on the website)

adamviktora avatar May 09 '24 14:05 adamviktora

closed by #10207

tlabaj avatar Jun 04 '24 20:06 tlabaj

We are in the last sprint of development for our Q2 release. This fix will be included.

On Wed, Jun 26, 2024 at 12:55 AM Steve Rhoades @.***> wrote:

Is there a plan to include this in a release soon?

— Reply to this email directly, view it on GitHub https://github.com/patternfly/patternfly-react/issues/10333#issuecomment-2190704993, or unsubscribe https://github.com/notifications/unsubscribe-auth/AJNTTEZBOL4YE5EKQEEE5YDZJJCPXAVCNFSM6AAAAABHEEUN6KVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDCOJQG4YDIOJZGM . You are receiving this because you modified the open/close state.Message ID: @.***>

tlabaj avatar Jun 26 '24 14:06 tlabaj