Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Autocomplete: focus not being applied when clicking around input #14530

Closed
evaldasu opened this issue Jan 11, 2024 · 0 comments · Fixed by #14535
Closed

Autocomplete: focus not being applied when clicking around input #14530

evaldasu opened this issue Jan 11, 2024 · 0 comments · Fixed by #14535
Labels
LTS-15-PORTABLE LTS-16-PORTABLE LTS-FIXED-16.9.4 Type: Bug Issue contains a bug related to a specific component. Something about the component is not working
Milestone

Comments

@evaldasu
Copy link

evaldasu commented Jan 11, 2024

Describe the bug

I have a use case where I make the p-autocomplete (multiple mode) component a bit bigger vertically, by adding height to .p-autocomplete-multiple-container.

After migrating from 13.4.1 to the latest version (17.3.2 at the moment), I observed that clicking not directly on the input element, doesn't focus the input anymore. The last version I've seen this working was in v15-lts.

While comparing 17.3.2 with v15-lts, upon closer inspection I can see that in multiple mode, the ul element with class p-autocomplete-multiple-container no longer receives class p-focus, but I don't know if that means anything.

Environment

Ubuntu 22.04.3 LTS

Reproducer

No response

Angular version

17.0.8

PrimeNG version

17.3.2

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

20.10.0

Browser(s)

Firefox, Chrome

Steps to reproduce the behavior

  1. Go to the example page of autocomplete multiple
  2. Using browser dev tools, select the ul element with a class p-autocomplete-multiple-container
  3. Apply following CSS rules:
height: 5rem;
align-items: start;
  1. Try clicking anywhere outside the input element box model (inside the red box bellow for example). You'll observe that the input is not being focused and I cannot start typing.
    image

Expected behavior

I would expect the input element to receive focus and be able to start typing as it used to work before, for example in https://www.primefaces.org/primeng-v15-lts/autocomplete#multiple (using the same reproduction steps will demonstrate that)

@evaldasu evaldasu added the Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible label Jan 11, 2024
@mehmetcetin01140 mehmetcetin01140 added Type: Bug Issue contains a bug related to a specific component. Something about the component is not working and removed Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible labels Jan 11, 2024
HeavyRainLQ added a commit to HeavyRainLQ/primeng that referenced this issue Jan 11, 2024
@mertsincan mertsincan added Status: Pending Review Issue or pull request is being reviewed by Core Team Type: Bug Issue contains a bug related to a specific component. Something about the component is not working and removed Type: Bug Issue contains a bug related to a specific component. Something about the component is not working labels Jan 16, 2024
@mertsincan mertsincan added this to the 17.4.0 milestone Jan 16, 2024
@cetincakiroglu cetincakiroglu modified the milestones: 17.4.0, 17.3.3 Jan 18, 2024
@cetincakiroglu cetincakiroglu removed the Status: Pending Review Issue or pull request is being reviewed by Core Team label Jan 18, 2024
cetincakiroglu added a commit that referenced this issue Jan 18, 2024
Fix #14530: Autocomplete: focus not being applied when clicking around input
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
LTS-15-PORTABLE LTS-16-PORTABLE LTS-FIXED-16.9.4 Type: Bug Issue contains a bug related to a specific component. Something about the component is not working
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants