From d41ee987f55cbc46d6e4371766d053cf70e72dc9 Mon Sep 17 00:00:00 2001
From: Klemen Benedicic <klemen.benedicic@scinote.net>
Date: Fri, 2 Aug 2024 14:03:21 +0200
Subject: [PATCH] Add data-e2e to publish protocol, delete draft and linked
 tasks modals [SCI-10956]

---
 .../vue/protocol/modals/publish_protocol.vue  | 19 ++++-----
 .../protocols/modals/linked_my_modules.vue    | 15 ++++---
 .../vue/protocols/modals/versions.vue         |  8 ++++
 .../vue/shared/confirmation_modal.vue         |  2 +-
 .../protocols/_protocol_status_bar.html.erb   | 40 +++++++++++--------
 5 files changed, 52 insertions(+), 32 deletions(-)

diff --git a/app/javascript/vue/protocol/modals/publish_protocol.vue b/app/javascript/vue/protocol/modals/publish_protocol.vue
index 742b8b090..ce336e758 100644
--- a/app/javascript/vue/protocol/modals/publish_protocol.vue
+++ b/app/javascript/vue/protocol/modals/publish_protocol.vue
@@ -1,30 +1,31 @@
 <template>
   <div ref="modal" @keydown.esc="cancel" class="modal publish-modal" tabindex="-1" role="dialog">
     <div class="modal-dialog" role="document">
-      <div class="modal-content">
+      <div class="modal-content" data-e2e="e2e-MD-publishProtocol">
         <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="e2e-BT-publishProtocol-close"><i class="sn-icon sn-icon-close"></i></button>
+          <h4 class="modal-title" data-e2e="e2e-TX-publishProtocol-title">
             {{ i18n.t('protocols.publish_modal.title', { nr: protocol.attributes.version })}}
           </h4>
         </div>
         <div class="modal-body">
           <div class="sci-input-container">
-            <label>{{ i18n.t('protocols.publish_modal.name')}}</label>
-            <div>{{ protocol.attributes.name }}</div>
+            <label data-e2e="e2e-TX-publishProtocol-templateNameLabel">{{ i18n.t('protocols.publish_modal.name')}}</label>
+            <div data-e2e="e2e-TX-publishProtocol-templateName">{{ protocol.attributes.name }}</div>
           </div>
           <div class="sci-input-container">
-            <label>{{ i18n.t('protocols.publish_modal.comment')}}</label>
+            <label data-e2e="e2e-TX-publishProtocol-revisionNotesLabel">{{ i18n.t('protocols.publish_modal.comment')}}</label>
             <textarea ref="textarea"
                       v-model="protocol.attributes.version_comment"
                       class="sci-input-field"
-                      :placeholder="i18n.t('protocols.publish_modal.comment_placeholder')">
+                      :placeholder="i18n.t('protocols.publish_modal.comment_placeholder')"
+                      data-e2e="e2e-IF-publishProtocol-revisionNotes">
             </textarea>
           </div>
         </div>
         <div class="modal-footer">
-          <button class="btn btn-secondary" @click="cancel">{{ i18n.t('general.cancel') }}</button>
-          <button class="btn btn-primary" @click="confirm">{{ i18n.t('protocols.publish_modal.publish')}}</button>
+          <button class="btn btn-secondary" @click="cancel" data-e2e="e2e-BT-publishProtocol-cancel">{{ i18n.t('general.cancel') }}</button>
+          <button class="btn btn-primary" @click="confirm" data-e2e="e2e-BT-publishProtocol-publish">{{ i18n.t('protocols.publish_modal.publish')}}</button>
         </div>
       </div>
     </div>
diff --git a/app/javascript/vue/protocols/modals/linked_my_modules.vue b/app/javascript/vue/protocols/modals/linked_my_modules.vue
index 10305252d..13e18be2a 100644
--- a/app/javascript/vue/protocols/modals/linked_my_modules.vue
+++ b/app/javascript/vue/protocols/modals/linked_my_modules.vue
@@ -1,12 +1,12 @@
 <template>
   <div ref="modal" class="modal" tabindex="-1" role="dialog">
     <div class="modal-dialog" role="document">
-      <div class="modal-content ">
+      <div class="modal-content " data-e2e="e2e-MD-linkedTasks">
         <div class="modal-header">
-          <button type="button" class="close self-start" data-dismiss="modal" aria-label="Close">
+          <button type="button" class="close self-start" data-dismiss="modal" aria-label="Close" data-e2e="e2e-BT-linkedTasksModal-close">
             <i class="sn-icon sn-icon-close"></i>
           </button>
-          <h4 class="modal-title line-clamp-3" style="display: -webkit-box;">
+          <h4 class="modal-title line-clamp-3" style="display: -webkit-box;" data-e2e="e2e-TX-linkedTasksModal-title">
             {{ i18n.t('protocols.index.linked_children.title', { protocol: protocol.name }) }}
           </h4>
         </div>
