diff --git a/src/web/components/icon/CloneIcon.jsx b/src/web/components/icon/CloneIcon.jsx
index 662a7dd5a5..93b468d4b8 100644
--- a/src/web/components/icon/CloneIcon.jsx
+++ b/src/web/components/icon/CloneIcon.jsx
@@ -9,7 +9,7 @@ import withSvgIcon from 'web/components/icon/withSvgIcon';
 const CloneIconComponent = withSvgIcon()(Icon);
 
 const CloneIcon = props => (
-  <CloneIconComponent {...props} data-testid="clone-icon" />
+  <CloneIconComponent data-testid="clone-icon" {...props} />
 );
 
 export default CloneIcon;
diff --git a/src/web/components/icon/DeleteIcon.jsx b/src/web/components/icon/DeleteIcon.jsx
index 021e4b7cb7..59d0e87d5f 100644
--- a/src/web/components/icon/DeleteIcon.jsx
+++ b/src/web/components/icon/DeleteIcon.jsx
@@ -12,7 +12,6 @@ import withSvgIcon from 'web/components/icon/withSvgIcon';
 import PropTypes from 'web/utils/PropTypes';
 import SelectionType from 'web/utils/SelectionType';
 
-
 const DeleteSvgIcon = withSvgIcon()(props => (
   <IconWithStrokeWidth
     IconComponent={Icon}
@@ -31,7 +30,7 @@ const DeleteIcon = ({selectionType, title, ...props}) => {
       title = _('Delete all filtered');
     }
   }
-  return <DeleteSvgIcon {...props} title={title} />;
+  return <DeleteSvgIcon data-testid="delete-icon" {...props} title={title} />;
 };
 
 DeleteIcon.propTypes = {
diff --git a/src/web/components/icon/EditIcon.jsx b/src/web/components/icon/EditIcon.jsx
index 90ee73f90a..6e5b581298 100644
--- a/src/web/components/icon/EditIcon.jsx
+++ b/src/web/components/icon/EditIcon.jsx
@@ -7,12 +7,12 @@ import {Pencil as Icon} from 'lucide-react';
 import IconWithStrokeWidth from 'web/components/icon/IconWithStrokeWidth';
 import withSvgIcon from 'web/components/icon/withSvgIcon';
 
-const EditIcon = withSvgIcon()(props => (
-  <IconWithStrokeWidth
-    IconComponent={Icon}
-    {...props}
-    data-testid="edit-icon"
-  />
+const EditIconComponent = withSvgIcon()(props => (
+  <IconWithStrokeWidth IconComponent={Icon} {...props} />
 ));
 
+const EditIcon = props => (
+  <EditIconComponent data-testid="edit-icon" {...props} />
+);
+
 export default EditIcon;
diff --git a/src/web/components/icon/ExportIcon.jsx b/src/web/components/icon/ExportIcon.jsx
index 843c53670b..da6f61eb72 100644
--- a/src/web/components/icon/ExportIcon.jsx
+++ b/src/web/components/icon/ExportIcon.jsx
@@ -11,7 +11,6 @@ import withSvgIcon from 'web/components/icon/withSvgIcon';
 import PropTypes from 'web/utils/PropTypes';
 import SelectionType from 'web/utils/SelectionType';
 
-
 const ExportSvgIcon = withSvgIcon()(props => (
   <IconWithStrokeWidth IconComponent={Icon} {...props} />
 ));
@@ -27,8 +26,8 @@ const ExportIcon = ({selectionType, title, ...other}) => {
   }
   return (
     <ExportSvgIcon
-      {...other}
       data-testid="export-icon"
+      {...other}
       title={download_title}
     />
   );
diff --git a/src/web/components/icon/FilterIcon.jsx b/src/web/components/icon/FilterIcon.jsx
index 47d9b29b1b..237f50c80c 100644
--- a/src/web/components/icon/FilterIcon.jsx
+++ b/src/web/components/icon/FilterIcon.jsx
@@ -7,12 +7,12 @@ import {Filter as Icon} from 'lucide-react';
 import IconWithStrokeWidth from 'web/components/icon/IconWithStrokeWidth';
 import withSvgIcon from 'web/components/icon/withSvgIcon';
 
-const FilterIcon = withSvgIcon()(props => (
-  <IconWithStrokeWidth
-    IconComponent={Icon}
-    {...props}
-    data-testid="filter-icon"
-  />
+const FilterIconComponent = withSvgIcon()(props => (
+  <IconWithStrokeWidth IconComponent={Icon} {...props} />
 ));
 
+const FilterIcon = props => (
+  <FilterIconComponent data-testid="filter-icon" {...props} />
+);
+
 export default FilterIcon;
diff --git a/src/web/components/icon/HelpIcon.jsx b/src/web/components/icon/HelpIcon.jsx
index 8bf6736a62..d49e0d8cfd 100644
--- a/src/web/components/icon/HelpIcon.jsx
+++ b/src/web/components/icon/HelpIcon.jsx
@@ -7,12 +7,12 @@ import {HelpCircle as Icon} from 'lucide-react';
 import IconWithStrokeWidth from 'web/components/icon/IconWithStrokeWidth';
 import withSvgIcon from 'web/components/icon/withSvgIcon';
 
-const HelpIcon = withSvgIcon()(props => (
-  <IconWithStrokeWidth
-    IconComponent={Icon}
-    {...props}
-    data-testid="help-icon"
-  />
+const HelpIconComponent = withSvgIcon()(props => (
+  <IconWithStrokeWidth IconComponent={Icon} {...props} />
 ));
 
+const HelpIcon = props => (
+  <HelpIconComponent data-testid="help-icon" {...props} />
+);
+
 export default HelpIcon;
diff --git a/src/web/components/icon/NewIcon.jsx b/src/web/components/icon/NewIcon.jsx
index a12cbe6697..2e16f9928f 100644
--- a/src/web/components/icon/NewIcon.jsx
+++ b/src/web/components/icon/NewIcon.jsx
@@ -8,6 +8,6 @@ import withSvgIcon from 'web/components/icon/withSvgIcon';
 
 const NewIconComponent = withSvgIcon()(Icon);
 
-const NewIcon = props => <NewIconComponent {...props} data-testid="new-icon" />;
+const NewIcon = props => <NewIconComponent data-testid="new-icon" {...props} />;
 
 export default NewIcon;
diff --git a/src/web/components/icon/ResetIcon.jsx b/src/web/components/icon/ResetIcon.jsx
index b8d5d4e099..40b8c8e24e 100644
--- a/src/web/components/icon/ResetIcon.jsx
+++ b/src/web/components/icon/ResetIcon.jsx
@@ -7,12 +7,12 @@ import {RotateCcw as Icon} from 'lucide-react';
 import IconWithStrokeWidth from 'web/components/icon/IconWithStrokeWidth';
 import withSvgIcon from 'web/components/icon/withSvgIcon';
 
-const ResetIcon = withSvgIcon()(props => (
-  <IconWithStrokeWidth
-    IconComponent={Icon}
-    {...props}
-    data-testid="reset-icon"
-  />
+const ResetIconComponent = withSvgIcon()(props => (
+  <IconWithStrokeWidth IconComponent={Icon} {...props} />
 ));
 
+const ResetIcon = props => (
+  <ResetIconComponent data-testid="reset-icon" {...props} />
+);
+
 export default ResetIcon;
diff --git a/src/web/components/icon/ResumeIcon.jsx b/src/web/components/icon/ResumeIcon.jsx
index 0309809dab..55f8b9e1c6 100644
--- a/src/web/components/icon/ResumeIcon.jsx
+++ b/src/web/components/icon/ResumeIcon.jsx
@@ -7,12 +7,12 @@ import {StepForward as Icon} from 'lucide-react';
 import IconWithStrokeWidth from 'web/components/icon/IconWithStrokeWidth';
 import withSvgIcon from 'web/components/icon/withSvgIcon';
 
-const ResumeIcon = withSvgIcon()(props => (
-  <IconWithStrokeWidth
-    IconComponent={Icon}
-    {...props}
-    data-testid="resume-icon"
-  />
+const ResumeIconComponent = withSvgIcon()(props => (
+  <IconWithStrokeWidth IconComponent={Icon} {...props} />
 ));
 
+const ResumeIcon = props => (
+  <ResumeIconComponent data-testid="resume-icon" {...props} />
+);
+
 export default ResumeIcon;
diff --git a/src/web/components/icon/Settings2.jsx b/src/web/components/icon/Settings2.jsx
index fa530f5e28..cde407f0f8 100644
--- a/src/web/components/icon/Settings2.jsx
+++ b/src/web/components/icon/Settings2.jsx
@@ -7,12 +7,12 @@ import {Settings2 as Icon} from 'lucide-react';
 import IconWithStrokeWidth from 'web/components/icon/IconWithStrokeWidth';
 import withSvgIcon from 'web/components/icon/withSvgIcon';
 
-const Settings2 = withSvgIcon()(props => (
-  <IconWithStrokeWidth
-    {...props}
-    IconComponent={Icon}
-    data-testid="settings-2-icon"
-  />
+const Settings2Component = withSvgIcon()(props => (
+  <IconWithStrokeWidth {...props} IconComponent={Icon} />
 ));
 
+const Settings2 = props => (
+  <Settings2Component data-testid="settings-2-icon" {...props} />
+);
+
 export default Settings2;
diff --git a/src/web/components/icon/StartIcon.jsx b/src/web/components/icon/StartIcon.jsx
index 83ad39c3c3..a4eacb0f7b 100644
--- a/src/web/components/icon/StartIcon.jsx
+++ b/src/web/components/icon/StartIcon.jsx
@@ -7,12 +7,12 @@ import {Play as Icon} from 'lucide-react';
 import IconWithStrokeWidth from 'web/components/icon/IconWithStrokeWidth';
 import withSvgIcon from 'web/components/icon/withSvgIcon';
 
-const StartIcon = withSvgIcon()(props => (
-  <IconWithStrokeWidth
-    IconComponent={Icon}
-    {...props}
-    data-testid="start-icon"
-  />
+const StartIconComponent = withSvgIcon()(props => (
+  <IconWithStrokeWidth IconComponent={Icon} {...props} />
 ));
 
+const StartIcon = props => (
+  <StartIconComponent data-testid="start-icon" {...props} />
+);
+
 export default StartIcon;
diff --git a/src/web/components/icon/StopIcon.jsx b/src/web/components/icon/StopIcon.jsx
index d2d1e85c09..42a40929c8 100644
--- a/src/web/components/icon/StopIcon.jsx
+++ b/src/web/components/icon/StopIcon.jsx
@@ -7,12 +7,12 @@ import {Square as Icon} from 'lucide-react';
 import IconWithStrokeWidth from 'web/components/icon/IconWithStrokeWidth';
 import withSvgIcon from 'web/components/icon/withSvgIcon';
 
-const StopIcon = withSvgIcon()(props => (
-  <IconWithStrokeWidth
-    IconComponent={Icon}
-    {...props}
-    data-testid="stop-icon"
-  />
+const StopIconComponent = withSvgIcon()(props => (
+  <IconWithStrokeWidth IconComponent={Icon} {...props} />
 ));
 
+const StopIcon = props => (
+  <StopIconComponent data-testid="stop-icon" {...props} />
+);
+
 export default StopIcon;
diff --git a/src/web/components/icon/SvgIcon.jsx b/src/web/components/icon/SvgIcon.jsx
index 198872bd34..b277822fb6 100644
--- a/src/web/components/icon/SvgIcon.jsx
+++ b/src/web/components/icon/SvgIcon.jsx
@@ -87,6 +87,7 @@ const SvgIcon = ({
   onClick,
   size,
   color = Theme.black,
+  ['data-testid']: dataTestId = 'svg-icon',
   ...other
 }) => {
   const [loading, setLoading] = useStateWithMountCheck(false);
@@ -125,7 +126,7 @@ const SvgIcon = ({
       $isLoading={loading}
       $width={width}
       color={color}
-      data-testid="svg-icon"
+      data-testid={dataTestId}
       title={title}
       onClick={
         isDefined(onClick) && !disabled && !loading ? handleClick : undefined
diff --git a/src/web/components/icon/Testing.jsx b/src/web/components/icon/Testing.jsx
index 89c788e648..6c6cf51fb0 100644
--- a/src/web/components/icon/Testing.jsx
+++ b/src/web/components/icon/Testing.jsx
@@ -4,11 +4,12 @@
  */
 
 import {test, expect, testing} from '@gsa/testing';
+import {isDefined} from 'gmp/utils/identity';
 import {ICON_SIZE_SMALL_PIXELS} from 'web/hooks/useIconSize';
 import {render, fireEvent, act} from 'web/utils/Testing';
 import Theme from 'web/utils/Theme';
 
-export const testIcon = Icon => {
+export const testIcon = (Icon, {dataTestId, customDataTestId} = {}) => {
   test('should render with default width and height', () => {
     const {element} = render(<Icon />);
 
@@ -91,4 +92,20 @@ export const testIcon = Icon => {
     expect(element).toHaveAttribute('title', 'foo');
     expect(svgElement).toHaveAttribute('title', 'foo');
   });
+
+  if (isDefined(dataTestId)) {
+    test('should render with default data-testid', () => {
+      const {element} = render(<Icon />);
+
+      expect(element).toHaveAttribute('data-testid', dataTestId);
+    });
+  }
+
+  if (isDefined(customDataTestId)) {
+    test('should render with custom data-testid', () => {
+      const {element} = render(<Icon data-testid={customDataTestId} />);
+
+      expect(element).toHaveAttribute('data-testid', customDataTestId);
+    });
+  }
 };
diff --git a/src/web/components/icon/TrashCanIcon.jsx b/src/web/components/icon/TrashCanIcon.jsx
index 96dd3257cc..ea7660ac74 100644
--- a/src/web/components/icon/TrashCanIcon.jsx
+++ b/src/web/components/icon/TrashCanIcon.jsx
@@ -7,12 +7,12 @@ import {Trash2 as Icon} from 'lucide-react';
 import IconWithStrokeWidth from 'web/components/icon/IconWithStrokeWidth';
 import withSvgIcon from 'web/components/icon/withSvgIcon';
 
-const TrashcanIcon = withSvgIcon()(props => (
-  <IconWithStrokeWidth
-    IconComponent={Icon}
-    {...props}
-    data-testid="trashcan-icon"
-  />
+const TrashcanIconComponent = withSvgIcon()(props => (
+  <IconWithStrokeWidth IconComponent={Icon} {...props} />
 ));
 
+const TrashcanIcon = props => (
+  <TrashcanIconComponent data-testid="trashcan-icon" {...props} />
+);
+
 export default TrashcanIcon;
diff --git a/src/web/components/icon/TrashIcon.jsx b/src/web/components/icon/TrashIcon.jsx
index b03ebc2efe..c2696d9bcd 100644
--- a/src/web/components/icon/TrashIcon.jsx
+++ b/src/web/components/icon/TrashIcon.jsx
@@ -20,7 +20,7 @@ const TrashIcon = ({selectionType, title, ...other}) => {
       title = _('Move all filtered to trashcan');
     }
   }
-  return <TrashcanIcon {...other} data-testid="tash-icon" title={title} />;
+  return <TrashcanIcon data-testid="trash-icon" {...other} title={title} />;
 };
 
 TrashIcon.propTypes = {
diff --git a/src/web/components/icon/TrendMoreIcon.jsx b/src/web/components/icon/TrendMoreIcon.jsx
index b0ef0f64bb..22d2afe8af 100644
--- a/src/web/components/icon/TrendMoreIcon.jsx
+++ b/src/web/components/icon/TrendMoreIcon.jsx
@@ -9,6 +9,6 @@ import withSvgIcon from 'web/components/icon/withSvgIcon';
 const TrendMoreIconComponent = withSvgIcon()(Icon);
 
 const TrendMoreIcon = props => (
-  <TrendMoreIconComponent {...props} data-testid="trend-more-icon" />
+  <TrendMoreIconComponent data-testid="trend-more-icon" {...props} />
 );
 export default TrendMoreIcon;
diff --git a/src/web/components/icon/TrendNoChangeIcon.jsx b/src/web/components/icon/TrendNoChangeIcon.jsx
index bf9bbd2c17..5c6640fdc6 100644
--- a/src/web/components/icon/TrendNoChangeIcon.jsx
+++ b/src/web/components/icon/TrendNoChangeIcon.jsx
@@ -9,7 +9,7 @@ import withSvgIcon from 'web/components/icon/withSvgIcon';
 const TrendNoChangeIconComponent = withSvgIcon()(Icon);
 
 const TrendNoChangeIcon = props => (
-  <TrendNoChangeIconComponent {...props} data-testid="trend-nochange-icon" />
+  <TrendNoChangeIconComponent data-testid="trend-nochange-icon" {...props} />
 );
 
 export default TrendNoChangeIcon;
diff --git a/src/web/components/icon/UploadIcon.jsx b/src/web/components/icon/UploadIcon.jsx
index ccd63ed488..2921517d6e 100644
--- a/src/web/components/icon/UploadIcon.jsx
+++ b/src/web/components/icon/UploadIcon.jsx
@@ -7,12 +7,12 @@ import {Upload as Icon} from 'lucide-react';
 import IconWithStrokeWidth from 'web/components/icon/IconWithStrokeWidth';
 import withSvgIcon from 'web/components/icon/withSvgIcon';
 
-const UploadIcon = withSvgIcon()(props => (
-  <IconWithStrokeWidth
-    IconComponent={Icon}
-    {...props}
-    data-testid="upload-icon"
-  />
+const UploadIconComponent = withSvgIcon()(props => (
+  <IconWithStrokeWidth IconComponent={Icon} {...props} />
 ));
 
+const UploadIcon = props => (
+  <UploadIconComponent data-testid="upload-icon" {...props} />
+);
+
 export default UploadIcon;
diff --git a/src/web/components/icon/__tests__/CloneIcon.test.jsx b/src/web/components/icon/__tests__/CloneIcon.test.jsx
index 0c0ebd7a83..e3fde172b2 100644
--- a/src/web/components/icon/__tests__/CloneIcon.test.jsx
+++ b/src/web/components/icon/__tests__/CloneIcon.test.jsx
@@ -7,7 +7,9 @@ import {describe} from '@gsa/testing';
 import CloneIcon from 'web/components/icon/CloneIcon';
 import {testIcon} from 'web/components/icon/Testing';
 
-
 describe('CloneIcon component tests', () => {
-  testIcon(CloneIcon);
+  testIcon(CloneIcon, {
+    dataTestId: 'clone-icon',
+    customDataTestId: 'custom-clone-icon',
+  });
 });
diff --git a/src/web/components/icon/__tests__/DeleteIcon.test.jsx b/src/web/components/icon/__tests__/DeleteIcon.test.jsx
index 553e8979ba..18f07348b1 100644
--- a/src/web/components/icon/__tests__/DeleteIcon.test.jsx
+++ b/src/web/components/icon/__tests__/DeleteIcon.test.jsx
@@ -7,7 +7,9 @@ import {describe} from '@gsa/testing';
 import DeleteIcon from 'web/components/icon/DeleteIcon';
 import {testIcon} from 'web/components/icon/Testing';
 
-
 describe('DeleteIcon component tests', () => {
-  testIcon(DeleteIcon);
+  testIcon(DeleteIcon, {
+    dataTestId: 'delete-icon',
+    customDataTestId: 'custom-delete-icon',
+  });
 });
diff --git a/src/web/components/icon/__tests__/EditIcon.test.jsx b/src/web/components/icon/__tests__/EditIcon.test.jsx
index c6d73ba33a..3d913da5c5 100644
--- a/src/web/components/icon/__tests__/EditIcon.test.jsx
+++ b/src/web/components/icon/__tests__/EditIcon.test.jsx
@@ -7,7 +7,9 @@ import {describe} from '@gsa/testing';
 import EditIcon from 'web/components/icon/EditIcon';
 import {testIcon} from 'web/components/icon/Testing';
 
-
 describe('EditIcon component tests', () => {
-  testIcon(EditIcon);
+  testIcon(EditIcon, {
+    dataTestId: 'edit-icon',
+    customDataTestId: 'custom-edit-icon',
+  });
 });
diff --git a/src/web/components/icon/__tests__/ExportIcon.test.jsx b/src/web/components/icon/__tests__/ExportIcon.test.jsx
index afd4589114..739a5e0f33 100644
--- a/src/web/components/icon/__tests__/ExportIcon.test.jsx
+++ b/src/web/components/icon/__tests__/ExportIcon.test.jsx
@@ -7,7 +7,9 @@ import {describe} from '@gsa/testing';
 import ExportIcon from 'web/components/icon/ExportIcon';
 import {testIcon} from 'web/components/icon/Testing';
 
-
 describe('ExportIcon component tests', () => {
-  testIcon(ExportIcon);
+  testIcon(ExportIcon, {
+    dataTestId: 'export-icon',
+    customDataTestId: 'custom-export-icon',
+  });
 });
diff --git a/src/web/components/icon/__tests__/FilterIcon.test.jsx b/src/web/components/icon/__tests__/FilterIcon.test.jsx
index 79943db143..8c7b2c4433 100644
--- a/src/web/components/icon/__tests__/FilterIcon.test.jsx
+++ b/src/web/components/icon/__tests__/FilterIcon.test.jsx
@@ -7,7 +7,9 @@ import {describe} from '@gsa/testing';
 import FilterIcon from 'web/components/icon/FilterIcon';
 import {testIcon} from 'web/components/icon/Testing';
 
-
 describe('FilterIcon component tests', () => {
-  testIcon(FilterIcon);
+  testIcon(FilterIcon, {
+    dataTestId: 'filter-icon',
+    customDataTestId: 'custom-filter-icon',
+  });
 });
diff --git a/src/web/components/icon/__tests__/HelpIcon.test.jsx b/src/web/components/icon/__tests__/HelpIcon.test.jsx
index dc3e6a965e..066bdae03f 100644
--- a/src/web/components/icon/__tests__/HelpIcon.test.jsx
+++ b/src/web/components/icon/__tests__/HelpIcon.test.jsx
@@ -7,7 +7,9 @@ import {describe} from '@gsa/testing';
 import HelpIcon from 'web/components/icon/HelpIcon';
 import {testIcon} from 'web/components/icon/Testing';
 
-
 describe('HelpIcon component tests', () => {
-  testIcon(HelpIcon);
+  testIcon(HelpIcon, {
+    dataTestId: 'help-icon',
+    customDataTestId: 'custom-help-icon',
+  });
 });
diff --git a/src/web/components/icon/__tests__/NewIcon.test.jsx b/src/web/components/icon/__tests__/NewIcon.test.jsx
index a34b6449a4..bd1d51339d 100644
--- a/src/web/components/icon/__tests__/NewIcon.test.jsx
+++ b/src/web/components/icon/__tests__/NewIcon.test.jsx
@@ -7,7 +7,9 @@ import {describe} from '@gsa/testing';
 import NewIcon from 'web/components/icon/NewIcon';
 import {testIcon} from 'web/components/icon/Testing';
 
-
 describe('NewIcon component tests', () => {
-  testIcon(NewIcon);
+  testIcon(NewIcon, {
+    dataTestId: 'new-icon',
+    customDataTestId: 'custom-new-icon',
+  });
 });
diff --git a/src/web/components/icon/__tests__/ResetIcon.test.jsx b/src/web/components/icon/__tests__/ResetIcon.test.jsx
index 988c851a7b..a94ade7996 100644
--- a/src/web/components/icon/__tests__/ResetIcon.test.jsx
+++ b/src/web/components/icon/__tests__/ResetIcon.test.jsx
@@ -7,7 +7,9 @@ import {describe} from '@gsa/testing';
 import ResetIcon from 'web/components/icon/ResetIcon';
 import {testIcon} from 'web/components/icon/Testing';
 
-
 describe('ResetIcon component tests', () => {
-  testIcon(ResetIcon);
+  testIcon(ResetIcon, {
+    dataTestId: 'reset-icon',
+    customDataTestId: 'custom-reset-icon',
+  });
 });
diff --git a/src/web/components/icon/__tests__/ResumeIcon.test.jsx b/src/web/components/icon/__tests__/ResumeIcon.test.jsx
index e7dab54edb..36916c9c72 100644
--- a/src/web/components/icon/__tests__/ResumeIcon.test.jsx
+++ b/src/web/components/icon/__tests__/ResumeIcon.test.jsx
@@ -7,7 +7,9 @@ import {describe} from '@gsa/testing';
 import ResumeIcon from 'web/components/icon/ResumeIcon';
 import {testIcon} from 'web/components/icon/Testing';
 
-
 describe('ResumeIcon component tests', () => {
-  testIcon(ResumeIcon);
+  testIcon(ResumeIcon, {
+    dataTestId: 'resume-icon',
+    customDataTestId: 'custom-resume-icon',
+  });
 });
diff --git a/src/web/components/icon/__tests__/Settings2.test.jsx b/src/web/components/icon/__tests__/Settings2.test.jsx
index 1162a0ab9a..4f049609ae 100644
--- a/src/web/components/icon/__tests__/Settings2.test.jsx
+++ b/src/web/components/icon/__tests__/Settings2.test.jsx
@@ -7,7 +7,9 @@ import {describe} from '@gsa/testing';
 import Settings2 from 'web/components/icon/Settings2';
 import {testIcon} from 'web/components/icon/Testing';
 
-
 describe('Settings2 component tests', () => {
-  testIcon(Settings2);
+  testIcon(Settings2, {
+    dataTestId: 'settings-2-icon',
+    customDataTestId: 'custom-settings-2-icon',
+  });
 });
diff --git a/src/web/components/icon/__tests__/StartIcon.test.jsx b/src/web/components/icon/__tests__/StartIcon.test.jsx
index f67e052f37..987f4c6623 100644
--- a/src/web/components/icon/__tests__/StartIcon.test.jsx
+++ b/src/web/components/icon/__tests__/StartIcon.test.jsx
@@ -7,7 +7,9 @@ import {describe} from '@gsa/testing';
 import StartIcon from 'web/components/icon/StartIcon';
 import {testIcon} from 'web/components/icon/Testing';
 
-
 describe('StartIcon component tests', () => {
-  testIcon(StartIcon);
+  testIcon(StartIcon, {
+    dataTestId: 'start-icon',
+    customDataTestId: 'custom-start-icon',
+  });
 });
diff --git a/src/web/components/icon/__tests__/StopIcon.test.jsx b/src/web/components/icon/__tests__/StopIcon.test.jsx
index c19d3a5122..8a375f21bc 100644
--- a/src/web/components/icon/__tests__/StopIcon.test.jsx
+++ b/src/web/components/icon/__tests__/StopIcon.test.jsx
@@ -7,7 +7,9 @@ import {describe} from '@gsa/testing';
 import StopIcon from 'web/components/icon/StopIcon';
 import {testIcon} from 'web/components/icon/Testing';
 
-
 describe('StopIcon component tests', () => {
-  testIcon(StopIcon);
+  testIcon(StopIcon, {
+    dataTestId: 'stop-icon',
+    customDataTestId: 'custom-stop-icon',
+  });
 });
diff --git a/src/web/components/icon/__tests__/SvgIcon.test.jsx b/src/web/components/icon/__tests__/SvgIcon.test.jsx
index 116a56075a..dc07c22815 100644
--- a/src/web/components/icon/__tests__/SvgIcon.test.jsx
+++ b/src/web/components/icon/__tests__/SvgIcon.test.jsx
@@ -6,7 +6,10 @@
 import {describe, test, expect, testing} from '@gsa/testing';
 import React, {useEffect} from 'react';
 import CloneIcon from 'web/components/icon/CloneIcon';
-import {useStateWithMountCheck, useIsMountedRef} from 'web/components/icon/SvgIcon';
+import SvgIcon, {
+  useStateWithMountCheck,
+  useIsMountedRef,
+} from 'web/components/icon/SvgIcon';
 import {render, fireEvent, act} from 'web/utils/Testing';
 
 const entity = {name: 'entity'};
@@ -54,6 +57,22 @@ describe('SVG icon component tests', () => {
 
     expect(element).toHaveAttribute('title', 'Clone Entity');
   });
+
+  test('should render with default data-testid', () => {
+    const {element} = render(<SvgIcon active={true}>{() => null}</SvgIcon>);
+
+    expect(element).toHaveAttribute('data-testid', 'svg-icon');
+  });
+
+  test('should render with custom data-testid', () => {
+    const {element} = render(
+      <SvgIcon active={true} data-testid="foo">
+        {() => null}
+      </SvgIcon>,
+    );
+
+    expect(element).toHaveAttribute('data-testid', 'foo');
+  });
 });
 
 describe('useStateWithMountCheck() hook tests', () => {
@@ -76,6 +95,7 @@ describe('useStateWithMountCheck() hook tests', () => {
     expect(element).toHaveTextContent('false');
   });
 });
+
 describe('useIsMountedRef() hook tests', () => {
   test('should return false after component is unmounted', () => {
     const callback = testing.fn();
diff --git a/src/web/components/icon/__tests__/TrashCanIcon.test.jsx b/src/web/components/icon/__tests__/TrashCanIcon.test.jsx
index 6222572972..dc8f6bc37c 100644
--- a/src/web/components/icon/__tests__/TrashCanIcon.test.jsx
+++ b/src/web/components/icon/__tests__/TrashCanIcon.test.jsx
@@ -8,5 +8,8 @@ import {testIcon} from 'web/components/icon/Testing';
 import TrashcanIcon from 'web/components/icon/TrashCanIcon';
 
 describe('TrashcanIcon component tests', () => {
-  testIcon(TrashcanIcon);
+  testIcon(TrashcanIcon, {
+    dataTestId: 'trashcan-icon',
+    customDataTestId: 'custom-trashcan-icon',
+  });
 });
diff --git a/src/web/components/icon/__tests__/TrendMoreIcon.test.jsx b/src/web/components/icon/__tests__/TrendMoreIcon.test.jsx
index a057558099..369320b611 100644
--- a/src/web/components/icon/__tests__/TrendMoreIcon.test.jsx
+++ b/src/web/components/icon/__tests__/TrendMoreIcon.test.jsx
@@ -8,5 +8,8 @@ import {testIcon} from 'web/components/icon/Testing';
 import TrendMoreIcon from 'web/components/icon/TrendMoreIcon';
 
 describe('TrendMoreIcon component tests', () => {
-  testIcon(TrendMoreIcon);
+  testIcon(TrendMoreIcon, {
+    dataTestId: 'trend-more-icon',
+    customDataTestId: 'custom-trend-more-icon',
+  });
 });
diff --git a/src/web/components/icon/__tests__/TrendNoChangeIcon.test.jsx b/src/web/components/icon/__tests__/TrendNoChangeIcon.test.jsx
index 192ca4e189..ca6345f971 100644
--- a/src/web/components/icon/__tests__/TrendNoChangeIcon.test.jsx
+++ b/src/web/components/icon/__tests__/TrendNoChangeIcon.test.jsx
@@ -8,5 +8,8 @@ import {testIcon} from 'web/components/icon/Testing';
 import TrendNoChange from 'web/components/icon/TrendNoChangeIcon';
 
 describe('TrendNoChange component tests', () => {
-  testIcon(TrendNoChange);
+  testIcon(TrendNoChange, {
+    defaultTestId: 'trend-nochange-icon',
+    customDataTestId: 'custom-trend-nochange-icon',
+  });
 });
diff --git a/src/web/components/icon/__tests__/UploadIcon.test.jsx b/src/web/components/icon/__tests__/UploadIcon.test.jsx
index 9a3903c191..0ff84ee1ae 100644
--- a/src/web/components/icon/__tests__/UploadIcon.test.jsx
+++ b/src/web/components/icon/__tests__/UploadIcon.test.jsx
@@ -8,5 +8,8 @@ import {testIcon} from 'web/components/icon/Testing';
 import UploadIcon from 'web/components/icon/UploadIcon';
 
 describe('UploadIcon component tests', () => {
-  testIcon(UploadIcon);
+  testIcon(UploadIcon, {
+    dataTestId: 'upload-icon',
+    customDataTestId: 'custom-upload-icon',
+  });
 });
diff --git a/src/web/entity/icon/ObserverIcon.jsx b/src/web/entity/icon/ObserverIcon.jsx
index ad7a5b5306..e0731ee27d 100644
--- a/src/web/entity/icon/ObserverIcon.jsx
+++ b/src/web/entity/icon/ObserverIcon.jsx
@@ -9,7 +9,12 @@ import React from 'react';
 import ViewOtherIcon from 'web/components/icon/ViewOtherIcon';
 import PropTypes from 'web/utils/PropTypes';
 
-const ObserverIcon = ({entity, userName, displayName = _('Entity')}) => {
+const ObserverIcon = ({
+  entity,
+  userName,
+  displayName = _('Entity'),
+  ['data-testid']: dataTestId = 'observer-icon',
+}) => {
   const owner = isDefined(entity.owner) ? entity.owner.name : undefined;
 
   if (owner === userName) {
@@ -22,13 +27,14 @@ const ObserverIcon = ({entity, userName, displayName = _('Entity')}) => {
   } else {
     title = _('Global {{type}}', {type: displayName});
   }
-  return <ViewOtherIcon alt={title} title={title} />;
+  return <ViewOtherIcon alt={title} data-testid={dataTestId} title={title} />;
 };
 
 ObserverIcon.propTypes = {
   displayName: PropTypes.string,
   entity: PropTypes.model.isRequired,
   userName: PropTypes.string.isRequired,
+  'data-testid': PropTypes.string,
 };
 
 export default ObserverIcon;
diff --git a/src/web/entity/icon/__tests__/ObserverIcon.test.jsx b/src/web/entity/icon/__tests__/ObserverIcon.test.jsx
index ad8f6b46a7..ec96f7978e 100644
--- a/src/web/entity/icon/__tests__/ObserverIcon.test.jsx
+++ b/src/web/entity/icon/__tests__/ObserverIcon.test.jsx
@@ -8,7 +8,6 @@ import Task from 'gmp/models/task';
 import ObserverIcon from 'web/entity/icon/ObserverIcon';
 import {render} from 'web/utils/Testing';
 
-
 describe('Entity ObserverIcon component tests', () => {
   test('should render if the owner is not the current user', () => {
     const entity = Task.fromElement({owner: {name: 'foo'}});
@@ -27,4 +26,26 @@ describe('Entity ObserverIcon component tests', () => {
 
     expect(queryByTestId('observer-icon')).toEqual(null);
   });
+
+  test('should render with default data-testid', () => {
+    const entity = Task.fromElement({owner: {name: 'foo'}});
+
+    const {element} = render(<ObserverIcon entity={entity} userName={'bar'} />);
+
+    expect(element).toHaveAttribute('data-testid', 'observer-icon');
+  });
+
+  test('should render with custom data-testid', () => {
+    const entity = Task.fromElement({owner: {name: 'foo'}});
+
+    const {element} = render(
+      <ObserverIcon
+        data-testid="custom-observer-icon"
+        entity={entity}
+        userName={'bar'}
+      />,
+    );
+
+    expect(element).toHaveAttribute('data-testid', 'custom-observer-icon');
+  });
 });