-
Notifications
You must be signed in to change notification settings - Fork 12
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
Check for isTouched before opening search suggestions #1122
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM
@@ -439,7 +452,7 @@ export class VaSearchInput { | |||
return ( | |||
<Host onBlur={handleBlur}> | |||
<form class={formClasses} role="search"> | |||
<label class="usa-sr-only" htmlFor="search-field">{label}</label> | |||
<label class="usa-sr-only kokokok" htmlFor="search-field">{label}</label> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Is "kokokok" just a leftover thing from testing?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Whoops XD
// only open the listbox after the search input has been touched | ||
this.isListboxOpen = false; | ||
return | ||
} | ||
this.isListboxOpen = true; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Just a minor thing here but would a ternary simplify this logic or would that make it less readable?
this.isTouched ? this.isListBoxOpen = true : this.isListboxOpen = false;
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks great, Alex! Thank you for digging into this one! 👍
Chromatic
https://dst2676-search-suggestions--65a6e2ed2314f7b8f98609d8.chromatic.com
Description
Closes Search Typeahead component does not close as expected when the component loads with a value prefilled #2676
Do not open search suggestions if the search hasn't been touched.. This would happen if the search was filled on load.
To test:
QA Checklist
Screenshots
Before
https://github.com/department-of-veterans-affairs/component-library/assets/1413938/672b384c-5431-4d95-ab66-87219b639ab2
After
https://github.com/department-of-veterans-affairs/component-library/assets/1413938/851ea977-14c2-4277-86e3-1560424a70d3
Acceptance criteria
Definition of done