1 files changed, 5 insertions, 3 deletions
diff --git a/app/assets/javascripts/search/topbar/components/searchable_dropdown_item.vue b/app/assets/javascripts/search/topbar/components/searchable_dropdown_item.vue
index 498d4af59b4..42d6444e690 100644
--- a/app/assets/javascripts/search/topbar/components/searchable_dropdown_item.vue
+++ b/app/assets/javascripts/search/topbar/components/searchable_dropdown_item.vue
@@ -1,5 +1,5 @@
 <script>
-import { GlDropdownItem, GlAvatar } from '@gitlab/ui';
+import { GlDropdownItem, GlAvatar, GlSafeHtmlDirective as SafeHtml } from '@gitlab/ui';
 import highlight from '~/lib/utils/highlight';
 import { truncateNamespace } from '~/lib/utils/text_utility';
 
@@ -9,6 +9,9 @@ export default {
     GlDropdownItem,
     GlAvatar,
   },
+  directives: {
+    SafeHtml,
+  },
   props: {
     item: {
       type: Object,
@@ -62,8 +65,7 @@ export default {
         :size="32"
       />
       <div class="gl-display-flex gl-flex-direction-column">
-        <!-- eslint-disable-next-line vue/no-v-html -->
-        <span data-testid="item-title" v-html="highlightedItemName">{{ item[name] }}</span>
+        <span v-safe-html="highlightedItemName" data-testid="item-title"></span>
         <span class="gl-font-sm gl-text-gray-700" data-testid="item-namespace">{{
           truncatedNamespace
         }}</span>