From 7284b6105e0bf65819f6ea4a02946c071d4cfccd Mon Sep 17 00:00:00 2001
From: Klemen Benedicic <klemen.benedicic@scinote.net>
Date: Thu, 16 May 2024 14:34:59 +0200
Subject: [PATCH] Added data-e2e to Delete inventory modal and Global search
 [SCI-10717]

---
 .../vue/global_search/container.vue           | 18 +++++------
 .../vue/global_search/groups/assets.vue       |  6 ++--
 .../vue/global_search/groups/experiments.vue  |  6 ++--
 .../vue/global_search/groups/folders.vue      |  6 ++--
 .../groups/helpers/sort_flyout.vue            |  5 ++++
 .../global_search/groups/label_templates.vue  |  6 ++--
 .../groups/my_module_protocols.vue            |  8 ++---
 .../vue/global_search/groups/my_modules.vue   |  6 ++--
 .../vue/global_search/groups/projects.vue     |  6 ++--
 .../vue/global_search/groups/protocols.vue    |  6 ++--
 .../vue/global_search/groups/reports.vue      |  6 ++--
 .../global_search/groups/repository_rows.vue  |  6 ++--
 .../vue/global_search/groups/results.vue      |  6 ++--
 .../vue/navigation/quick_search.vue           | 21 +++++++------
 app/javascript/vue/repositories/table.vue     | 21 +++++++++++--
 .../vue/shared/confirmation_modal.vue         | 30 +++++++++++++++----
 app/javascript/vue/shared/menu_dropdown.vue   |  7 +++--
 17 files changed, 107 insertions(+), 63 deletions(-)

diff --git a/app/javascript/vue/global_search/container.vue b/app/javascript/vue/global_search/container.vue
index 0e2488829..065013852 100644
--- a/app/javascript/vue/global_search/container.vue
+++ b/app/javascript/vue/global_search/container.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="content-pane flexible with-grey-background">
+  <div class="content-pane flexible with-grey-background" data-e2e="e2e-CO-globalSearch">
     <div class="content-header">
       <div class="title-row">
         <h1 class="mt-0 truncate !inline">
@@ -14,7 +14,7 @@
       <GeneralDropdown ref="historyContainer" :canOpen="canOpenHistory" :fieldOnlyOpen="true" >
         <template v-slot:field>
           <div class="left-icon sci-input-container-v2 w-72 input-sm"
-              :title="i18n.t('nav.search')" :class="{'error': invalidQuery}">
+              :title="i18n.t('nav.search')" :class="{'error': invalidQuery}" :data-e2e="'e2e-IF-globalSearch'">
             <input ref="searchField"
               type="text"
               class="!pr-9"
@@ -28,7 +28,7 @@
             <i class="sn-icon sn-icon-search"></i>
             <i v-if="localQuery.length > 0"
               class="sn-icon cursor-pointer sn-icon-close absolute right-0 -top-0.5"
-              @click="localQuery = ''; $refs.searchField.focus()" :title="i18n.t('nav.clear')"></i>
+              @click="localQuery = ''; $refs.searchField.focus()" :title="i18n.t('nav.clear')" :data-e2e="'e2e-BT-globalSearch-clearInput'"></i>
           </div>
         </template>
         <template v-slot:flyout >
@@ -46,17 +46,17 @@
         </template>
       </GeneralDropdown>
       <div class="flex items-center gap-2.5">
-        <button class="btn btn-secondary btn-sm" :class="{'active': activeGroup == 'ExperimentsComponent'}" @click="setActiveGroup('ExperimentsComponent')">
+        <button class="btn btn-secondary btn-sm" :class="{'active': activeGroup == 'ExperimentsComponent'}" @click="setActiveGroup('ExperimentsComponent')" :data-e2e="'e2e-BT-globalSearch-experiments'">
           {{ i18n.t('search.index.experiments') }}
         </button>
-        <button class="btn btn-secondary btn-sm" :class="{'active': activeGroup == 'MyModulesComponent'}" @click="setActiveGroup('MyModulesComponent')">
+        <button class="btn btn-secondary btn-sm" :class="{'active': activeGroup == 'MyModulesComponent'}" @click="setActiveGroup('MyModulesComponent')" :data-e2e="'e2e-BT-globalSearch-tasks'">
           {{ i18n.t('search.index.tasks') }}
         </button>
-        <button class="btn btn-secondary btn-sm" :class="{'active': activeGroup == 'ResultsComponent'}" @click="setActiveGroup('ResultsComponent')">
+        <button class="btn btn-secondary btn-sm" :class="{'active': activeGroup == 'ResultsComponent'}" @click="setActiveGroup('ResultsComponent')" :data-e2e="'e2e-BT-globalSearch-taskResults'">
           {{ i18n.t('search.index.task_results') }}
         </button>
       </div>