@@ -18,6 +18,7 @@
                 :options="versionsList"
                 :value="selectedVersion"
                 @change="changeSelectedVersion"
+                e2eValue="e2e-DD-linkedTasksModal-version"
               ></SelectDropdown>
             </div>
           </div>
@@ -25,7 +26,11 @@
           <perfect-scrollbar
             class="max-h-96 relative flex flex-col gap-6 pr-8"
             @ps-scroll-y="onScroll" ref="linkedMyModules">
-            <div v-for="(myModule, idx) in linkedMyModules" class="flex items-center gap-1 flex-wrap w-full">
+            <div
+              v-for="(myModule, idx) in linkedMyModules"
+              class="flex items-center gap-1 flex-wrap w-full"
+              :data-e2e="`e2e-BC-linkedTasksModal-${myModule.my_module_name.replaceAll(/\W/g, '')}`"
+            >
               <div v-if="myModule.project_folder_name" class="flex items-center ">
                 <a :href="myModule.project_folder_url"
                     :title="myModule.project_folder_name"
@@ -67,7 +72,7 @@
           </perfect-scrollbar>
         </div>
         <div class="modal-footer">
-          <button type="button" class="btn btn-secondary" data-dismiss="modal">{{ i18n.t('general.cancel') }}</button>
+          <button type="button" class="btn btn-secondary" data-dismiss="modal" data-e2e="e2e-BT-linkedTasksModal-cancel">{{ i18n.t('general.cancel') }}</button>
         </div>
       </div>
     </div>
