From cf05167884084a199512a1d18d41cc9fde7a4fc7 Mon Sep 17 00:00:00 2001
From: Julia <76391113+jmalinna@users.noreply.github.com>
Date: Wed, 21 Aug 2024 22:36:28 +0200
Subject: [PATCH] feat(content-sidebar): Add data-target-id to menu items
 (#3610)

* feat(content-sidebar): Add data-target-id to MenuItem

* feat(content-sidebar): Update data target ids

* feat(content-sidebar): Update snapshot

* feat(content-sidebar): Add data target ids to the modal elements

* feat(content-sidebar): Update ids to camel case

* feat(content-sidebar): Update Task Form ids
---
 src/elements/content-sidebar/AddTaskMenu.js          | 12 ++++++++++--
 .../__tests__/__snapshots__/AddTaskMenu.test.js.snap |  2 ++
 .../activity-feed/task-form/TaskForm.js              |  9 ++++++++-
 3 files changed, 20 insertions(+), 3 deletions(-)

diff --git a/src/elements/content-sidebar/AddTaskMenu.js b/src/elements/content-sidebar/AddTaskMenu.js
index f6ce2090f6..176ec092c2 100644
--- a/src/elements/content-sidebar/AddTaskMenu.js
+++ b/src/elements/content-sidebar/AddTaskMenu.js
@@ -28,7 +28,11 @@ const AddTaskMenu = (props: Props) => (
             </MenuToggle>
         </Button>
         <Menu className="bcs-AddTaskMenu">
-            <MenuItem className="bcs-AddTaskMenu-menuItem" onClick={() => props.onMenuItemClick(TASK_TYPE_GENERAL)}>
+            <MenuItem
+                className="bcs-AddTaskMenu-menuItem"
+                data-target-id="MenuItem-generalTask"
+                onClick={() => props.onMenuItemClick(TASK_TYPE_GENERAL)}
+            >
                 <div className="bcs-AddTaskMenu-icon">
                     <IconTaskGeneral width={30} height={30} />
                 </div>
@@ -41,7 +45,11 @@ const AddTaskMenu = (props: Props) => (
                     </div>
                 </div>
             </MenuItem>
-            <MenuItem className="bcs-AddTaskMenu-menuItem" onClick={() => props.onMenuItemClick(TASK_TYPE_APPROVAL)}>
+            <MenuItem
+                className="bcs-AddTaskMenu-menuItem"
+                data-target-id="MenuItem-approvalTask"
+                onClick={() => props.onMenuItemClick(TASK_TYPE_APPROVAL)}
+            >
                 <div className="bcs-AddTaskMenu-icon">
                     <IconTaskApproval width={30} height={30} />
                 </div>
diff --git a/src/elements/content-sidebar/__tests__/__snapshots__/AddTaskMenu.test.js.snap b/src/elements/content-sidebar/__tests__/__snapshots__/AddTaskMenu.test.js.snap
index e89c6ef475..ac8967ce33 100644
--- a/src/elements/content-sidebar/__tests__/__snapshots__/AddTaskMenu.test.js.snap
+++ b/src/elements/content-sidebar/__tests__/__snapshots__/AddTaskMenu.test.js.snap
@@ -27,6 +27,7 @@ exports[`elements/content-sidebar/AddTaskMenu render should render a default com
   >
     <MenuItem
       className="bcs-AddTaskMenu-menuItem"
+      data-target-id="MenuItem-generalTask"
       onClick={[Function]}
     >
       <div
@@ -58,6 +59,7 @@ exports[`elements/content-sidebar/AddTaskMenu render should render a default com
     </MenuItem>
     <MenuItem
       className="bcs-AddTaskMenu-menuItem"
+      data-target-id="MenuItem-approvalTask"
       onClick={[Function]}
     >
       <div
diff --git a/src/elements/content-sidebar/activity-feed/task-form/TaskForm.js b/src/elements/content-sidebar/activity-feed/task-form/TaskForm.js
index 3f8f8e3059..747de9ecc0 100644
--- a/src/elements/content-sidebar/activity-feed/task-form/TaskForm.js
+++ b/src/elements/content-sidebar/activity-feed/task-form/TaskForm.js
@@ -382,7 +382,10 @@ class TaskForm extends React.Component<Props, State> {
                             className={pillSelectorOverlayClasses}
                             error={this.getErrorByFieldname('taskAssignees')}
                             disabled={isForbiddenErrorOnEdit}
-                            inputProps={{ 'data-testid': 'task-form-assignee-input' }}
+                            inputProps={{
+                                'data-testid': 'task-form-assignee-input',
+                                'data-target-id': 'PillSelectorDropdown-selectAssigneesInput',
+                            }}
                             isRequired
                             label={<FormattedMessage {...messages.tasksAddTaskFormSelectAssigneesLabel} />}
                             name="taskAssignees"
@@ -443,6 +446,7 @@ class TaskForm extends React.Component<Props, State> {
                         <TextArea
                             className="bcs-task-name-input"
                             data-testid="task-form-name-input"
+                            data-target-id="TextArea-messageInput"
                             disabled={isDisabled || isForbiddenErrorOnEdit}
                             error={this.getErrorByFieldname('taskName')}
                             isRequired
@@ -460,6 +464,7 @@ class TaskForm extends React.Component<Props, State> {
                             inputProps={{
                                 [INTERACTION_TARGET]: ACTIVITY_TARGETS.TASK_DATE_PICKER,
                                 'data-testid': 'task-form-date-input',
+                                'data-target-id': 'DatePicker-dateInput',
                             }}
                             isAccessible
                             isDisabled={isForbiddenErrorOnEdit}
@@ -477,6 +482,7 @@ class TaskForm extends React.Component<Props, State> {
                                 className="bcs-task-input-cancel-btn"
                                 data-resin-target={ACTIVITY_TARGETS.APPROVAL_FORM_CANCEL}
                                 data-testid="task-form-cancel-button"
+                                data-target-id="Button-cancelButton"
                                 onClick={this.handleCancelClick}
                                 isDisabled={isLoading}
                                 type="button"
@@ -488,6 +494,7 @@ class TaskForm extends React.Component<Props, State> {
                                 className="bcs-task-input-submit-btn"
                                 data-resin-target={ACTIVITY_TARGETS.APPROVAL_FORM_POST}
                                 data-testid="task-form-submit-button"
+                                data-target-id="PrimaryButton-submitButton"
                                 isDisabled={isForbiddenErrorOnEdit}
                                 isLoading={isLoading}
                                 {...this.addResinInfo()}