-      <button class="btn btn-light btn-sm" @click="filterModalOpened = true">
+      <button class="btn btn-light btn-sm" @click="filterModalOpened = true" :data-e2e="'e2e-BT-globalSearch-openFilterModal'">
         <i class="sn-icon sn-icon-search-options" :title="i18n.t('search.index.more_search_options')"></i>
         <span class="tw-hidden xl:inline">{{ i18n.t('search.index.more_search_options') }}</span>
         <span
@@ -68,12 +68,12 @@
       </button>
       <template v-if="activeFilters.length > 0">
         <div class="h-4 w-[1px] bg-sn-grey"></div>
-        <button class="btn btn-light btn-sm" @click="resetFilters">
+        <button class="btn btn-light btn-sm" @click="resetFilters" :data-e2e="'e2e-BT-globalSearch-resetFilters'">
           <i class="sn-icon sn-icon-close" :title="i18n.t('search.index.clear_filters')"></i>
           <span class="tw-hidden xl:inline">{{ i18n.t('search.index.clear_filters') }}</span>
         </button>
       </template>
-      <button v-if="activeGroup" class="btn btn-light btn-sm" @click="resetGroup">
+      <button v-if="activeGroup" class="btn btn-light btn-sm" @click="resetGroup" :data-e2e="'e2e-BT-globalSearch-resetGroup'">
         <i class="sn-icon sn-icon-undo" :title="i18n.t('search.index.all_results')"></i>
         <span class="tw-hidden xl:inline">{{ i18n.t('search.index.all_results') }}</span>
       </button>
diff --git a/app/javascript/vue/global_search/groups/assets.vue b/app/javascript/vue/global_search/groups/assets.vue
index 83914165a..0b1b2ea3a 100644
--- a/app/javascript/vue/global_search/groups/assets.vue
+++ b/app/javascript/vue/global_search/groups/assets.vue
@@ -1,5 +1,5 @@
 <template>
-  <div ref="content" class="bg-white rounded" :class="{ 'p-4 mb-4': results.length || loading }">
+  <div ref="content" class="bg-white rounded" :class="{ 'p-4 mb-4': results.length || loading }" :data-e2e="'e2e-CO-globalSearch-files'">
     <template v-if="total && results.length">
       <div class="flex items-center">
         <h2 class="flex items-center gap-2 mt-0 mb-4">
@@ -7,7 +7,7 @@
           {{ i18n.t('search.index.files') }}
           <span class="text-base" >[{{ total }}]</span>
         </h2>
-        <SortFlyout v-if="selected" :sort="sort" @changeSort="changeSort"></SortFlyout>
+        <SortFlyout v-if="selected" :sort="sort" @changeSort="changeSort" :e2eSortButton="'e2e-BT-globalSearch-files-sort'"></SortFlyout>
       </div>
       <div class="grid grid-cols-[auto_auto_auto_auto_auto_auto] items-center">
         <TableHeader :selected="selected" :columnNames="[
@@ -33,7 +33,7 @@
       </div>
       <div v-if="viewAll">
         <hr class="w-full mb-4 mt-0">
-        <button class="btn btn-light" @click="$emit('selectGroup', 'AssetsComponent')">View all</button>
+        <button class="btn btn-light" @click="$emit('selectGroup', 'AssetsComponent')" :data-e2e="'e2e-BT-globalSearch-files-viewAll'">View all</button>
       </div>
     </template>
     <Loader v-if="loading" :loaderRows="loaderRows" />
diff --git a/app/javascript/vue/global_search/groups/experiments.vue b/app/javascript/vue/global_search/groups/experiments.vue
index d3c5d58b4..823b25198 100644
--- a/app/javascript/vue/global_search/groups/experiments.vue
+++ b/app/javascript/vue/global_search/groups/experiments.vue
@@ -1,5 +1,5 @@
 <template>
-  <div ref="content" class="bg-white rounded" :class="{ 'p-4 mb-4': results.length || loading }">
+  <div ref="content" class="bg-white rounded" :class="{ 'p-4 mb-4': results.length || loading }" :data-e2e="'e2e-CO-globalSearch-experiments'">
     <template v-if="total && results.length">
       <div class="flex items-center">
         <h2 class="flex items-center gap-2 mt-0 mb-4">
@@ -7,7 +7,7 @@
           {{ i18n.t('search.index.experiments') }}
           <span class="text-base" >[{{ total }}]</span>
         </h2>
-        <SortFlyout v-if="selected" :sort="sort" @changeSort="changeSort"></SortFlyout>
+        <SortFlyout v-if="selected" :sort="sort" @changeSort="changeSort" :e2eSortButton="'e2e-BT-globalSearch-experiments-sort'"></SortFlyout>
       </div>
       <div class="grid grid-cols-[auto_110px_auto_auto_auto] items-center">
         <TableHeader :selected="selected" :columnNames="[
@@ -27,7 +27,7 @@
       </div>
       <div v-if="viewAll">
         <hr class="w-full mb-4 mt-0">
