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

More robust autocomplete #1860

Merged
merged 14 commits into from
May 3, 2023
Merged

More robust autocomplete #1860

merged 14 commits into from
May 3, 2023

Conversation

TheSlimvReal
Copy link
Collaborator

These changes should make the basic autocomplete component more robust on different/slower browsers.

Visible/Frontend Changes

  • [x]
  • [ ]

Architectural/Backend Changes

  • [x]
  • [ ]

@github-actions
Copy link

Deployed to https://pr-1860.aam-digital.net/

Copy link
Member

@sleidig sleidig left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

looks good and seems to work well (although I didn't experience the bug previously either).

Tested:

single select:

  • existing value displayed initially
  • able to use autocomplete, see all options dropdown, type to narrow options
  • click outside to reset (discarding anything typed; showing selected options as string again)
  • select a new/additional option (value shown in string, dropdown closed, able to open dropdown again || multi: )
  • add a new option ⚠️

clicking to add new option currently does not show the yes/no confirmation and instead shows the dropdown at the top left corner of the screen. No option is added.

multi select:

  • existing value displayed initially
  • able to use autocomplete, see all options dropdown, type to narrow options
  • click outside to reset (discarding anything typed; showing selected options as string again)
  • select a new/additional option (dropdown remains open, able to select further values, value shown in string on focus out)
  • add a new option (confirmation dialog, nothing on "No", created and selected on "Yes")

If we can, we should hide that checkmark on the right of the option in multi mode. This is somewhat inconsistent with the checkboxes.
image

@@ -82,7 +82,17 @@ export class BasicAutocompleteComponent<O, V = O>
startWith([] as SelectableOption<O, V>[])
);
showAddOption = false;
private delayedBlur: any;

get displayText() {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

isn't this going against #1087 and we should rather set a variable instead of a getter?

}
setTimeout(() => this.inputElement.focus());
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

let's comment extensively why we need a timeout here and what are the tradeoffs (as we might face some related bugs again in the future 😉 )

Copy link
Member

@sleidig sleidig left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

succesfully tested after the further changes

@sonarqubecloud
Copy link

sonarqubecloud bot commented May 3, 2023

Kudos, SonarCloud Quality Gate passed!    Quality Gate passed

Bug C 1 Bug
Vulnerability A 0 Vulnerabilities
Security Hotspot A 0 Security Hotspots
Code Smell A 0 Code Smells

No Coverage information No Coverage information
0.0% 0.0% Duplication

@sleidig sleidig merged commit 737ec3e into master May 3, 2023
@sleidig sleidig deleted the enum_dropdown branch May 3, 2023 09:07
@aam-digital-ci
Copy link
Collaborator

🎉 This PR is included in version 3.21.0-master.8 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

@aam-digital-ci
Copy link
Collaborator

🎉 This PR is included in version 3.21.0 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
Archived in project
Development

Successfully merging this pull request may close these issues.

3 participants