Global Search - Search Topbar Vue
What does this MR do?
Closes #262063 (closed)
This MR finishes the work of converting the topbar on the Search Page into Vue. This change started as we removed the deprecated jQuery Dropdowns as part of this issue: #262060 (closed)
After doing so we noticed some inconsitencies between the new GlDropdown component and the existing button and search bar. Instead of trying to add custom properties to match the specs (temporarily), we decided it made sense to move into the GitLab UI Component library.
This change also allows us to no longer need to bootstrap both of the dropdowns independently and instead allow us simply bootstrap the topbar component and bring all the vue components in that way.
Notes about this change
The highlighting logic for the search results depended on fetching the sanitized search term from the DOM. This change implements a way to pass the sanitized search to the highlighting logic rather than trying to time it with the Vue bootstrapping.
Screenshots (strongly suggested)
Before | After | |
---|---|---|
Desktop | ||
Mobile |
GIF
Functionality Check
Does this MR meet the acceptance criteria?
Conformity
-
Changelog entry - [-] Documentation (if required)
-
Code review guidelines -
Merge request performance guidelines -
Style guides - [-] Database guides
-
Separation of EE specific content
Availability and Testing
-
Review and add/update tests for this feature/bug. Consider all test levels. See the Test Planning Process. -
Tested in all supported browsers - [-] Informed Infrastructure department of a default or new setting change, if applicable per definition of done
Security
If this MR contains changes to processing or storing of credentials or tokens, authorization and authentication methods and other items described in the security review guidelines:
- [-] Label as security and @ mention
@gitlab-com/gl-security/appsec
- [-] The MR includes necessary changes to maintain consistency between UI, API, email, or other methods
- [-] Security reports checked/validated by a reviewer from the AppSec team
Related to #262063 (closed)