-        <button class="btn btn-light" @click="$emit('selectGroup', 'ExperimentsComponent')">View all</button>
+        <button class="btn btn-light" @click="$emit('selectGroup', 'ExperimentsComponent')" :data-e2e="'e2e-BT-globalSearch-experiments-viewAll'">View all</button>
       </div>
     </template>
     <Loader v-if="loading" :loaderRows="loaderRows" />
diff --git a/app/javascript/vue/global_search/groups/folders.vue b/app/javascript/vue/global_search/groups/folders.vue
index 5f3758f25..748cb40b8 100644
--- a/app/javascript/vue/global_search/groups/folders.vue
+++ b/app/javascript/vue/global_search/groups/folders.vue
@@ -1,5 +1,5 @@
 <template>
-  <div ref="content" class="bg-white rounded" :class="{ 'p-4 mb-4': results.length || loading }">
+  <div ref="content" class="bg-white rounded" :class="{ 'p-4 mb-4': results.length || loading }"  :data-e2e="'e2e-CO-globalSearch-folders'">
     <template v-if="total && results.length">
       <div class="flex items-center">
         <h2 class="flex items-center gap-2 mt-0 mb-4">
@@ -7,7 +7,7 @@
           {{ i18n.t('search.index.folders') }}
           <span class="text-base" >[{{ total }}]</span>
         </h2>
-        <SortFlyout v-if="selected" :sort="sort" @changeSort="changeSort"></SortFlyout>
+        <SortFlyout v-if="selected" :sort="sort" @changeSort="changeSort" :e2eSortButton="'e2e-BT-globalSearch-folders-sort'"></SortFlyout>
       </div>
       <div class="grid grid-cols-[auto_110px_auto_auto_auto] items-center">
         <TableHeader :selected="selected" :columnNames="[
@@ -28,7 +28,7 @@
       </div>
       <div v-if="viewAll">
         <hr class="w-full mb-4 mt-0">
-        <button class="btn btn-light" @click="$emit('selectGroup', 'FoldersComponent')">View all</button>
+        <button class="btn btn-light" @click="$emit('selectGroup', 'FoldersComponent')" :data-e2e="'e2e-BT-globalSearch-folders-viewAll'">View all</button>
       </div>
     </template>
     <Loader v-if="loading" :loaderRows="loaderRows" />
diff --git a/app/javascript/vue/global_search/groups/helpers/sort_flyout.vue b/app/javascript/vue/global_search/groups/helpers/sort_flyout.vue
index cb4a8e26d..8e558fc1f 100644
--- a/app/javascript/vue/global_search/groups/helpers/sort_flyout.vue
+++ b/app/javascript/vue/global_search/groups/helpers/sort_flyout.vue
@@ -6,6 +6,7 @@
       position="right"
       @dtEvent="changeSort"
       btnIcon="sn-icon sn-icon-sort-down"
+      :e2eSortButton="e2eSortButton"
     ></MenuDropdown>
 </template>
 