diff --git a/app/javascript/vue/protocols/modals/versions.vue b/app/javascript/vue/protocols/modals/versions.vue
index 781522703..ec06f0b00 100644
--- a/app/javascript/vue/protocols/modals/versions.vue
+++ b/app/javascript/vue/protocols/modals/versions.vue
@@ -112,6 +112,14 @@
     `"
     :confirmClass="'btn btn-danger'"
     :confirmText="i18n.t('protocols.delete_draft_modal.confirm')"
+    :e2eAttributes="{
+          modalName: 'e2e-MD-deleteProtocolDraft',
+          title: 'e2e-TX-deleteProtocolDraftModal-title',
+          content: 'e2e-TX-deleteProtocolDraftModal-content',
+          close: 'e2e-BT-deleteProtocolDraftModal-close',
+          cancel: 'e2e-BT-deleteProtocolDraftModal-cancel',
+          confirm: 'e2e-BT-deleteProtocolDraftModal-delete'
+    }"
     ref="destroyModal"
   ></ConfirmationModal>
 </template>
diff --git a/app/javascript/vue/shared/confirmation_modal.vue b/app/javascript/vue/shared/confirmation_modal.vue
index 45f5ee48f..96e8cbf34 100644
--- a/app/javascript/vue/shared/confirmation_modal.vue
+++ b/app/javascript/vue/shared/confirmation_modal.vue
@@ -8,7 +8,7 @@
             {{ title }}
           </h4>
         </div>
-        <div class="modal-body" v-html="description"></div>
+        <div class="modal-body" v-html="description" :data-e2e="e2eAttributes.content"></div>
         <div class="modal-footer">
           <button :class="cancelClass" @click="cancel" :data-e2e="e2eAttributes.cancel">{{ cancelText || i18n.t('general.cancel') }}</button>
           <button :class="confirmClass" @click="confirm" :data-e2e="e2eAttributes.confirm">{{ confirmText || i18n.t('general.confirm') }}</button>
diff --git a/app/views/my_modules/protocols/_protocol_status_bar.html.erb b/app/views/my_modules/protocols/_protocol_status_bar.html.erb
index 5b4f78b94..2b59cf701 100644
--- a/app/views/my_modules/protocols/_protocol_status_bar.html.erb
+++ b/app/views/my_modules/protocols/_protocol_status_bar.html.erb
@@ -8,44 +8,46 @@
       [<%= t("my_modules.protocols.protocol_status_bar.unlinked") %>]
     </span>
   <% end %>
-  <a href="#" id="my-module-protocol-info-button" class="status-info dropdown-toggle
+  <a href="#" id="my-module-protocol-info-button" class="status-info dropdown-toggle data-e2e="e2e-BT-task-protocolInfo-openInfo"
     <%= 'parent-newer' if @protocol.parent_newer? %>
     <%= 'protocol-newer' if @protocol.newer_than_parent? %>
     " data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
     <i class="sn-icon sn-icon-info"></i>
   </a>
-  <div class="dropdown-menu status-info-dropdown" aria-labelledby="my-module-protocol-info-button">
+  <div class="dropdown-menu status-info-dropdown" aria-labelledby="my-module-protocol-info-button" data-e2e="e2e-CO-task-protocolInfo">
     <div class="dropdown-content">
         <div class="dropdown-header">
-          <h2 class="protocol-name">
+          <h2 class="protocol-name" data-e2e="e2e-TX-task-protocolInfo-title">
             <%= @protocol.name_with_label %>
           </h2>
           <% if @protocol.linked? %>
             <div class="protocol-header-info">
-              <span><%= t('my_modules.protocols.protocol_status_bar.protocol_id_label') %> <%= @protocol.original_code %></span>
-              <span><%= t('my_modules.protocols.protocol_status_bar.protocol_version_label') %> <%= @protocol.parent&.version_number %></span>
+              <span data-e2e="e2e-TX-task-protocolInfo-id"><%= t('my_modules.protocols.protocol_status_bar.protocol_id_label') %> <%= @protocol.original_code %></span>
+              <span data-e2e="e2e-TX-task-protocolInfo-version">
+                <%= t('my_modules.protocols.protocol_status_bar.protocol_version_label') %> <%= @protocol.parent&.version_number %>
+              </span>
             </div>
           <% end %>
         </div>
         <div class="dropdown-body">
           <% if @protocol.unlinked? %>
             <div class="info-line">
-              <div class="description"><%= t("my_modules.protocols.protocol_status_bar.protocol_created") %></div>
-              <div class="value"><%= I18n.l(@protocol.created_at, format: :full) %></div>
+              <div class="description" data-e2e="e2e-TX-task-protocolInfo-createdLabel"><%= t("my_modules.protocols.protocol_status_bar.protocol_created") %></div>
+              <div class="value" data-e2e="e2e-TX-task-protocolInfo-created"><%= I18n.l(@protocol.created_at, format: :full) %></div>
             </div>
           <% end %>
           <div class="info-line">
-            <div class="description"><%= t("my_modules.protocols.protocol_status_bar.protocol_updated") %></div>
-            <div class="value"><%= I18n.l(@protocol.updated_at, format: :full) %></div>
+            <div class="description" data-e2e="e2e-TX-task-protocolInfo-modifiedLabel"><%= t("my_modules.protocols.protocol_status_bar.protocol_updated") %></div>
+            <div class="value" data-e2e="e2e-TX-task-protocolInfo-modified"><%= I18n.l(@protocol.updated_at, format: :full) %></div>
           </div>
           <% if @protocol.linked?%>
             <div class="info-line">
-              <div class="description"><%= t("my_modules.protocols.protocol_status_bar.protocol_loaded") %></div>
-              <div class="value"><%= @protocol.linked_at ? I18n.l(@protocol.linked_at, format: :full) : '' %></div>
+              <div class="description" data-e2e="e2e-TX-task-protocolInfo-loadedLabel"><%= t("my_modules.protocols.protocol_status_bar.protocol_loaded") %></div>
+              <div class="value" data-e2e="e2e-TX-task-protocolInfo-loaded"><%= @protocol.linked_at ? I18n.l(@protocol.linked_at, format: :full) : '' %></div>
             </div>
             <div class="info-line">
-              <div class="description"><%= t("my_modules.protocols.protocol_status_bar.protocol_published") %></div>
-              <div class="value"><%= I18n.l(@protocol&.parent&.published_on, format: :full) %></div>
+              <div class="description" data-e2e="e2e-TX-task-protocolInfo-publishedLabel"><%= t("my_modules.protocols.protocol_status_bar.protocol_published") %></div>
+              <div class="value" data-e2e="e2e-TX-task-protocolInfo-published"><%= I18n.l(@protocol&.parent&.published_on, format: :full) %></div>
             </div>
           <% end %>
         </div>
@@ -53,14 +55,18 @@
           <% if @protocol.linked? %>
             <% if @protocol.parent_newer? %>
               <div class="notification-line new-parent-version">
-                <i class="sn-icon sn-icon-info"></i>
-                <div class="description"><%= t("my_modules.protocols.protocol_status_bar.messages.template_updated_html") %></div>
+                <i class="sn-icon sn-icon-info" data-e2e="e2e-IC-task-protocolInfo-newVersion"></i>
+                <div class="description" data-e2e="e2e-TX-task-protocolInfo-newVersion">
+                  <%= t("my_modules.protocols.protocol_status_bar.messages.template_updated_html") %>
+                </div>
               </div>
             <% end %>
             <% if @protocol.newer_than_parent? %>
               <div class="notification-line new-protocol-version">
-                <i class="sn-icon sn-icon-info"></i>
-                <div class="description"><%= t("my_modules.protocols.protocol_status_bar.messages.protocol_updated") %></div>
+                <i class="sn-icon sn-icon-info" data-e2e="e2e-IC-task-protocolInfo-protocolModified"></i>
+                <div class="description" data-e2e="e2e-TX-task-protocolInfo-protocolModified">
+                  <%= t("my_modules.protocols.protocol_status_bar.messages.protocol_updated") %>
+                </div>
               </div>
             <% end %>
           <% end %>