@@ -18,6 +19,10 @@ export default {
     sort: {
       type: String,
       default: 'created_desc'
+    },
+    e2eSortButton: {
+      type: String,
+      default: ''
     }
   },
   components: {
diff --git a/app/javascript/vue/global_search/groups/label_templates.vue b/app/javascript/vue/global_search/groups/label_templates.vue
index 65620001d..66b1da150 100644
--- a/app/javascript/vue/global_search/groups/label_templates.vue
+++ b/app/javascript/vue/global_search/groups/label_templates.vue
@@ -1,5 +1,5 @@
 <template>
-  <div v-if="!disabled" ref="content" class="bg-white rounded" :class="{ 'p-4 mb-4': results.length || loading }">
+  <div v-if="!disabled" ref="content" class="bg-white rounded" :class="{ 'p-4 mb-4': results.length || loading }" :data-e2e="'e2e-CO-globalSearch-labelTemplates'">
     <template v-if="total && results.length">
       <div class="flex items-center">
         <h2 class="flex items-center gap-2 mt-0 mb-4">
@@ -7,7 +7,7 @@
           {{ i18n.t('search.index.label_templates') }}
           <span class="text-base" >[{{ total }}]</span>
         </h2>
-        <SortFlyout v-if="selected" :sort="sort" @changeSort="changeSort"></SortFlyout>
+        <SortFlyout v-if="selected" :sort="sort" @changeSort="changeSort" :e2eSortButton="'e2e-BT-globalSearch-labelTemplates-sort'"></SortFlyout>
       </div>
       <div class="grid grid-cols-[auto_110px_auto_auto_auto_auto] items-center">
         <TableHeader :selected="selected" :columnNames="[
@@ -29,7 +29,7 @@
       </div>
       <div v-if="viewAll">
         <hr class="w-full mb-4 mt-0">
-        <button class="btn btn-light" @click="$emit('selectGroup', 'LabelTemplatesComponent')">View all</button>
+        <button class="btn btn-light" @click="$emit('selectGroup', 'LabelTemplatesComponent')" :data-e2e="'e2e-BT-globalSearch-labelTemplates-viewAll'">View all</button>
       </div>
     </template>
     <Loader v-if="loading" :loaderRows="loaderRows" />
diff --git a/app/javascript/vue/global_search/groups/my_module_protocols.vue b/app/javascript/vue/global_search/groups/my_module_protocols.vue
index ab654f742..f071218f7 100644
--- a/app/javascript/vue/global_search/groups/my_module_protocols.vue
+++ b/app/javascript/vue/global_search/groups/my_module_protocols.vue
@@ -1,5 +1,5 @@
 <template>
-  <div ref="content" class="bg-white rounded" :class="{ 'p-4 mb-4': results.length || loading }">
+  <div ref="content" class="bg-white rounded" :class="{ 'p-4 mb-4': results.length || loading }" :data-e2e="'e2e-CO-globalSearch-taskProtocols'">
     <template v-if="total && results.length">
       <div class="flex items-center">
       <h2 class="flex items-center gap-2 mt-0 mb-4">
@@ -7,7 +7,7 @@
         {{ i18n.t('search.index.task_protocols') }}
         <span class="text-base" >[{{ total }}]</span>
       </h2>
-      <SortFlyout v-if="selected" :sort="sort" @changeSort="changeSort"></SortFlyout>
+      <SortFlyout v-if="selected" :sort="sort" @changeSort="changeSort" :e2eSortButton="'e2e-BT-globalSearch-taskProtocols-sort'"></SortFlyout>
     </div>
       <div class="grid grid-cols-[auto_110px_auto_auto_auto_auto_auto] items-center">
         <TableHeader :selected="selected" :columnNames="[
@@ -31,7 +31,7 @@
       </div>
       <div v-if="viewAll">
         <hr class="w-full mb-4 mt-0">
-        <button class="btn btn-light" @click="$emit('selectGroup', 'MyModuleProtocolsComponent')">View all</button>
+        <button class="btn btn-light" @click="$emit('selectGroup', 'MyModuleProtocolsComponent')" :data-e2e="'e2e-BT-globalSearch-taskProtocols-viewAll'">View all</button>
       </div>
     </template>
     <Loader v-if="loading" :loaderRows="loaderRows" />
@@ -48,7 +48,7 @@ export default {
   mixins: [searchMixin],
   data() {
     return {
-      group: 'module_protocols'
+      group: 'module_protocols',
     };
   }
 };
diff --git a/app/javascript/vue/global_search/groups/my_modules.vue b/app/javascript/vue/global_search/groups/my_modules.vue
index d306ac122..ca1bc7c62 100644
--- a/app/javascript/vue/global_search/groups/my_modules.vue
+++ b/app/javascript/vue/global_search/groups/my_modules.vue
@@ -1,5 +1,5 @@
 <template>
-  <div ref="content" class="bg-white rounded" :class="{ 'p-4 mb-4': results.length || loading }">
+  <div ref="content" class="bg-white rounded" :class="{ 'p-4 mb-4': results.length || loading }" :data-e2e="'e2e-CO-globalSearch-tasks'">
     <template v-if="total && results.length">
       <div class="flex items-center">
       <h2 class="flex items-center gap-2 mt-0 mb-4">
@@ -7,7 +7,7 @@
         {{ i18n.t('search.index.tasks') }}
         <span class="text-base" >[{{ total }}]</span>
       </h2>
-      <SortFlyout v-if="selected" :sort="sort" @changeSort="changeSort"></SortFlyout>
+      <SortFlyout v-if="selected" :sort="sort" @changeSort="changeSort" :e2eSortButton="'e2e-BT-globalSearch-tasks-sort'"></SortFlyout>
     </div>
       <div class="grid grid-cols-[auto_110px_auto_auto_auto_auto] items-center">
         <TableHeader :selected="selected" :columnNames="[
@@ -29,7 +29,7 @@
       </div>
       <div v-if="viewAll">
         <hr class="w-full mb-4 mt-0">
-        <button class="btn btn-light" @click="$emit('selectGroup', 'MyModulesComponent')">View all</button>
+        <button class="btn btn-light" @click="$emit('selectGroup', 'MyModulesComponent')" :data-e2e="'e2e-BT-globalSearch-tasks-viewAll'">View all</button>
       </div>
     </template>
     <Loader v-if="loading" :loaderRows="loaderRows" />
diff --git a/app/javascript/vue/global_search/groups/projects.vue b/app/javascript/vue/global_search/groups/projects.vue
index eef9cabb2..9d89bc222 100644
--- a/app/javascript/vue/global_search/groups/projects.vue
+++ b/app/javascript/vue/global_search/groups/projects.vue
@@ -1,5 +1,5 @@
 <template>
-  <div ref="content" class="bg-white rounded" :class="{ 'p-4 mb-4': results.length || loading }">
+  <div ref="content" class="bg-white rounded" :class="{ 'p-4 mb-4': results.length || loading }" :data-e2e="'e2e-CO-globalSearch-projects'">
     <template v-if="total && results.length">
       <div class="flex items-center">
         <h2 class="flex items-center gap-2 mt-0 mb-4">
@@ -7,7 +7,7 @@
           {{ i18n.t('search.index.projects') }}
           <span class="text-base" >[{{ total }}]</span>
         </h2>
-        <SortFlyout v-if="selected" :sort="sort" @changeSort="changeSort"></SortFlyout>
+        <SortFlyout v-if="selected" :sort="sort" @changeSort="changeSort" :e2eSortButton="'e2e-BT-globalSearch-projects-sort'"></SortFlyout>
       </div>
       <div class="grid grid-cols-[auto_110px_auto_auto_auto] items-center">
         <TableHeader :selected="selected" :columnNames="[
@@ -28,7 +28,7 @@
       </div>
       <div v-if="viewAll">
         <hr class="w-full mb-4 mt-0">
-        <button class="btn btn-light" @click="$emit('selectGroup', 'ProjectsComponent')">View all</button>
+        <button class="btn btn-light" @click="$emit('selectGroup', 'ProjectsComponent')" :data-e2e="'e2e-BT-globalSearch-projects-viewAll'">View all</button>
       </div>
     </template>
     <Loader v-if="loading" :loaderRows="loaderRows" />
diff --git a/app/javascript/vue/global_search/groups/protocols.vue b/app/javascript/vue/global_search/groups/protocols.vue
index e2e4a8126..698626e31 100644
--- a/app/javascript/vue/global_search/groups/protocols.vue
+++ b/app/javascript/vue/global_search/groups/protocols.vue
@@ -1,5 +1,5 @@
 <template>
-  <div ref="content" class="bg-white rounded" :class="{ 'p-4 mb-4': results.length || loading }">
+  <div ref="content" class="bg-white rounded" :class="{ 'p-4 mb-4': results.length || loading }" :data-e2e="'e2e-CO-globalSearch-protocolTemplates'">
     <template v-if="total && results.length">
       <div class="flex items-center">
         <h2 class="flex items-center gap-2 mt-0 mb-4">
@@ -7,7 +7,7 @@
           {{ i18n.t('search.index.protocol_templates') }}
           <span class="text-base" >[{{ total }}]</span>
         </h2>
-        <SortFlyout v-if="selected" :sort="sort" @changeSort="changeSort"></SortFlyout>
+        <SortFlyout v-if="selected" :sort="sort" @changeSort="changeSort" :e2eSortButton="'e2e-BT-globalSearch-protocolTemplates-sort'"></SortFlyout>
       </div>
       <div class="grid grid-cols-[auto_110px_auto_auto_auto_auto] items-center">
         <TableHeader :selected="selected" :columnNames="[
@@ -29,7 +29,7 @@
       </div>
       <div v-if="viewAll">
         <hr class="w-full mb-4 mt-0">
-        <button class="btn btn-light" @click="$emit('selectGroup', 'ProtocolsComponent')">View all</button>
+        <button class="btn btn-light" @click="$emit('selectGroup', 'ProtocolsComponent')" :data-e2e="'e2e-BT-globalSearch-protocolTemplates-viewAll'">View all</button>
       </div>
     </template>
     <Loader v-if="loading" :loaderRows="loaderRows" />
diff --git a/app/javascript/vue/global_search/groups/reports.vue b/app/javascript/vue/global_search/groups/reports.vue
index c711c4e89..a81991881 100644
--- a/app/javascript/vue/global_search/groups/reports.vue
+++ b/app/javascript/vue/global_search/groups/reports.vue
@@ -1,5 +1,5 @@
 <template>
-  <div ref="content" class="bg-white rounded" :class="{ 'p-4 mb-4': results.length || loading }">
+  <div ref="content" class="bg-white rounded" :class="{ 'p-4 mb-4': results.length || loading }" :data-e2e="'e2e-CO-globalSearch-reports'">
     <template v-if="total && results.length">
       <div class="flex items-center">
         <h2 class="flex items-center gap-2 mt-0 mb-4">
@@ -7,7 +7,7 @@
           {{ i18n.t('search.index.reports') }}
           <span class="text-base" >[{{ total }}]</span>
         </h2>
-        <SortFlyout v-if="selected" :sort="sort" @changeSort="changeSort"></SortFlyout>
+        <SortFlyout v-if="selected" :sort="sort" @changeSort="changeSort" :e2eSortButton="'e2e-BT-globalSearch-reports-sort'"></SortFlyout>
       </div>
       <div class="grid grid-cols-[auto_110px_auto_auto_auto_auto_auto] items-center">
         <TableHeader :selected="selected" :columnNames="[
@@ -31,7 +31,7 @@
       </div>
       <div v-if="viewAll">
         <hr class="w-full mb-4 mt-0">
-        <button class="btn btn-light" @click="$emit('selectGroup', 'ReportsComponent')">View all</button>
+        <button class="btn btn-light" @click="$emit('selectGroup', 'ReportsComponent')" :data-e2e="'e2e-BT-globalSearch-reports-viewAll'">View all</button>
       </div>
     </template>
     <Loader v-if="loading" :loaderRows="loaderRows" />
diff --git a/app/javascript/vue/global_search/groups/repository_rows.vue b/app/javascript/vue/global_search/groups/repository_rows.vue
index 8f4b5576d..50e4a7dfa 100644
--- a/app/javascript/vue/global_search/groups/repository_rows.vue
+++ b/app/javascript/vue/global_search/groups/repository_rows.vue
@@ -1,5 +1,5 @@
 <template>
-  <div ref="content" class="bg-white rounded" :class="{ 'p-4 mb-4': results.length || loading }">
+  <div ref="content" class="bg-white rounded" :class="{ 'p-4 mb-4': results.length || loading }" :data-e2e="'e2e-CO-globalSearch-inventoryItems'">
     <template v-if="total && results.length">
       <div class="flex items-center">
         <h2 class="flex items-center gap-2 mt-0 mb-4">
@@ -7,7 +7,7 @@
           {{ i18n.t('search.index.inventory_items') }}
           <span class="text-base" >[{{ total }}]</span>
         </h2>
-        <SortFlyout v-if="selected" :sort="sort" @changeSort="changeSort"></SortFlyout>
+        <SortFlyout v-if="selected" :sort="sort" @changeSort="changeSort" :e2eSortButton="'e2e-BT-globalSearch-inventoryItems-sort'"></SortFlyout>
       </div>
       <div class="grid grid-cols-[auto_110px_auto_auto_auto_auto] items-center">
         <TableHeader :selected="selected" :columnNames="[
@@ -29,7 +29,7 @@
       </div>
       <div v-if="viewAll">
         <hr class="w-full mb-4 mt-0">
-        <button class="btn btn-light" @click="$emit('selectGroup', 'RepositoryRowsComponent')">View all</button>
+        <button class="btn btn-light" @click="$emit('selectGroup', 'RepositoryRowsComponent')" :data-e2e="'e2e-BT-globalSearch-inventoryItems-viewAll'">View all</button>
       </div>
     </template>
     <Loader v-if="loading" :loaderRows="loaderRows" />
diff --git a/app/javascript/vue/global_search/groups/results.vue b/app/javascript/vue/global_search/groups/results.vue
index c497115cc..7d26ec314 100644
--- a/app/javascript/vue/global_search/groups/results.vue
+++ b/app/javascript/vue/global_search/groups/results.vue
@@ -1,5 +1,5 @@
 <template>
-  <div ref="content" class="bg-white rounded" :class="{ 'p-4 mb-4': results.length || loading }">
+  <div ref="content" class="bg-white rounded" :class="{ 'p-4 mb-4': results.length || loading }" :data-e2e="'e2e-CO-globalSearch-results'">
     <template v-if="total && results.length">
       <div class="flex items-center">
         <h2 class="flex items-center gap-2 mt-0 mb-4">
@@ -7,7 +7,7 @@
           {{ i18n.t('search.index.task_results') }}
           <span class="text-base" >[{{ total }}]</span>
         </h2>
-        <SortFlyout v-if="selected" :sort="sort" @changeSort="changeSort"></SortFlyout>
+        <SortFlyout v-if="selected" :sort="sort" @changeSort="changeSort" :e2eSortButton="'e2e-BT-globalSearch-results-sort'"></SortFlyout>
       </div>
       <div class="grid grid-cols-[auto_auto_auto_auto_auto_auto] items-center">
         <TableHeader :selected="selected" :columnNames="[
@@ -29,7 +29,7 @@
       </div>
       <div v-if="viewAll">
         <hr class="w-full mb-4 mt-0">
-        <button class="btn btn-light" @click="$emit('selectGroup', 'ResultsComponent')">View all</button>
+        <button class="btn btn-light" @click="$emit('selectGroup', 'ResultsComponent')" :data-e2e="'e2e-BT-globalSearch-results-viewAll'">View all</button>
       </div>
     </template>
     <Loader v-if="loading" :loaderRows="loaderRows" />
diff --git a/app/javascript/vue/navigation/quick_search.vue b/app/javascript/vue/navigation/quick_search.vue
index 3c7dedc6f..f293f7362 100644
--- a/app/javascript/vue/navigation/quick_search.vue
+++ b/app/javascript/vue/navigation/quick_search.vue
@@ -3,7 +3,7 @@
     <template v-slot:field>
       <div class="sci--navigation--top-menu-search left-icon sci-input-container-v2"
         :class="{'disabled' : !currentTeam, 'error': invalidQuery}" :title="i18n.t('nav.search')"
-      >
+       :data-e2e="'e2e-IF-topMenu-search'">
         <input ref="searchField" type="text" class="!pr-20" v-model="searchQuery"
                :class="{'active': flyoutOpened}"
                @keydown="focusHistoryItem"
@@ -12,11 +12,11 @@
                @focus="openHistory" :placeholder="i18n.t('nav.search')" @keydown.enter="saveQuery"/>
         <i class="sn-icon sn-icon-search"></i>
         <div v-if="this.searchQuery.length > 1" class="flex items-center gap-1 absolute right-2 top-1.5">
-          <button class="btn btn-light icon-btn btn-xs" @click="this.searchQuery = ''; $refs.searchField.focus()">
+          <button class="btn btn-light icon-btn btn-xs" @click="this.searchQuery = ''; $refs.searchField.focus()" :data-e2e="'e2e-BT-topMenu-searchClear'">
             <i class="sn-icon sn-icon-close  !m-0" :title="i18n.t('nav.clear')"></i>
           </button>
           <button class="btn btn-light icon-btn btn-xs" :title="i18n.t('search.quick_search.search_options')"
-               :class="{'active': filtersOpened}" @click="filtersOpened = !filtersOpened">
+               :class="{'active': filtersOpened}" @click="filtersOpened = !filtersOpened" :data-e2e="'e2e-BT-topMenu-searchFilters'">
             <i class="sn-icon sn-icon-search-options !m-0"></i>
           </button>
         </div>
@@ -34,7 +34,7 @@
         :searchQuery="searchQuery"
         @cancel="filtersOpened = false"
       ></SearchFilters>
-      <div v-else-if="showHistory" class="max-w-[600px]">
+      <div v-else-if="showHistory" class="max-w-[600px]" data-e2e="e2e-DD-topMenu-searchHistory">
         <div v-for="(query, i) in reversedPreviousQueries" @click="setQuery(query)" :key="i"
              ref="historyItems"
              tabindex="1"
@@ -45,22 +45,25 @@
           {{ query }}
         </div>
       </div>
-      <div v-else class="w-[600px]">
+      <div v-else class="w-[600px]" data-e2e="e2e-FO-topMenu-quickSearch">
         <div class="flex items-center gap-2">
           <button class="btn btn-secondary btn-xs"
                   ref="experimentGroup"
                   :class="{'active': quickFilter === 'experiments'}"
-                  @click="setQuickFilter('experiments')">
+                  @click="setQuickFilter('experiments')"
+                  :data-e2e="'e2e-BT-topMenu-quickSearch-experiments'">
             {{ i18n.t('search.quick_search.experiments') }}
           </button>
           <button class="btn btn-secondary btn-xs"
                   :class="{'active': quickFilter === 'my_modules'}"
-                  @click="setQuickFilter('my_modules')">
+                  @click="setQuickFilter('my_modules')"
+                  :data-e2e="'e2e-BT-topMenu-quickSearch-tasks'">
             {{ i18n.t('search.quick_search.tasks') }}
           </button>
           <button class="btn btn-secondary btn-xs"
                   :class="{'active': quickFilter === 'results'}"
-                  @click="setQuickFilter('results')">
+                  @click="setQuickFilter('results')"
+                  :data-e2e="'e2e-BT-topMenu-quickSearch-taskResults'">
             {{ i18n.t('search.quick_search.results') }}
           </button>
         </div>
@@ -110,7 +113,7 @@
           </div>
         </div>
         <hr class="my-2">
-        <button class="btn btn-light truncate !block leading-10 max-w-[600px]" @click="searchValue">
+        <button class="btn btn-light truncate !block leading-10 max-w-[600px]" @click="searchValue" :data-e2e="'e2e-BT-topMenu-quickSearch-allSearchResults'">
           {{ i18n.t('search.quick_search.all_results', {query: searchQuery}) }}
         </button>
       </div>
diff --git a/app/javascript/vue/repositories/table.vue b/app/javascript/vue/repositories/table.vue
index ed3fe33f8..c451bf365 100644
--- a/app/javascript/vue/repositories/table.vue
+++ b/app/javascript/vue/repositories/table.vue
@@ -26,6 +26,11 @@
     confirmClass="btn btn-danger"
     :confirmText="i18n.t('repositories.index.modal_delete.delete')"
     ref="deleteModal"
+    :e2eModalName="deleteModal.e2eModalName"
+    :e2eTitle="deleteModal.e2eTitle"
+    :e2eClose="deleteModal.e2eClose"
+    :e2eCancel="deleteModal.e2eCancel"
+    :e2eConfirm="deleteModal.e2eConfirm"
   ></ConfirmationModal>
   <ConfirmationModal
     :title="exportModal.title"
@@ -111,7 +116,12 @@ export default {
       shareRepository: null,
       deleteModal: {
         title: '',
-        description: ''
+        description: '',
+        e2eModalName: '',
+        e2eTitle: '',
+        e2eClose: '',
+        e2eCancel: '',
+        e2eConfirm: '',
       },
       exportModal: {
         title: '',
@@ -250,10 +260,15 @@ export default {
     },
     async deleteRepository(event, rows) {
       const [repository] = rows;
+      this.deleteModal.e2eModalName = 'e2e-MD-deleteInventory';
+      this.deleteModal.e2eTitle = 'e2e-TX-deleteInventoryModal-title',
+      this.deleteModal.e2eClose = 'e2e-BT-deleteInventoryModal-close',
+      this.deleteModal.e2eCancel = 'e2e-BT-deleteInventoryModal-cancel',
+      this.deleteModal.e2eConfirm = 'e2e-BT-deleteInventoryModal-delete',
       this.deleteModal.title = this.i18n.t('repositories.index.modal_delete.title_html', { name: repository.name });
       this.deleteModal.description = `
-        <p>${this.i18n.t('repositories.index.modal_delete.message_html', { name: repository.name })}</p>
-        <div class="alert alert-danger" role="alert">
+        <p data-e2e="e2e-TX-deleteInventoryModal-info">${this.i18n.t('repositories.index.modal_delete.message_html', { name: repository.name })}</p>
+        <div class="alert alert-danger" role="alert" data-e2e="e2e-TX-deleteInventoryModal-warning">
           <span class="fas fa-exclamation-triangle"></span>
           ${this.i18n.t('repositories.index.modal_delete.alert_heading')}
           <ul>
diff --git a/app/javascript/vue/shared/confirmation_modal.vue b/app/javascript/vue/shared/confirmation_modal.vue
index 8ef8b95a1..e0248dc0d 100644
--- a/app/javascript/vue/shared/confirmation_modal.vue
+++ b/app/javascript/vue/shared/confirmation_modal.vue
@@ -1,17 +1,17 @@
 <template>
   <div ref="modal" @keydown.esc="cancel" class="modal" tabindex="-1" role="dialog">
-    <div class="modal-dialog" role="document">
+    <div class="modal-dialog" role="document" :data-e2e="e2eModalName">
       <div class="modal-content">
         <div class="modal-header">
-          <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="sn-icon sn-icon-close"></i></button>
-          <h4 class="modal-title">
+          <button type="button" class="close" data-dismiss="modal" aria-label="Close" :data-e2e="e2eClose"><i class="sn-icon sn-icon-close"></i></button>
+          <h4 class="modal-title" :data-e2e="e2eTitle">
             {{ title }}
           </h4>
         </div>
         <div class="modal-body" v-html="description"></div>
         <div class="modal-footer">
-          <button :class="cancelClass" @click="cancel">{{ cancelText || i18n.t('general.cancel') }}</button>
-          <button :class="confirmClass" @click="confirm">{{ confirmText || i18n.t('general.confirm') }}</button>
+          <button :class="cancelClass" @click="cancel" :data-e2e="e2eCancel">{{ cancelText || i18n.t('general.cancel') }}</button>
+          <button :class="confirmClass" @click="confirm" :data-e2e="e2eConfirm">{{ confirmText || i18n.t('general.confirm') }}</button>
         </div>
       </div>
     </div>
@@ -42,6 +42,26 @@
       confirmClass: {
         type: String,
         default: 'btn btn-primary'
+      },
+      e2eModalName: {
+        type: String,
+        default: ''
+      },
+      e2eTitle: {
+        type: String,
+        default: ''
+      },
+      e2eClose: {
+        type: String,
+        default: ''
+      },
+      e2eCancel: {
+        type: String,
+        default: ''
+      },
+      e2eConfirm: {
+        type: String,
+        default: ''
       }
     },
     mounted() {
diff --git a/app/javascript/vue/shared/menu_dropdown.vue b/app/javascript/vue/shared/menu_dropdown.vue
index 739b0f84a..cbff976ac 100644
--- a/app/javascript/vue/shared/menu_dropdown.vue
+++ b/app/javascript/vue/shared/menu_dropdown.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="relative" v-if="listItems.length > 0 || alwaysShow" v-click-outside="closeMenu" >
-    <button ref="field" :class="btnClasses" :title="title" @click="isOpen = !isOpen">
+    <button ref="field" :class="btnClasses" :title="title" @click="isOpen = !isOpen" :data-e2e="e2eSortButton">
       <i v-if="btnIcon" :class="btnIcon"></i>
       {{ btnText }}
       <i v-if="caret && isOpen" class="sn-icon sn-icon-up"></i>
@@ -79,11 +79,12 @@ export default {
     btnIcon: { type: String, required: false },
     caret: { type: Boolean, default: false },
     alwaysShow: { type: Boolean, default: false },
-    title: { type: String, default: '' }
+    title: { type: String, default: '' },
+    e2eSortButton: { type: String, default: '' }
   },
   data() {
     return {
-      isOpen: false
+      isOpen: false,
     };
   },
   directives: {