diff --git a/public/components/ContentPanel/ContentPanel.tsx b/public/components/ContentPanel/ContentPanel.tsx
index 3be303b9..466ee02e 100644
--- a/public/components/ContentPanel/ContentPanel.tsx
+++ b/public/components/ContentPanel/ContentPanel.tsx
@@ -20,7 +20,7 @@ import {
   EuiTitle,
   EuiSpacer,
 } from '@elastic/eui';
-import { isEmpty } from 'lodash';
+import { isEmpty, get } from 'lodash';
 
 type ContentPanelProps = {
   // keep title string part for backwards compatibility
@@ -39,96 +39,109 @@ type ContentPanelProps = {
   children: React.ReactNode | React.ReactNode[];
   contentPanelClassName?: string;
   hideBody?: boolean;
+  titleDataTestSubj?: string;
 };
 
-const ContentPanel = (props: ContentPanelProps) => (
-  <EuiPanel
-    style={{ padding: '20px', ...props.panelStyles }}
-    className={props.contentPanelClassName}
-    betaBadgeLabel={props.badgeLabel}
-  >
-    <EuiFlexGroup
-      style={{ padding: '0px', ...props.titleContainerStyles }}
-      justifyContent="spaceBetween"
-      alignItems="center"
+const ContentPanel = (props: ContentPanelProps) => {
+  const titleDataTestSubj = get(
+    props,
+    'titleDataTestSubj',
+    'contentPanelTitle'
+  );
+  return (
+    <EuiPanel
+      style={{ padding: '20px', ...props.panelStyles }}
+      className={props.contentPanelClassName}
+      betaBadgeLabel={props.badgeLabel}
     >
-      <EuiFlexItem>
-        {typeof props.title === 'string' ? (
-          <EuiTitle
-            size={props.titleSize || 's'}
-            className={props.titleClassName}
-          >
-            <h3>{props.title}</h3>
-          </EuiTitle>
-        ) : (
-          <EuiFlexGroup justifyContent="flexStart" alignItems="center">
-            {Array.isArray(props.title) ? (
-              props.title.map(
-                (titleComponent: React.ReactNode, idx: number) => (
-                  <EuiFlexItem grow={false} key={idx}>
-                    {titleComponent}
+      <EuiFlexGroup
+        style={{ padding: '0px', ...props.titleContainerStyles }}
+        justifyContent="spaceBetween"
+        alignItems="center"
+      >
+        <EuiFlexItem>
+          {typeof props.title === 'string' ? (
+            <EuiTitle
+              data-test-subj={titleDataTestSubj}
+              size={props.titleSize || 's'}
+              className={props.titleClassName}
+            >
+              <h3>{props.title}</h3>
+            </EuiTitle>
+          ) : (
+            <EuiFlexGroup
+              data-test-subj={titleDataTestSubj}
+              justifyContent="flexStart"
+              alignItems="center"
+            >
+              {Array.isArray(props.title) ? (
+                props.title.map(
+                  (titleComponent: React.ReactNode, idx: number) => (
+                    <EuiFlexItem grow={false} key={idx}>
+                      {titleComponent}
+                    </EuiFlexItem>
+                  )
+                )
+              ) : (
+                <EuiFlexItem>{props.title}</EuiFlexItem>
+              )}
+            </EuiFlexGroup>
+          )}
+          <EuiFlexGroup>
+            {Array.isArray(props.subTitle) ? (
+              props.subTitle.map(
+                (subTitleComponent: React.ReactNode, idx: number) => (
+                  <EuiFlexItem
+                    grow={false}
+                    key={idx}
+                    className="content-panel-subTitle"
+                    style={{ lineHeight: 'normal', maxWidth: '75%' }}
+                  >
+                    {subTitleComponent}
                   </EuiFlexItem>
                 )
               )
             ) : (
-              <EuiFlexItem>{props.title}</EuiFlexItem>
+              <EuiFlexItem
+                className="content-panel-subTitle"
+                style={{ lineHeight: 'normal', maxWidth: '75%' }}
+              >
+                {props.subTitle}
+              </EuiFlexItem>
             )}
           </EuiFlexGroup>
-        )}
-        <EuiFlexGroup>
-          {Array.isArray(props.subTitle) ? (
-            props.subTitle.map(
-              (subTitleComponent: React.ReactNode, idx: number) => (
-                <EuiFlexItem
-                  grow={false}
-                  key={idx}
-                  className="content-panel-subTitle"
-                  style={{ lineHeight: 'normal', maxWidth: '75%' }}
-                >
-                  {subTitleComponent}
-                </EuiFlexItem>
-              )
-            )
-          ) : (
-            <EuiFlexItem
-              className="content-panel-subTitle"
-              style={{ lineHeight: 'normal', maxWidth: '75%' }}
-            >
-              {props.subTitle}
-            </EuiFlexItem>
-          )}
-        </EuiFlexGroup>
-      </EuiFlexItem>
+        </EuiFlexItem>
 
-      <EuiFlexItem grow={false}>
-        <EuiFlexGroup
-          justifyContent="spaceBetween"
-          alignItems="center"
-          gutterSize="m"
-        >
-          {Array.isArray(props.actions) ? (
-            props.actions.map((action: React.ReactNode, idx: number) => (
-              <EuiFlexItem key={idx}>{action}</EuiFlexItem>
-            ))
-          ) : (
-            <EuiFlexItem>{props.actions}</EuiFlexItem>
-          )}
-        </EuiFlexGroup>
-      </EuiFlexItem>
-    </EuiFlexGroup>
-    {!isEmpty(props.actions) ? <EuiSpacer size="s" /> : null}
-    {props.title != '' && props.hideBody !== true ? (
-      <div>
-        <EuiHorizontalRule
-          margin="s"
-          className={props.horizontalRuleClassName}
-        />
-        <div style={{ padding: '10px 0px', ...props.bodyStyles }}>
-          {props.children}
+        <EuiFlexItem grow={false}>
+          <EuiFlexGroup
+            justifyContent="spaceBetween"
+            alignItems="center"
+            gutterSize="m"
+          >
+            {Array.isArray(props.actions) ? (
+              props.actions.map((action: React.ReactNode, idx: number) => (
+                <EuiFlexItem key={idx}>{action}</EuiFlexItem>
+              ))
+            ) : (
+              <EuiFlexItem>{props.actions}</EuiFlexItem>
+            )}
+          </EuiFlexGroup>
+        </EuiFlexItem>
+      </EuiFlexGroup>
+      {!isEmpty(props.actions) ? <EuiSpacer size="s" /> : null}
+      {props.title != '' && props.hideBody !== true ? (
+        <div>
+          <EuiHorizontalRule
+            margin="s"
+            className={props.horizontalRuleClassName}
+          />
+          <div style={{ padding: '10px 0px', ...props.bodyStyles }}>
+            {props.children}
+          </div>
         </div>
-      </div>
-    ) : null}
-  </EuiPanel>
-);
+      ) : null}
+    </EuiPanel>
+  );
+};
 
 export default ContentPanel;
diff --git a/public/components/ContentPanel/__snapshots__/ContentPanel.test.tsx.snap b/public/components/ContentPanel/__snapshots__/ContentPanel.test.tsx.snap
index 05498d81..f83c028e 100644
--- a/public/components/ContentPanel/__snapshots__/ContentPanel.test.tsx.snap
+++ b/public/components/ContentPanel/__snapshots__/ContentPanel.test.tsx.snap
@@ -14,6 +14,7 @@ exports[`<ContentPanel /> spec renders the component 1`] = `
     >
       <h3
         class="euiTitle euiTitle--small"
+        data-test-subj="contentPanelTitle"
       >
         Testing
       </h3>
diff --git a/public/pages/AnomalyCharts/components/FeatureChart/FeatureChart.tsx b/public/pages/AnomalyCharts/components/FeatureChart/FeatureChart.tsx
index 12a6a932..1c4c46f8 100644
--- a/public/pages/AnomalyCharts/components/FeatureChart/FeatureChart.tsx
+++ b/public/pages/AnomalyCharts/components/FeatureChart/FeatureChart.tsx
@@ -156,6 +156,7 @@ export const FeatureChart = (props: FeatureChartProps) => {
           ? props.feature.featureName
           : `${props.feature.featureName} (disabled)`
       }
+      titleDataTestSubj="featureNameHeader"
       bodyStyles={
         !props.feature.featureEnabled
           ? { backgroundColor: getDisabledChartBackground() }
diff --git a/public/pages/AnomalyCharts/containers/AnomalyDetailsChart.tsx b/public/pages/AnomalyCharts/containers/AnomalyDetailsChart.tsx
index 32e2ceb1..d6dc9c91 100644
--- a/public/pages/AnomalyCharts/containers/AnomalyDetailsChart.tsx
+++ b/public/pages/AnomalyCharts/containers/AnomalyDetailsChart.tsx
@@ -357,6 +357,7 @@ export const AnomalyDetailsChart = React.memo(
         <EuiFlexGroup style={{ padding: '20px' }}>
           <EuiFlexItem>
             <EuiStat
+              data-test-subj="anomalyOccurrenceStat"
               title={isLoading ? '-' : anomalySummary.anomalyOccurrence}
               description={getAnomalyOccurrenceWording(props.isNotSample)}
               titleSize="s"
diff --git a/public/pages/ConfigureModel/components/AggregationSelector/AggregationSelector.tsx b/public/pages/ConfigureModel/components/AggregationSelector/AggregationSelector.tsx
index fc7ef560..d1d6c0a2 100644
--- a/public/pages/ConfigureModel/components/AggregationSelector/AggregationSelector.tsx
+++ b/public/pages/ConfigureModel/components/AggregationSelector/AggregationSelector.tsx
@@ -87,6 +87,7 @@ export const AggregationSelector = (props: AggregationSelectorProps) => {
             error={getError(field.name, form)}
           >
             <EuiComboBox
+              data-test-subj={`featureFieldTextInput-${props.index}`}
               placeholder="Select field"
               singleSelection={{ asPlainText: true }}
               selectedOptions={field.value}
diff --git a/public/pages/ConfigureModel/components/AggregationSelector/__tests__/__snapshots__/AggregationSelector.test.tsx.snap b/public/pages/ConfigureModel/components/AggregationSelector/__tests__/__snapshots__/AggregationSelector.test.tsx.snap
index 253fafe3..f52b8f9c 100644
--- a/public/pages/ConfigureModel/components/AggregationSelector/__tests__/__snapshots__/AggregationSelector.test.tsx.snap
+++ b/public/pages/ConfigureModel/components/AggregationSelector/__tests__/__snapshots__/AggregationSelector.test.tsx.snap
@@ -109,6 +109,7 @@ exports[`<AggregationSelector /> spec Empty results renders component with aggre
         aria-expanded="false"
         aria-haspopup="listbox"
         class="euiComboBox"
+        data-test-subj="featureFieldTextInput-undefined"
         name="featureList.undefined.aggregationOf"
         role="combobox"
       >
diff --git a/public/pages/ConfigureModel/components/CategoryField/__tests__/__snapshots__/CategoryField.test.tsx.snap b/public/pages/ConfigureModel/components/CategoryField/__tests__/__snapshots__/CategoryField.test.tsx.snap
index 93d55e83..39031bf0 100644
--- a/public/pages/ConfigureModel/components/CategoryField/__tests__/__snapshots__/CategoryField.test.tsx.snap
+++ b/public/pages/ConfigureModel/components/CategoryField/__tests__/__snapshots__/CategoryField.test.tsx.snap
@@ -18,6 +18,7 @@ exports[`<CategoryField /> spec renders the component when disabled 1`] = `
         >
           <div
             class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+            data-test-subj="contentPanelTitle"
           >
             <div
               class="euiFlexItem"
@@ -135,6 +136,7 @@ exports[`<CategoryField /> spec renders the component when enabled 1`] = `
         >
           <div
             class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+            data-test-subj="contentPanelTitle"
           >
             <div
               class="euiFlexItem"
diff --git a/public/pages/ConfigureModel/components/FeatureAccordion/FeatureAccordion.tsx b/public/pages/ConfigureModel/components/FeatureAccordion/FeatureAccordion.tsx
index 3f3007b7..17efc289 100644
--- a/public/pages/ConfigureModel/components/FeatureAccordion/FeatureAccordion.tsx
+++ b/public/pages/ConfigureModel/components/FeatureAccordion/FeatureAccordion.tsx
@@ -132,6 +132,7 @@ export const FeatureAccordion = (props: FeatureAccordionProps) => {
             error={getError(field.name, form)}
           >
             <EuiFieldText
+              data-test-subj={`featureNameTextInput-${props.index}`}
               name={`featureList.${props.index}.featureName`}
               placeholder="Enter feature name"
               value={field.value ? field.value : props.feature.featureName}
diff --git a/public/pages/ConfigureModel/containers/ConfigureModel.tsx b/public/pages/ConfigureModel/containers/ConfigureModel.tsx
index 39ff1b5c..9c589374 100644
--- a/public/pages/ConfigureModel/containers/ConfigureModel.tsx
+++ b/public/pages/ConfigureModel/containers/ConfigureModel.tsx
@@ -229,7 +229,10 @@ export function ConfigureModel(props: ConfigureModelProps) {
             <EuiPageBody>
               <EuiPageHeader>
                 <EuiPageHeaderSection>
-                  <EuiTitle size="l">
+                  <EuiTitle
+                    size="l"
+                    data-test-subj="configureOrEditModelConfigurationTitle"
+                  >
                     <h1>
                       {props.isEdit
                         ? 'Edit model configuration'
diff --git a/public/pages/ConfigureModel/containers/__tests__/__snapshots__/ConfigureModel.test.tsx.snap b/public/pages/ConfigureModel/containers/__tests__/__snapshots__/ConfigureModel.test.tsx.snap
index 6a8060b1..e837b26a 100644
--- a/public/pages/ConfigureModel/containers/__tests__/__snapshots__/ConfigureModel.test.tsx.snap
+++ b/public/pages/ConfigureModel/containers/__tests__/__snapshots__/ConfigureModel.test.tsx.snap
@@ -16,6 +16,7 @@ exports[`<ConfigureModel /> spec creating model configuration renders the compon
       >
         <h1
           class="euiTitle euiTitle--large"
+          data-test-subj="configureOrEditModelConfigurationTitle"
         >
           Configure model
            
@@ -65,6 +66,7 @@ exports[`<ConfigureModel /> spec creating model configuration renders the compon
         >
           <h3
             class="euiTitle euiTitle--small"
+            data-test-subj="contentPanelTitle"
           >
             Features
           </h3>
@@ -229,6 +231,7 @@ exports[`<ConfigureModel /> spec creating model configuration renders the compon
                             <input
                               aria-describedby="random_html_id-help"
                               class="euiFieldText"
+                              data-test-subj="featureNameTextInput-0"
                               id="random_html_id"
                               name="featureList.0.featureName"
                               placeholder="Enter feature name"
@@ -455,6 +458,7 @@ exports[`<ConfigureModel /> spec creating model configuration renders the compon
                           aria-expanded="false"
                           aria-haspopup="listbox"
                           class="euiComboBox"
+                          data-test-subj="featureFieldTextInput-0"
                           name="featureList.0.aggregationOf"
                           role="combobox"
                         >
@@ -576,6 +580,7 @@ exports[`<ConfigureModel /> spec creating model configuration renders the compon
         >
           <div
             class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+            data-test-subj="contentPanelTitle"
           >
             <div
               class="euiFlexItem"
@@ -715,6 +720,7 @@ exports[`<ConfigureModel /> spec creating model configuration renders the compon
         >
           <div
             class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+            data-test-subj="contentPanelTitle"
           >
             <div
               class="euiFlexItem"
@@ -780,6 +786,7 @@ exports[`<ConfigureModel /> spec creating model configuration renders the compon
         >
           <h3
             class="euiTitle euiTitle--small"
+            data-test-subj="contentPanelTitle"
           >
             Sample anomalies
           </h3>
@@ -919,6 +926,7 @@ exports[`<ConfigureModel /> spec editing model configuration renders the compone
       >
         <h1
           class="euiTitle euiTitle--large"
+          data-test-subj="configureOrEditModelConfigurationTitle"
         >
           Edit model configuration
            
@@ -972,6 +980,7 @@ exports[`<ConfigureModel /> spec editing model configuration renders the compone
         >
           <h3
             class="euiTitle euiTitle--small"
+            data-test-subj="contentPanelTitle"
           >
             Features
           </h3>
@@ -1145,6 +1154,7 @@ exports[`<ConfigureModel /> spec editing model configuration renders the compone
                             <input
                               aria-describedby="random_html_id-help"
                               class="euiFieldText"
+                              data-test-subj="featureNameTextInput-0"
                               id="random_html_id"
                               name="featureList.0.featureName"
                               placeholder="Enter feature name"
@@ -1381,6 +1391,7 @@ exports[`<ConfigureModel /> spec editing model configuration renders the compone
                           aria-expanded="false"
                           aria-haspopup="listbox"
                           class="euiComboBox"
+                          data-test-subj="featureFieldTextInput-0"
                           name="featureList.0.aggregationOf"
                           role="combobox"
                         >
@@ -1507,6 +1518,7 @@ exports[`<ConfigureModel /> spec editing model configuration renders the compone
         >
           <div
             class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+            data-test-subj="contentPanelTitle"
           >
             <div
               class="euiFlexItem"
@@ -1682,6 +1694,7 @@ exports[`<ConfigureModel /> spec editing model configuration renders the compone
         >
           <div
             class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+            data-test-subj="contentPanelTitle"
           >
             <div
               class="euiFlexItem"
diff --git a/public/pages/Dashboard/Components/AnomaliesDistribution.tsx b/public/pages/Dashboard/Components/AnomaliesDistribution.tsx
index 8452050a..b02878fe 100644
--- a/public/pages/Dashboard/Components/AnomaliesDistribution.tsx
+++ b/public/pages/Dashboard/Components/AnomaliesDistribution.tsx
@@ -119,6 +119,7 @@ export const AnomaliesDistributionChart = (
 
   return (
     <ContentPanel
+      titleDataTestSubj="dashboardSunburstChartHeader"
       title="Anomalies by index and detector"
       titleSize="s"
       subTitle={`The inner circle shows anomaly distribution by index. 
diff --git a/public/pages/Dashboard/Components/AnomaliesLiveChart.tsx b/public/pages/Dashboard/Components/AnomaliesLiveChart.tsx
index 0aa6a6f6..282235f5 100644
--- a/public/pages/Dashboard/Components/AnomaliesLiveChart.tsx
+++ b/public/pages/Dashboard/Components/AnomaliesLiveChart.tsx
@@ -209,6 +209,7 @@ export const AnomaliesLiveChart = (props: AnomaliesLiveChartProps) => {
       onClick={() => setIsFullScreen((isFullScreen) => !isFullScreen)}
       iconType={isFullScreen ? 'exit' : 'fullScreen'}
       aria-label="View full screen"
+      data-test-subj="dashboardFullScreenButton"
     >
       {isFullScreen ? 'Exit full screen' : 'View full screen'}
     </EuiButton>
@@ -217,7 +218,7 @@ export const AnomaliesLiveChart = (props: AnomaliesLiveChartProps) => {
   return (
     <ContentPanel
       title={
-        <EuiTitle size="s">
+        <EuiTitle size="s" data-test-subj="dashboardLiveAnomaliesHeader">
           <h3>
             Live anomalies{' '}
             <EuiBadge color={hasLatestAnomalyResult ? '#DB1374' : '#DDD'}>
diff --git a/public/pages/Dashboard/Components/AnomalousDetectorsList.tsx b/public/pages/Dashboard/Components/AnomalousDetectorsList.tsx
index 35b1abe3..5f3d21b4 100644
--- a/public/pages/Dashboard/Components/AnomalousDetectorsList.tsx
+++ b/public/pages/Dashboard/Components/AnomalousDetectorsList.tsx
@@ -79,6 +79,7 @@ export const AnomalousDetectorsList = (props: AnomalousDetectorsListProps) => {
     <div style={{ height: 'auto' }}>
       <ContentPanel title="Detectors and features" titleSize="s">
         <EuiBasicTable<any>
+          data-test-subj="dashboardDetectorTable"
           items={getOrderedDetectorsForPage(
             props.selectedDetectors,
             indexOfPage,
diff --git a/public/pages/Dashboard/Components/EmptyDashboard/EmptyDashboard.tsx b/public/pages/Dashboard/Components/EmptyDashboard/EmptyDashboard.tsx
index b7314408..f430b7a1 100644
--- a/public/pages/Dashboard/Components/EmptyDashboard/EmptyDashboard.tsx
+++ b/public/pages/Dashboard/Components/EmptyDashboard/EmptyDashboard.tsx
@@ -18,6 +18,7 @@ export class EmptyDashboard extends Component<{}, {}> {
   render() {
     return (
       <EuiEmptyPrompt
+        data-test-subj="emptyDashboardHeader"
         title={<h2>You have no detectors</h2>}
         body={
           <Fragment>
diff --git a/public/pages/Dashboard/Components/EmptyDashboard/__tests__/__snapshots__/EmptyDashboard.test.tsx.snap b/public/pages/Dashboard/Components/EmptyDashboard/__tests__/__snapshots__/EmptyDashboard.test.tsx.snap
index 0d8fc2ba..ab71ba64 100644
--- a/public/pages/Dashboard/Components/EmptyDashboard/__tests__/__snapshots__/EmptyDashboard.test.tsx.snap
+++ b/public/pages/Dashboard/Components/EmptyDashboard/__tests__/__snapshots__/EmptyDashboard.test.tsx.snap
@@ -3,6 +3,7 @@
 exports[`<EmptyDetector /> spec Empty results renders component with empty message 1`] = `
 <div
   class="euiEmptyPrompt"
+  data-test-subj="emptyDashboardHeader"
 >
   <span
     class="euiTextColor euiTextColor--subdued"
diff --git a/public/pages/DefineDetector/components/Datasource/DataSource.tsx b/public/pages/DefineDetector/components/Datasource/DataSource.tsx
index fe475622..dd268dde 100644
--- a/public/pages/DefineDetector/components/Datasource/DataSource.tsx
+++ b/public/pages/DefineDetector/components/Datasource/DataSource.tsx
@@ -117,6 +117,7 @@ export function DataSource(props: DataSourceProps) {
               helpText="You can use a wildcard (*) in your index pattern."
             >
               <EuiComboBox
+                data-test-subj="indicesFilter"
                 id="index"
                 placeholder="Find indices"
                 async
diff --git a/public/pages/DefineDetector/components/NameAndDescription/NameAndDescription.tsx b/public/pages/DefineDetector/components/NameAndDescription/NameAndDescription.tsx
index bf3f2e7f..17bf1ffe 100644
--- a/public/pages/DefineDetector/components/NameAndDescription/NameAndDescription.tsx
+++ b/public/pages/DefineDetector/components/NameAndDescription/NameAndDescription.tsx
@@ -35,6 +35,7 @@ function NameAndDescription(props: NameAndDescriptionProps) {
                 a-z, A-Z, 0-9, -(hyphen), _(underscore) and .(period).`}
           >
             <EuiFieldText
+              data-test-subj="detectorNameTextInput"
               name="detectorName"
               id="detectorName"
               placeholder="Enter detector name"
@@ -57,6 +58,7 @@ function NameAndDescription(props: NameAndDescriptionProps) {
             error={getError(field.name, form)}
           >
             <EuiTextArea
+              data-test-subj="detectorDescriptionTextInput"
               name="detectorDescription"
               id="detectorDescription"
               rows={3}
diff --git a/public/pages/DefineDetector/components/NameAndDescription/__tests__/__snapshots__/NameAndDescription.test.tsx.snap b/public/pages/DefineDetector/components/NameAndDescription/__tests__/__snapshots__/NameAndDescription.test.tsx.snap
index 5c1305b0..50e73132 100644
--- a/public/pages/DefineDetector/components/NameAndDescription/__tests__/__snapshots__/NameAndDescription.test.tsx.snap
+++ b/public/pages/DefineDetector/components/NameAndDescription/__tests__/__snapshots__/NameAndDescription.test.tsx.snap
@@ -15,6 +15,7 @@ exports[`<NameAndDescription /> spec renders the component 1`] = `
       >
         <h3
           class="euiTitle euiTitle--small"
+          data-test-subj="contentPanelTitle"
         >
           Detector details
         </h3>
@@ -88,6 +89,7 @@ exports[`<NameAndDescription /> spec renders the component 1`] = `
                 <input
                   aria-describedby="random_html_id-help"
                   class="euiFieldText"
+                  data-test-subj="detectorNameTextInput"
                   id="random_html_id"
                   name="name"
                   placeholder="Enter detector name"
@@ -144,6 +146,7 @@ exports[`<NameAndDescription /> spec renders the component 1`] = `
           >
             <textarea
               class="euiTextArea euiTextArea--resizeVertical"
+              data-test-subj="detectorDescriptionTextInput"
               id="random_html_id"
               name="description"
               placeholder="Describe the detector"
diff --git a/public/pages/DefineDetector/components/Settings/__tests__/__snapshots__/Settings.test.tsx.snap b/public/pages/DefineDetector/components/Settings/__tests__/__snapshots__/Settings.test.tsx.snap
index 0a7ccfba..44619db2 100644
--- a/public/pages/DefineDetector/components/Settings/__tests__/__snapshots__/Settings.test.tsx.snap
+++ b/public/pages/DefineDetector/components/Settings/__tests__/__snapshots__/Settings.test.tsx.snap
@@ -15,6 +15,7 @@ exports[`<Settings /> spec renders the component 1`] = `
       >
         <h3
           class="euiTitle euiTitle--small"
+          data-test-subj="contentPanelTitle"
         >
           Operation settings
         </h3>
diff --git a/public/pages/DefineDetector/components/Timestamp/Timestamp.tsx b/public/pages/DefineDetector/components/Timestamp/Timestamp.tsx
index 56c20ace..16cf8594 100644
--- a/public/pages/DefineDetector/components/Timestamp/Timestamp.tsx
+++ b/public/pages/DefineDetector/components/Timestamp/Timestamp.tsx
@@ -75,6 +75,7 @@ export function Timestamp(props: TimestampProps) {
             error={getError(field.name, form)}
           >
             <EuiComboBox
+              data-test-subj="timestampFilter"
               id="timeField"
               placeholder="Find timestamp"
               options={timeStampFieldOptions}
diff --git a/public/pages/DefineDetector/containers/DefineDetector.tsx b/public/pages/DefineDetector/containers/DefineDetector.tsx
index ac12f982..459553c0 100644
--- a/public/pages/DefineDetector/containers/DefineDetector.tsx
+++ b/public/pages/DefineDetector/containers/DefineDetector.tsx
@@ -239,7 +239,7 @@ export const DefineDetector = (props: DefineDetectorProps) => {
             <EuiPageBody>
               <EuiPageHeader>
                 <EuiPageHeaderSection>
-                  <EuiTitle size="l">
+                  <EuiTitle size="l" data-test-subj="defineOrEditDetectorTitle">
                     <h1>
                       {props.isEdit
                         ? 'Edit detector settings'
diff --git a/public/pages/DefineDetector/containers/__tests__/__snapshots__/DefineDetector.test.tsx.snap b/public/pages/DefineDetector/containers/__tests__/__snapshots__/DefineDetector.test.tsx.snap
index cba5a56c..6357634e 100644
--- a/public/pages/DefineDetector/containers/__tests__/__snapshots__/DefineDetector.test.tsx.snap
+++ b/public/pages/DefineDetector/containers/__tests__/__snapshots__/DefineDetector.test.tsx.snap
@@ -16,6 +16,7 @@ exports[`<DefineDetector /> spec creating detector definition renders the compon
       >
         <h1
           class="euiTitle euiTitle--large"
+          data-test-subj="defineOrEditDetectorTitle"
         >
           Define detector
            
@@ -35,6 +36,7 @@ exports[`<DefineDetector /> spec creating detector definition renders the compon
         >
           <h3
             class="euiTitle euiTitle--small"
+            data-test-subj="contentPanelTitle"
           >
             Detector details
           </h3>
@@ -108,6 +110,7 @@ exports[`<DefineDetector /> spec creating detector definition renders the compon
                   <input
                     aria-describedby="random_html_id-help"
                     class="euiFieldText"
+                    data-test-subj="detectorNameTextInput"
                     id="random_html_id"
                     name="name"
                     placeholder="Enter detector name"
@@ -164,6 +167,7 @@ exports[`<DefineDetector /> spec creating detector definition renders the compon
             >
               <textarea
                 class="euiTextArea euiTextArea--resizeVertical"
+                data-test-subj="detectorDescriptionTextInput"
                 id="random_html_id"
                 name="description"
                 placeholder="Describe the detector"
@@ -190,6 +194,7 @@ exports[`<DefineDetector /> spec creating detector definition renders the compon
         >
           <h3
             class="euiTitle euiTitle--small"
+            data-test-subj="contentPanelTitle"
           >
             Data Source
           </h3>
@@ -259,6 +264,7 @@ exports[`<DefineDetector /> spec creating detector definition renders the compon
                 aria-expanded="false"
                 aria-haspopup="listbox"
                 class="euiComboBox"
+                data-test-subj="indicesFilter"
                 role="combobox"
               >
                 <div
@@ -427,6 +433,7 @@ exports[`<DefineDetector /> spec creating detector definition renders the compon
         >
           <h3
             class="euiTitle euiTitle--small"
+            data-test-subj="contentPanelTitle"
           >
             Timestamp
           </h3>
@@ -497,6 +504,7 @@ exports[`<DefineDetector /> spec creating detector definition renders the compon
                 aria-expanded="false"
                 aria-haspopup="listbox"
                 class="euiComboBox"
+                data-test-subj="timestampFilter"
                 role="combobox"
               >
                 <div
@@ -577,6 +585,7 @@ exports[`<DefineDetector /> spec creating detector definition renders the compon
         >
           <h3
             class="euiTitle euiTitle--small"
+            data-test-subj="contentPanelTitle"
           >
             Operation settings
           </h3>
@@ -826,6 +835,7 @@ exports[`<DefineDetector /> spec creating detector definition renders the compon
         >
           <div
             class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+            data-test-subj="contentPanelTitle"
           >
             <div
               class="euiFlexItem"
@@ -941,6 +951,7 @@ exports[`<DefineDetector /> spec editing detector definition renders the compone
       >
         <h1
           class="euiTitle euiTitle--large"
+          data-test-subj="defineOrEditDetectorTitle"
         >
           Edit detector settings
            
@@ -960,6 +971,7 @@ exports[`<DefineDetector /> spec editing detector definition renders the compone
         >
           <h3
             class="euiTitle euiTitle--small"
+            data-test-subj="contentPanelTitle"
           >
             Detector details
           </h3>
@@ -1033,6 +1045,7 @@ exports[`<DefineDetector /> spec editing detector definition renders the compone
                   <input
                     aria-describedby="random_html_id-help"
                     class="euiFieldText"
+                    data-test-subj="detectorNameTextInput"
                     id="random_html_id"
                     name="name"
                     placeholder="Enter detector name"
@@ -1089,6 +1102,7 @@ exports[`<DefineDetector /> spec editing detector definition renders the compone
             >
               <textarea
                 class="euiTextArea euiTextArea--resizeVertical"
+                data-test-subj="detectorDescriptionTextInput"
                 id="random_html_id"
                 name="description"
                 placeholder="Describe the detector"
@@ -1115,6 +1129,7 @@ exports[`<DefineDetector /> spec editing detector definition renders the compone
         >
           <h3
             class="euiTitle euiTitle--small"
+            data-test-subj="contentPanelTitle"
           >
             Data Source
           </h3>
@@ -1212,6 +1227,7 @@ exports[`<DefineDetector /> spec editing detector definition renders the compone
                 aria-expanded="false"
                 aria-haspopup="listbox"
                 class="euiComboBox"
+                data-test-subj="indicesFilter"
                 role="combobox"
               >
                 <div
@@ -1390,6 +1406,7 @@ exports[`<DefineDetector /> spec editing detector definition renders the compone
         >
           <h3
             class="euiTitle euiTitle--small"
+            data-test-subj="contentPanelTitle"
           >
             Timestamp
           </h3>
@@ -1460,6 +1477,7 @@ exports[`<DefineDetector /> spec editing detector definition renders the compone
                 aria-expanded="false"
                 aria-haspopup="listbox"
                 class="euiComboBox"
+                data-test-subj="timestampFilter"
                 role="combobox"
               >
                 <div
@@ -1545,6 +1563,7 @@ exports[`<DefineDetector /> spec editing detector definition renders the compone
         >
           <h3
             class="euiTitle euiTitle--small"
+            data-test-subj="contentPanelTitle"
           >
             Operation settings
           </h3>
@@ -1802,6 +1821,7 @@ exports[`<DefineDetector /> spec editing detector definition renders the compone
         >
           <div
             class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+            data-test-subj="contentPanelTitle"
           >
             <div
               class="euiFlexItem"
diff --git a/public/pages/DetectorConfig/containers/DetectorJobs.tsx b/public/pages/DetectorConfig/containers/DetectorJobs.tsx
index eb96a9ea..e9cc1846 100644
--- a/public/pages/DetectorConfig/containers/DetectorJobs.tsx
+++ b/public/pages/DetectorConfig/containers/DetectorJobs.tsx
@@ -29,6 +29,7 @@ export const DetectorJobs = (props: DetectorJobsProps) => {
   return (
     <ContentPanel
       title="Detector jobs"
+      titleDataTestSubj="detectorJobsHeader"
       titleSize="s"
       panelStyles={{ margin: '0px' }}
       actions={[]}
diff --git a/public/pages/DetectorConfig/containers/Features.tsx b/public/pages/DetectorConfig/containers/Features.tsx
index 4e5e5ef8..d5b8e455 100644
--- a/public/pages/DetectorConfig/containers/Features.tsx
+++ b/public/pages/DetectorConfig/containers/Features.tsx
@@ -191,8 +191,16 @@ export const Features = (props: FeaturesProps) => {
   return (
     <ContentPanel
       title="Model configuration"
+      titleDataTestSubj="modelConfigurationHeader"
       titleSize="s"
-      actions={[<EuiButton onClick={props.onEditFeatures}>Edit</EuiButton>]}
+      actions={[
+        <EuiButton
+          data-test-subj="editModelConfigurationButton"
+          onClick={props.onEditFeatures}
+        >
+          Edit
+        </EuiButton>,
+      ]}
     >
       {featureNum == 0 ? (
         <EuiEmptyPrompt
diff --git a/public/pages/DetectorDetail/components/DetectorControls/DetectorControls.tsx b/public/pages/DetectorDetail/components/DetectorControls/DetectorControls.tsx
index 19c0291f..8c5b8543 100644
--- a/public/pages/DetectorDetail/components/DetectorControls/DetectorControls.tsx
+++ b/public/pages/DetectorDetail/components/DetectorControls/DetectorControls.tsx
@@ -53,7 +53,7 @@ export const DetectorControls = (props: DetectorControls) => {
           <EuiContextMenuPanel>
             <EuiContextMenuItem
               key="editDetector"
-              data-test-subj="editDetector"
+              data-test-subj="editDetectorSettingsItem"
               onClick={props.onEditDetector}
             >
               Edit detector settings
@@ -61,7 +61,7 @@ export const DetectorControls = (props: DetectorControls) => {
 
             <EuiContextMenuItem
               key="editFeatures"
-              data-test-subj="editFeature"
+              data-test-subj="editModelConfigurationItem"
               onClick={props.onEditFeatures}
             >
               Edit model configuration
@@ -69,7 +69,7 @@ export const DetectorControls = (props: DetectorControls) => {
 
             <EuiContextMenuItem
               key="deleteDetector"
-              data-test-subj="deleteDetector"
+              data-test-subj="deleteDetectorItem"
               onClick={props.onDelete}
               style={{ color: '#FF6666' }}
             >
diff --git a/public/pages/DetectorDetail/containers/DetectorDetail.tsx b/public/pages/DetectorDetail/containers/DetectorDetail.tsx
index 16cc0612..7bebb783 100644
--- a/public/pages/DetectorDetail/containers/DetectorDetail.tsx
+++ b/public/pages/DetectorDetail/containers/DetectorDetail.tsx
@@ -363,7 +363,7 @@ export const DetectorDetail = (props: DetectorDetailProps) => {
             style={{ padding: '10px' }}
           >
             <EuiFlexItem grow={false}>
-              <EuiTitle size="l">
+              <EuiTitle size="l" data-test-subj="detectorNameHeader">
                 {<h1>{detector && detector.name} </h1>}
               </EuiTitle>
             </EuiFlexItem>
@@ -418,6 +418,7 @@ export const DetectorDetail = (props: DetectorDetailProps) => {
                     }}
                     isSelected={tab.id === detectorDetailModel.selectedTab}
                     key={tab.id}
+                    data-test-subj={`${tab.id}Tab`}
                   >
                     {tab.name}
                   </EuiTab>
@@ -454,6 +455,7 @@ export const DetectorDetail = (props: DetectorDetailProps) => {
                 </EuiFlexItem>
                 <EuiFlexItem grow={true}>
                   <EuiFieldText
+                    data-test-subj="typeDeleteField"
                     fullWidth={true}
                     placeholder="delete"
                     onChange={(e) => {
diff --git a/public/pages/DetectorDetail/utils/helpers.tsx b/public/pages/DetectorDetail/utils/helpers.tsx
index 5e9b4be8..bb57e319 100644
--- a/public/pages/DetectorDetail/utils/helpers.tsx
+++ b/public/pages/DetectorDetail/utils/helpers.tsx
@@ -44,22 +44,37 @@ export const getDetectorStateDetails = (
   return (
     <Fragment>
       {isStoppingHistorical ? (
-        <EuiHealth color={DETECTOR_STATE_COLOR.DISABLED}>
+        <EuiHealth
+          color={DETECTOR_STATE_COLOR.DISABLED}
+          data-test-subj="detectorStateStopping"
+        >
           {'Stopping...'}
         </EuiHealth>
       ) : isHistorical && detector && state === DETECTOR_STATE.RUNNING ? (
-        <EuiHealth className={className} color={DETECTOR_STATE_COLOR.RUNNING}>
+        <EuiHealth
+          className={className}
+          color={DETECTOR_STATE_COLOR.RUNNING}
+          data-test-subj="detectorStateRunning"
+        >
           Running
         </EuiHealth>
       ) : detector && detector.enabled && state === DETECTOR_STATE.RUNNING ? (
-        <EuiHealth className={className} color={DETECTOR_STATE_COLOR.RUNNING}>
+        <EuiHealth
+          className={className}
+          color={DETECTOR_STATE_COLOR.RUNNING}
+          data-test-subj="detectorStateRunning"
+        >
           Running since{' '}
           {detector.enabledTime
             ? moment(detector.enabledTime).format('MM/DD/YY h:mm A')
             : '?'}
         </EuiHealth>
       ) : detector.enabled && state === DETECTOR_STATE.INIT ? (
-        <EuiHealth className={className} color={DETECTOR_STATE_COLOR.INIT}>
+        <EuiHealth
+          className={className}
+          color={DETECTOR_STATE_COLOR.INIT}
+          data-test-subj="detectorStateInitializing"
+        >
           {detector.initProgress?.estimatedMinutesLeft &&
           !isHCDetector &&
           !isHistorical
@@ -72,11 +87,16 @@ export const getDetectorStateDetails = (
         <EuiHealth
           className={className}
           color={DETECTOR_STATE_COLOR.INIT_FAILURE}
+          data-test-subj="detectorStateInitializingFailure"
         >
           Initialization failure
         </EuiHealth>
       ) : state === DETECTOR_STATE.DISABLED ? (
-        <EuiHealth className={className} color={DETECTOR_STATE_COLOR.DISABLED}>
+        <EuiHealth
+          className={className}
+          color={DETECTOR_STATE_COLOR.DISABLED}
+          data-test-subj="detectorStateStopped"
+        >
           {detector.disabledTime
             ? `Stopped at ${moment(detector.disabledTime).format(
                 'MM/DD/YY h:mm A'
@@ -87,19 +107,32 @@ export const getDetectorStateDetails = (
         <EuiHealth
           className={className}
           color={DETECTOR_STATE_COLOR.FEATURE_REQUIRED}
+          data-test-subj="detectorStateFeatureRequired"
         >
           Feature required to start the detector
         </EuiHealth>
       ) : state === DETECTOR_STATE.INIT ? (
-        <EuiHealth className={className} color={DETECTOR_STATE_COLOR.INIT}>
+        <EuiHealth
+          className={className}
+          color={DETECTOR_STATE_COLOR.INIT}
+          data-test-subj="detectorStateInitializing"
+        >
           Initializing
         </EuiHealth>
       ) : state === DETECTOR_STATE.FINISHED ? (
-        <EuiHealth className={className} color={DETECTOR_STATE_COLOR.FINISHED}>
+        <EuiHealth
+          className={className}
+          color={DETECTOR_STATE_COLOR.FINISHED}
+          data-test-subj="detectorStateFinished"
+        >
           Finished
         </EuiHealth>
       ) : state === DETECTOR_STATE.FAILED ? (
-        <EuiHealth className={className} color={DETECTOR_STATE_COLOR.FAILED}>
+        <EuiHealth
+          className={className}
+          color={DETECTOR_STATE_COLOR.FAILED}
+          data-test-subj="detectorStateFailed"
+        >
           Failed
         </EuiHealth>
       ) : (
diff --git a/public/pages/DetectorJobs/components/HistoricalJob/__tests__/__snapshots__/HistoricalJob.test.tsx.snap b/public/pages/DetectorJobs/components/HistoricalJob/__tests__/__snapshots__/HistoricalJob.test.tsx.snap
index e5c69dfa..e76bf234 100644
--- a/public/pages/DetectorJobs/components/HistoricalJob/__tests__/__snapshots__/HistoricalJob.test.tsx.snap
+++ b/public/pages/DetectorJobs/components/HistoricalJob/__tests__/__snapshots__/HistoricalJob.test.tsx.snap
@@ -15,6 +15,7 @@ exports[`<HistoricalJob /> spec renders the component 1`] = `
       >
         <h3
           class="euiTitle euiTitle--small"
+          data-test-subj="contentPanelTitle"
         >
           Historical analysis detection
         </h3>
diff --git a/public/pages/DetectorJobs/components/RealTimeJob/__tests__/__snapshots__/RealTimeJob.test.tsx.snap b/public/pages/DetectorJobs/components/RealTimeJob/__tests__/__snapshots__/RealTimeJob.test.tsx.snap
index 17dde1d1..b42fffd7 100644
--- a/public/pages/DetectorJobs/components/RealTimeJob/__tests__/__snapshots__/RealTimeJob.test.tsx.snap
+++ b/public/pages/DetectorJobs/components/RealTimeJob/__tests__/__snapshots__/RealTimeJob.test.tsx.snap
@@ -15,6 +15,7 @@ exports[`<RealTimeJob /> spec renders the component 1`] = `
       >
         <h3
           class="euiTitle euiTitle--small"
+          data-test-subj="contentPanelTitle"
         >
           Real-time detection
         </h3>
diff --git a/public/pages/DetectorJobs/containers/DetectorJobs.tsx b/public/pages/DetectorJobs/containers/DetectorJobs.tsx
index 937ce2ef..22599da4 100644
--- a/public/pages/DetectorJobs/containers/DetectorJobs.tsx
+++ b/public/pages/DetectorJobs/containers/DetectorJobs.tsx
@@ -119,7 +119,7 @@ export function DetectorJobs(props: DetectorJobsProps) {
             <EuiPageBody>
               <EuiPageHeader>
                 <EuiPageHeaderSection>
-                  <EuiTitle size="l">
+                  <EuiTitle size="l" data-test-subj="detectorJobsTitle">
                     <h1>Set up detector jobs </h1>
                   </EuiTitle>
                 </EuiPageHeaderSection>
diff --git a/public/pages/DetectorJobs/containers/__tests__/__snapshots__/DetectorJobs.test.tsx.snap b/public/pages/DetectorJobs/containers/__tests__/__snapshots__/DetectorJobs.test.tsx.snap
index dddbdd0f..3808eebf 100644
--- a/public/pages/DetectorJobs/containers/__tests__/__snapshots__/DetectorJobs.test.tsx.snap
+++ b/public/pages/DetectorJobs/containers/__tests__/__snapshots__/DetectorJobs.test.tsx.snap
@@ -16,6 +16,7 @@ exports[`<DetectorJobs /> spec configuring detector jobs renders the component 1
       >
         <h1
           class="euiTitle euiTitle--large"
+          data-test-subj="detectorJobsTitle"
         >
           Set up detector jobs 
         </h1>
@@ -34,6 +35,7 @@ exports[`<DetectorJobs /> spec configuring detector jobs renders the component 1
         >
           <h3
             class="euiTitle euiTitle--small"
+            data-test-subj="contentPanelTitle"
           >
             Real-time detection
           </h3>
@@ -133,6 +135,7 @@ exports[`<DetectorJobs /> spec configuring detector jobs renders the component 1
         >
           <h3
             class="euiTitle euiTitle--small"
+            data-test-subj="contentPanelTitle"
           >
             Historical analysis detection
           </h3>
diff --git a/public/pages/DetectorResults/containers/AnomalyHistory.tsx b/public/pages/DetectorResults/containers/AnomalyHistory.tsx
index 46960afd..2c8c5c0f 100644
--- a/public/pages/DetectorResults/containers/AnomalyHistory.tsx
+++ b/public/pages/DetectorResults/containers/AnomalyHistory.tsx
@@ -829,6 +829,7 @@ export const AnomalyHistory = (props: AnomalyHistoryProps) => {
         isSelected={tab.id === selectedTabId}
         disabled={tab.disabled}
         key={index}
+        data-test-subj={`${tab.id}Tab`}
       >
         {tab.name}
       </EuiTab>
diff --git a/public/pages/DetectorResults/containers/AnomalyResults.tsx b/public/pages/DetectorResults/containers/AnomalyResults.tsx
index 2f74f457..aaac612a 100644
--- a/public/pages/DetectorResults/containers/AnomalyResults.tsx
+++ b/public/pages/DetectorResults/containers/AnomalyResults.tsx
@@ -505,7 +505,10 @@ export function AnomalyResults(props: AnomalyResultsProps) {
                       style={{ marginBottom: '18px' }}
                     >
                       <EuiFlexItem grow={false}>
-                        <EuiTitle size="m">
+                        <EuiTitle
+                          size="m"
+                          data-test-subj="realTimeResultsHeader"
+                        >
                           {
                             <h1>
                               {'Real-time results'}{' '}
@@ -522,7 +525,7 @@ export function AnomalyResults(props: AnomalyResultsProps) {
 
                       <EuiFlexItem grow={false}>
                         <EuiButton
-                          data-test-subj="stopDetectorButton"
+                          data-test-subj="stopAndStartDetectorButton"
                           onClick={
                             detector?.enabled
                               ? props.onStopDetector
diff --git a/public/pages/DetectorResults/containers/AnomalyResultsLiveChart.tsx b/public/pages/DetectorResults/containers/AnomalyResultsLiveChart.tsx
index 56653674..5ee99853 100644
--- a/public/pages/DetectorResults/containers/AnomalyResultsLiveChart.tsx
+++ b/public/pages/DetectorResults/containers/AnomalyResultsLiveChart.tsx
@@ -211,6 +211,7 @@ export const AnomalyResultsLiveChart = (
       onClick={() => setIsFullScreen((isFullScreen) => !isFullScreen)}
       iconType={isFullScreen ? 'exit' : 'fullScreen'}
       aria-label="View full screen"
+      data-test-subj="anomalyResultsFullScreenButton"
     >
       {isFullScreen ? 'Exit full screen' : 'View full screen'}
     </EuiButton>
diff --git a/public/pages/DetectorResults/containers/AnomalyResultsTable.tsx b/public/pages/DetectorResults/containers/AnomalyResultsTable.tsx
index 2867962b..846a30ec 100644
--- a/public/pages/DetectorResults/containers/AnomalyResultsTable.tsx
+++ b/public/pages/DetectorResults/containers/AnomalyResultsTable.tsx
@@ -137,6 +137,7 @@ export function AnomalyResultsTable(props: AnomalyResultsTableProps) {
   return (
     <ContentPanel
       title={getTitleWithCount('Anomaly occurrences', totalAnomalies.length)}
+      titleDataTestSubj="anomalyOccurrencesHeader"
       titleSize="xs"
       titleClassName="preview-title"
     >
@@ -169,7 +170,7 @@ export function AnomalyResultsTable(props: AnomalyResultsTableProps) {
             <EuiEmptyPrompt
               style={{ maxWidth: '45em' }}
               body={
-                <EuiText>
+                <EuiText data-test-subj="noAnomaliesMessage">
                   <p>There are no anomalies currently.</p>
                 </EuiText>
               }
diff --git a/public/pages/DetectorsList/components/EmptyMessage/EmptyMessage.tsx b/public/pages/DetectorsList/components/EmptyMessage/EmptyMessage.tsx
index 98b86cb8..a911e4c2 100644
--- a/public/pages/DetectorsList/components/EmptyMessage/EmptyMessage.tsx
+++ b/public/pages/DetectorsList/components/EmptyMessage/EmptyMessage.tsx
@@ -27,6 +27,7 @@ interface EmptyDetectorProps {
 
 export const EmptyDetectorMessage = (props: EmptyDetectorProps) => (
   <EuiEmptyPrompt
+    data-test-subj="emptyDetectorListMessage"
     style={{ maxWidth: '45em' }}
     body={
       <EuiText>
diff --git a/public/pages/DetectorsList/components/EmptyMessage/__tests__/__snapshots__/EmptyMessage.test.tsx.snap b/public/pages/DetectorsList/components/EmptyMessage/__tests__/__snapshots__/EmptyMessage.test.tsx.snap
index eeef2693..0b1b6347 100644
--- a/public/pages/DetectorsList/components/EmptyMessage/__tests__/__snapshots__/EmptyMessage.test.tsx.snap
+++ b/public/pages/DetectorsList/components/EmptyMessage/__tests__/__snapshots__/EmptyMessage.test.tsx.snap
@@ -3,6 +3,7 @@
 exports[`<EmptyDetectorMessage /> spec Empty results renders component with empty message 1`] = `
 <div
   class="euiEmptyPrompt"
+  data-test-subj="emptyDetectorListMessage"
   style="max-width: 45em;"
 >
   <span
@@ -78,6 +79,7 @@ exports[`<EmptyDetectorMessage /> spec Empty results renders component with empt
 exports[`<EmptyDetectorMessage /> spec Filters results message renders component no result for filters message 1`] = `
 <div
   class="euiEmptyPrompt"
+  data-test-subj="emptyDetectorListMessage"
   style="max-width: 45em;"
 >
   <span
diff --git a/public/pages/DetectorsList/containers/ConfirmActionModals/ConfirmDeleteDetectorsModal.tsx b/public/pages/DetectorsList/containers/ConfirmActionModals/ConfirmDeleteDetectorsModal.tsx
index 0704bc3c..d7aef759 100644
--- a/public/pages/DetectorsList/containers/ConfirmActionModals/ConfirmDeleteDetectorsModal.tsx
+++ b/public/pages/DetectorsList/containers/ConfirmActionModals/ConfirmDeleteDetectorsModal.tsx
@@ -72,7 +72,7 @@ export const ConfirmDeleteDetectorsModal = (
 
   return (
     <EuiOverlayMask>
-      <EuiModal onClose={props.onHide}>
+      <EuiModal data-test-subj="deleteDetectorsModal" onClose={props.onHide}>
         <EuiModalHeader>
           <EuiModalHeaderTitle>
             {'Are you sure you want to delete the selected detectors?'}&nbsp;
diff --git a/public/pages/DetectorsList/containers/ConfirmActionModals/ConfirmStartDetectorsModal.tsx b/public/pages/DetectorsList/containers/ConfirmActionModals/ConfirmStartDetectorsModal.tsx
index 649f698c..81cc77aa 100644
--- a/public/pages/DetectorsList/containers/ConfirmActionModals/ConfirmStartDetectorsModal.tsx
+++ b/public/pages/DetectorsList/containers/ConfirmActionModals/ConfirmStartDetectorsModal.tsx
@@ -41,7 +41,7 @@ export const ConfirmStartDetectorsModal = (
   const isLoading = isModalLoading || props.isListLoading;
   return (
     <EuiOverlayMask>
-      <EuiModal onClose={props.onHide}>
+      <EuiModal data-test-subj="startDetectorsModal" onClose={props.onHide}>
         <EuiModalHeader>
           <EuiModalHeaderTitle>
             {'Are you sure you want to start the selected detectors?'}&nbsp;
diff --git a/public/pages/DetectorsList/containers/ConfirmActionModals/ConfirmStopDetectorsModal.tsx b/public/pages/DetectorsList/containers/ConfirmActionModals/ConfirmStopDetectorsModal.tsx
index 66821519..e0343b8f 100644
--- a/public/pages/DetectorsList/containers/ConfirmActionModals/ConfirmStopDetectorsModal.tsx
+++ b/public/pages/DetectorsList/containers/ConfirmActionModals/ConfirmStopDetectorsModal.tsx
@@ -54,7 +54,7 @@ export const ConfirmStopDetectorsModal = (
 
   return (
     <EuiOverlayMask>
-      <EuiModal onClose={props.onHide}>
+      <EuiModal data-test-subj="stopDetectorsModal" onClose={props.onHide}>
         <EuiModalHeader>
           <EuiModalHeaderTitle>
             {'Are you sure you want to stop the selected detectors?'}&nbsp;
diff --git a/public/pages/DetectorsList/containers/List/List.tsx b/public/pages/DetectorsList/containers/List/List.tsx
index 5a41e3c4..d5172bc1 100644
--- a/public/pages/DetectorsList/containers/List/List.tsx
+++ b/public/pages/DetectorsList/containers/List/List.tsx
@@ -633,6 +633,7 @@ export const DetectorList = (props: ListProps) => {
               ? getTitleWithCount('Detectors', '...')
               : getTitleWithCount('Detectors', selectedDetectors.length)
           }
+          titleDataTestSubj="detectorListHeader"
           actions={[
             <ListActions
               onStartDetectors={handleStartDetectorsAction}
@@ -643,7 +644,7 @@ export const DetectorList = (props: ListProps) => {
               isStopDisabled={listActionsState.isStopDisabled}
             />,
             <EuiButton
-              data-test-subj="addDetector"
+              data-test-subj="createDetectorButton"
               fill
               href={`${PLUGIN_NAME}#${APP_PATH.CREATE_DETECTOR}`}
             >
@@ -673,6 +674,7 @@ export const DetectorList = (props: ListProps) => {
           />
           <EuiSpacer size="m" />
           <EuiBasicTable<any>
+            data-test-subj="detectorListTable"
             items={isLoading ? [] : detectorsToDisplay}
             /*
               itemId here is used to keep track of the selected detectors and render appropriately.
diff --git a/public/pages/HistoricalDetectorResults/components/EmptyHistoricalDetectorResults/EmptyHistoricalDetectorResults.tsx b/public/pages/HistoricalDetectorResults/components/EmptyHistoricalDetectorResults/EmptyHistoricalDetectorResults.tsx
index 777e0e50..25674fbb 100644
--- a/public/pages/HistoricalDetectorResults/components/EmptyHistoricalDetectorResults/EmptyHistoricalDetectorResults.tsx
+++ b/public/pages/HistoricalDetectorResults/components/EmptyHistoricalDetectorResults/EmptyHistoricalDetectorResults.tsx
@@ -33,6 +33,7 @@ export const EmptyHistoricalDetectorResults = (
     useState<boolean>(false);
   return (
     <EuiEmptyPrompt
+      data-test-subj="emptyHistoricalAnalysisMessage"
       title={<h2>You haven't yet set up historical analysis</h2>}
       body={
         <Fragment>
@@ -62,6 +63,7 @@ export const EmptyHistoricalDetectorResults = (
       }
       actions={
         <EuiButton
+          data-test-subj="runHistoricalAnalysisButton"
           fill={true}
           onClick={() => {
             setHistoricalRangeModalOpen(true);
diff --git a/public/pages/HistoricalDetectorResults/components/HistoricalRangeModal/HistoricalRangeModal.tsx b/public/pages/HistoricalDetectorResults/components/HistoricalRangeModal/HistoricalRangeModal.tsx
index aced4388..87cf9be8 100644
--- a/public/pages/HistoricalDetectorResults/components/HistoricalRangeModal/HistoricalRangeModal.tsx
+++ b/public/pages/HistoricalDetectorResults/components/HistoricalRangeModal/HistoricalRangeModal.tsx
@@ -50,7 +50,7 @@ export const HistoricalRangeModal = (props: HistoricalRangeModalProps) => {
   return (
     <EuiModal onClose={props.onClose}>
       <EuiModalHeader>
-        <EuiModalHeaderTitle>
+        <EuiModalHeaderTitle data-test-subj="historicalAnalysisModalHeader">
           {props.isEdit
             ? 'Modify historical analysis'
             : 'Set up historical analysis'}
diff --git a/public/pages/HistoricalDetectorResults/components/__tests__/__snapshots__/EmptyHistoricalDetectorResults.test.tsx.snap b/public/pages/HistoricalDetectorResults/components/__tests__/__snapshots__/EmptyHistoricalDetectorResults.test.tsx.snap
index a1bca790..ac2c2974 100644
--- a/public/pages/HistoricalDetectorResults/components/__tests__/__snapshots__/EmptyHistoricalDetectorResults.test.tsx.snap
+++ b/public/pages/HistoricalDetectorResults/components/__tests__/__snapshots__/EmptyHistoricalDetectorResults.test.tsx.snap
@@ -3,6 +3,7 @@
 exports[`<EmptyHistoricalDetectorResults /> spec renders component 1`] = `
 <div
   class="euiEmptyPrompt"
+  data-test-subj="emptyHistoricalAnalysisMessage"
 >
   <span
     class="euiTextColor euiTextColor--subdued"
@@ -51,6 +52,7 @@ exports[`<EmptyHistoricalDetectorResults /> spec renders component 1`] = `
   />
   <button
     class="euiButton euiButton--primary euiButton--fill"
+    data-test-subj="runHistoricalAnalysisButton"
     type="button"
   >
     <span
diff --git a/public/pages/HistoricalDetectorResults/containers/HistoricalDetectorResults.tsx b/public/pages/HistoricalDetectorResults/containers/HistoricalDetectorResults.tsx
index e14207c3..bc8e80e3 100644
--- a/public/pages/HistoricalDetectorResults/containers/HistoricalDetectorResults.tsx
+++ b/public/pages/HistoricalDetectorResults/containers/HistoricalDetectorResults.tsx
@@ -195,7 +195,7 @@ export function HistoricalDetectorResults(
               ) : null}
               <EuiFlexGroup direction="column">
                 <EuiFlexItem>
-                  <EuiTitle size="m">
+                  <EuiTitle size="m" data-test-subj="historicalAnalysisTitle">
                     <div>
                       {'Historical analysis'}&nbsp;
                       {getDetectorStateDetails(
@@ -219,6 +219,7 @@ export function HistoricalDetectorResults(
                   </EuiFlexItem>
                   <EuiFlexItem grow={false} style={{ marginTop: '0px' }}>
                     <EuiButtonEmpty
+                      data-test-subj="modifyHistoricalAnalysisButton"
                       iconType="gear"
                       iconSide="left"
                       size="xs"
diff --git a/public/pages/Overview/components/SampleDataBox/SampleDataBox.tsx b/public/pages/Overview/components/SampleDataBox/SampleDataBox.tsx
index 09d8cb3c..9884e488 100644
--- a/public/pages/Overview/components/SampleDataBox/SampleDataBox.tsx
+++ b/public/pages/Overview/components/SampleDataBox/SampleDataBox.tsx
@@ -10,6 +10,7 @@
  */
 
 import React from 'react';
+import { get } from 'lodash';
 import ContentPanel from '../../../../components/ContentPanel/ContentPanel';
 import {
   EuiButton,
@@ -30,6 +31,7 @@ interface SampleDataBoxProps {
   isLoadingData: boolean;
   isDataLoaded: boolean;
   detectorId: string;
+  buttonDataTestSubj?: string;
 }
 
 export const SampleDataBox = (props: SampleDataBoxProps) => {
@@ -51,6 +53,7 @@ export const SampleDataBox = (props: SampleDataBoxProps) => {
               </h2>
             </EuiTitle>
             <EuiLink
+              data-test-subj="flyoutInfoButton"
               style={{ marginLeft: '12px' }}
               onClick={props.onOpenFlyout}
             >
@@ -85,7 +88,11 @@ export const SampleDataBox = (props: SampleDataBoxProps) => {
             <EuiFlexItem grow={false}>
               <EuiButton
                 style={{ width: '300px' }}
-                data-test-subj="loadDataButton"
+                data-test-subj={get(
+                  props,
+                  'buttonDataTestSubj',
+                  'loadDataButton'
+                )}
                 disabled={props.isLoadingData || props.isDataLoaded}
                 isLoading={props.isLoadingData}
                 onClick={() => {
@@ -101,7 +108,10 @@ export const SampleDataBox = (props: SampleDataBoxProps) => {
             </EuiFlexItem>
             <EuiFlexItem grow={false}>
               {props.isDataLoaded ? (
-                <EuiLink href={`${PLUGIN_NAME}#/detectors/${props.detectorId}`}>
+                <EuiLink
+                  data-test-subj="viewSampleDetectorLink"
+                  href={`${PLUGIN_NAME}#/detectors/${props.detectorId}`}
+                >
                   View detector and sample data
                 </EuiLink>
               ) : null}
diff --git a/public/pages/Overview/components/SampleDataBox/__tests__/__snapshots__/SampleDataBox.test.tsx.snap b/public/pages/Overview/components/SampleDataBox/__tests__/__snapshots__/SampleDataBox.test.tsx.snap
index 3f8b4dd9..ee100b3a 100644
--- a/public/pages/Overview/components/SampleDataBox/__tests__/__snapshots__/SampleDataBox.test.tsx.snap
+++ b/public/pages/Overview/components/SampleDataBox/__tests__/__snapshots__/SampleDataBox.test.tsx.snap
@@ -27,6 +27,7 @@ exports[`<SampleDataBox /> spec Data is loaded renders component 1`] = `
       >
         <div
           class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+          data-test-subj="contentPanelTitle"
         >
           <div
             class="euiFlexItem"
@@ -57,6 +58,7 @@ exports[`<SampleDataBox /> spec Data is loaded renders component 1`] = `
               </h2>
               <button
                 class="euiLink euiLink--primary"
+                data-test-subj="flyoutInfoButton"
                 style="margin-left: 12px;"
                 type="button"
               >
@@ -136,6 +138,7 @@ exports[`<SampleDataBox /> spec Data is loaded renders component 1`] = `
             >
               <a
                 class="euiLink euiLink--primary"
+                data-test-subj="viewSampleDetectorLink"
                 href="anomaly-detection-dashboards#/detectors/sample-detector-id"
                 rel="noreferrer"
               >
@@ -167,6 +170,7 @@ exports[`<SampleDataBox /> spec Data is loading renders component 1`] = `
       >
         <div
           class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+          data-test-subj="contentPanelTitle"
         >
           <div
             class="euiFlexItem"
@@ -197,6 +201,7 @@ exports[`<SampleDataBox /> spec Data is loading renders component 1`] = `
               </h2>
               <button
                 class="euiLink euiLink--primary"
+                data-test-subj="flyoutInfoButton"
                 style="margin-left: 12px;"
                 type="button"
               >
@@ -302,6 +307,7 @@ exports[`<SampleDataBox /> spec Data not loaded renders component 1`] = `
       >
         <div
           class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+          data-test-subj="contentPanelTitle"
         >
           <div
             class="euiFlexItem"
@@ -327,6 +333,7 @@ exports[`<SampleDataBox /> spec Data not loaded renders component 1`] = `
               </h2>
               <button
                 class="euiLink euiLink--primary"
+                data-test-subj="flyoutInfoButton"
                 style="margin-left: 12px;"
                 type="button"
               >
diff --git a/public/pages/Overview/components/SampleDetailsFlyout/SampleDetailsFlyout.tsx b/public/pages/Overview/components/SampleDetailsFlyout/SampleDetailsFlyout.tsx
index 020f986d..0a064cb9 100644
--- a/public/pages/Overview/components/SampleDetailsFlyout/SampleDetailsFlyout.tsx
+++ b/public/pages/Overview/components/SampleDetailsFlyout/SampleDetailsFlyout.tsx
@@ -76,7 +76,7 @@ export const SampleDetailsFlyout = (props: SampleDetailsFlyoutProps) => {
         <EuiAccordion
           id="detectorDetailsAccordion"
           buttonContent={
-            <EuiTitle size="s">
+            <EuiTitle size="s" data-test-subj="detectorDetailsHeader">
               <h3>Detector details</h3>
             </EuiTitle>
           }
@@ -107,7 +107,7 @@ export const SampleDetailsFlyout = (props: SampleDetailsFlyoutProps) => {
         <EuiAccordion
           id="indexDetailsAccordion"
           buttonContent={
-            <EuiTitle size="s">
+            <EuiTitle size="s" data-test-subj="indexDetailsHeader">
               <h3>Index details</h3>
             </EuiTitle>
           }
diff --git a/public/pages/Overview/components/SampleIndexDetailsCallout/SampleIndexDetailsCallout.tsx b/public/pages/Overview/components/SampleIndexDetailsCallout/SampleIndexDetailsCallout.tsx
index e4cf9767..ed55b775 100644
--- a/public/pages/Overview/components/SampleIndexDetailsCallout/SampleIndexDetailsCallout.tsx
+++ b/public/pages/Overview/components/SampleIndexDetailsCallout/SampleIndexDetailsCallout.tsx
@@ -25,6 +25,7 @@ export const SampleIndexDetailsCallout = (
 ) => {
   return (
     <EuiCallOut
+      data-test-subj="sampleIndexDetailsCallout"
       title="Want more details on the sample data?"
       color="primary"
       iconType="help"
diff --git a/public/pages/Overview/containers/AnomalyDetectionOverview.tsx b/public/pages/Overview/containers/AnomalyDetectionOverview.tsx
index 73c1987b..73df69e8 100644
--- a/public/pages/Overview/containers/AnomalyDetectionOverview.tsx
+++ b/public/pages/Overview/containers/AnomalyDetectionOverview.tsx
@@ -183,7 +183,7 @@ export function AnomalyDetectionOverview(props: AnomalyDetectionOverviewProps) {
       <EuiPageHeader>
         <EuiFlexGroup justifyContent="spaceBetween">
           <EuiFlexItem grow={false}>
-            <EuiTitle size="l">
+            <EuiTitle size="l" data-test-subj="overviewTitle">
               <h1>Anomaly detection</h1>
             </EuiTitle>
           </EuiFlexItem>
@@ -248,6 +248,7 @@ export function AnomalyDetectionOverview(props: AnomalyDetectionOverviewProps) {
               icon={sampleHttpResponses.icon}
               description={sampleHttpResponses.description}
               loadDataButtonDescription="Create HTTP response detector"
+              buttonDataTestSubj="createHttpSampleDetectorButton"
               onOpenFlyout={() => {
                 setShowHttpResponseDetailsFlyout(true);
                 setShowEcommerceDetailsFlyout(false);
@@ -281,6 +282,7 @@ export function AnomalyDetectionOverview(props: AnomalyDetectionOverviewProps) {
               icon={sampleEcommerce.icon}
               description={sampleEcommerce.description}
               loadDataButtonDescription="Create eCommerce orders detector"
+              buttonDataTestSubj="createECommerceSampleDetectorButton"
               onOpenFlyout={() => {
                 setShowHttpResponseDetailsFlyout(false);
                 setShowEcommerceDetailsFlyout(true);
@@ -312,6 +314,7 @@ export function AnomalyDetectionOverview(props: AnomalyDetectionOverviewProps) {
               icon={sampleHostHealth.icon}
               description={sampleHostHealth.description}
               loadDataButtonDescription="Create health monitor detector"
+              buttonDataTestSubj="createHostHealthSampleDetectorButton"
               onOpenFlyout={() => {
                 setShowHttpResponseDetailsFlyout(false);
                 setShowEcommerceDetailsFlyout(false);
diff --git a/public/pages/Overview/containers/__tests__/__snapshots__/AnomalyDetectionOverview.test.tsx.snap b/public/pages/Overview/containers/__tests__/__snapshots__/AnomalyDetectionOverview.test.tsx.snap
index e0021a36..02ae7497 100644
--- a/public/pages/Overview/containers/__tests__/__snapshots__/AnomalyDetectionOverview.test.tsx.snap
+++ b/public/pages/Overview/containers/__tests__/__snapshots__/AnomalyDetectionOverview.test.tsx.snap
@@ -13,6 +13,7 @@ exports[`<AnomalyDetectionOverview /> spec No sample detectors created renders c
       >
         <h1
           class="euiTitle euiTitle--large"
+          data-test-subj="overviewTitle"
         >
           Anomaly detection
         </h1>
@@ -79,6 +80,7 @@ exports[`<AnomalyDetectionOverview /> spec No sample detectors created renders c
       >
         <h3
           class="euiTitle euiTitle--small"
+          data-test-subj="contentPanelTitle"
         >
           How it works
         </h3>
@@ -350,6 +352,7 @@ exports[`<AnomalyDetectionOverview /> spec No sample detectors created renders c
       >
         <h3
           class="euiTitle euiTitle--small"
+          data-test-subj="contentPanelTitle"
         >
           Start with a sample detector to learn about anomaly detection
         </h3>
@@ -410,6 +413,7 @@ exports[`<AnomalyDetectionOverview /> spec No sample detectors created renders c
                   >
                     <div
                       class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+                      data-test-subj="contentPanelTitle"
                     >
                       <div
                         class="euiFlexItem"
@@ -435,6 +439,7 @@ exports[`<AnomalyDetectionOverview /> spec No sample detectors created renders c
                           </h2>
                           <button
                             class="euiLink euiLink--primary"
+                            data-test-subj="flyoutInfoButton"
                             style="margin-left: 12px;"
                             type="button"
                           >
@@ -493,7 +498,7 @@ exports[`<AnomalyDetectionOverview /> spec No sample detectors created renders c
                         >
                           <button
                             class="euiButton euiButton--primary"
-                            data-test-subj="loadDataButton"
+                            data-test-subj="createHttpSampleDetectorButton"
                             style="width: 300px;"
                             type="button"
                           >
@@ -537,6 +542,7 @@ exports[`<AnomalyDetectionOverview /> spec No sample detectors created renders c
                   >
                     <div
                       class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+                      data-test-subj="contentPanelTitle"
                     >
                       <div
                         class="euiFlexItem"
@@ -562,6 +568,7 @@ exports[`<AnomalyDetectionOverview /> spec No sample detectors created renders c
                           </h2>
                           <button
                             class="euiLink euiLink--primary"
+                            data-test-subj="flyoutInfoButton"
                             style="margin-left: 12px;"
                             type="button"
                           >
@@ -620,7 +627,7 @@ exports[`<AnomalyDetectionOverview /> spec No sample detectors created renders c
                         >
                           <button
                             class="euiButton euiButton--primary"
-                            data-test-subj="loadDataButton"
+                            data-test-subj="createECommerceSampleDetectorButton"
                             style="width: 300px;"
                             type="button"
                           >
@@ -664,6 +671,7 @@ exports[`<AnomalyDetectionOverview /> spec No sample detectors created renders c
                   >
                     <div
                       class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+                      data-test-subj="contentPanelTitle"
                     >
                       <div
                         class="euiFlexItem"
@@ -689,6 +697,7 @@ exports[`<AnomalyDetectionOverview /> spec No sample detectors created renders c
                           </h2>
                           <button
                             class="euiLink euiLink--primary"
+                            data-test-subj="flyoutInfoButton"
                             style="margin-left: 12px;"
                             type="button"
                           >
@@ -747,7 +756,7 @@ exports[`<AnomalyDetectionOverview /> spec No sample detectors created renders c
                         >
                           <button
                             class="euiButton euiButton--primary"
-                            data-test-subj="loadDataButton"
+                            data-test-subj="createHostHealthSampleDetectorButton"
                             style="width: 300px;"
                             type="button"
                           >
@@ -796,6 +805,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
       >
         <h1
           class="euiTitle euiTitle--large"
+          data-test-subj="overviewTitle"
         >
           Anomaly detection
         </h1>
@@ -866,6 +876,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
       >
         <h3
           class="euiTitle euiTitle--small"
+          data-test-subj="contentPanelTitle"
         >
           How it works
         </h3>
@@ -1153,6 +1164,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
       >
         <h3
           class="euiTitle euiTitle--small"
+          data-test-subj="contentPanelTitle"
         >
           Start with a sample detector to learn about anomaly detection
         </h3>
@@ -1213,6 +1225,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
                   >
                     <div
                       class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+                      data-test-subj="contentPanelTitle"
                     >
                       <div
                         class="euiFlexItem"
@@ -1242,6 +1255,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
                           </h2>
                           <button
                             class="euiLink euiLink--primary"
+                            data-test-subj="flyoutInfoButton"
                             style="margin-left: 12px;"
                             type="button"
                           >
@@ -1300,7 +1314,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
                         >
                           <button
                             class="euiButton euiButton--primary"
-                            data-test-subj="loadDataButton"
+                            data-test-subj="createHttpSampleDetectorButton"
                             style="width: 300px;"
                             type="button"
                           >
@@ -1344,6 +1358,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
                   >
                     <div
                       class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+                      data-test-subj="contentPanelTitle"
                     >
                       <div
                         class="euiFlexItem"
@@ -1373,6 +1388,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
                           </h2>
                           <button
                             class="euiLink euiLink--primary"
+                            data-test-subj="flyoutInfoButton"
                             style="margin-left: 12px;"
                             type="button"
                           >
@@ -1431,7 +1447,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
                         >
                           <button
                             class="euiButton euiButton--primary"
-                            data-test-subj="loadDataButton"
+                            data-test-subj="createECommerceSampleDetectorButton"
                             style="width: 300px;"
                             type="button"
                           >
@@ -1475,6 +1491,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
                   >
                     <div
                       class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+                      data-test-subj="contentPanelTitle"
                     >
                       <div
                         class="euiFlexItem"
@@ -1504,6 +1521,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
                           </h2>
                           <button
                             class="euiLink euiLink--primary"
+                            data-test-subj="flyoutInfoButton"
                             style="margin-left: 12px;"
                             type="button"
                           >
@@ -1562,7 +1580,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
                         >
                           <button
                             class="euiButton euiButton--primary"
-                            data-test-subj="loadDataButton"
+                            data-test-subj="createHostHealthSampleDetectorButton"
                             style="width: 300px;"
                             type="button"
                           >
@@ -1611,6 +1629,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
       >
         <h1
           class="euiTitle euiTitle--large"
+          data-test-subj="overviewTitle"
         >
           Anomaly detection
         </h1>
@@ -1681,6 +1700,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
       >
         <h3
           class="euiTitle euiTitle--small"
+          data-test-subj="contentPanelTitle"
         >
           How it works
         </h3>
@@ -1968,6 +1988,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
       >
         <h3
           class="euiTitle euiTitle--small"
+          data-test-subj="contentPanelTitle"
         >
           Start with a sample detector to learn about anomaly detection
         </h3>
@@ -2038,6 +2059,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
                   >
                     <div
                       class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+                      data-test-subj="contentPanelTitle"
                     >
                       <div
                         class="euiFlexItem"
@@ -2067,6 +2089,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
                           </h2>
                           <button
                             class="euiLink euiLink--primary"
+                            data-test-subj="flyoutInfoButton"
                             style="margin-left: 12px;"
                             type="button"
                           >
@@ -2125,7 +2148,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
                         >
                           <button
                             class="euiButton euiButton--primary euiButton-isDisabled"
-                            data-test-subj="loadDataButton"
+                            data-test-subj="createHttpSampleDetectorButton"
                             disabled=""
                             style="width: 300px;"
                             type="button"
@@ -2146,6 +2169,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
                         >
                           <a
                             class="euiLink euiLink--primary"
+                            data-test-subj="viewSampleDetectorLink"
                             href="anomaly-detection-dashboards#/detectors/sample-detector-id"
                             rel="noreferrer"
                           >
@@ -2178,6 +2202,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
                   >
                     <div
                       class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+                      data-test-subj="contentPanelTitle"
                     >
                       <div
                         class="euiFlexItem"
@@ -2207,6 +2232,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
                           </h2>
                           <button
                             class="euiLink euiLink--primary"
+                            data-test-subj="flyoutInfoButton"
                             style="margin-left: 12px;"
                             type="button"
                           >
@@ -2265,7 +2291,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
                         >
                           <button
                             class="euiButton euiButton--primary"
-                            data-test-subj="loadDataButton"
+                            data-test-subj="createECommerceSampleDetectorButton"
                             style="width: 300px;"
                             type="button"
                           >
@@ -2309,6 +2335,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
                   >
                     <div
                       class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+                      data-test-subj="contentPanelTitle"
                     >
                       <div
                         class="euiFlexItem"
@@ -2338,6 +2365,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
                           </h2>
                           <button
                             class="euiLink euiLink--primary"
+                            data-test-subj="flyoutInfoButton"
                             style="margin-left: 12px;"
                             type="button"
                           >
@@ -2396,7 +2424,7 @@ exports[`<AnomalyDetectionOverview /> spec Some detectors created renders compon
                         >
                           <button
                             class="euiButton euiButton--primary"
-                            data-test-subj="loadDataButton"
+                            data-test-subj="createHostHealthSampleDetectorButton"
                             style="width: 300px;"
                             type="button"
                           >
diff --git a/public/pages/ReviewAndCreate/components/DetectorDefinitionFields/DetectorDefinitionFields.tsx b/public/pages/ReviewAndCreate/components/DetectorDefinitionFields/DetectorDefinitionFields.tsx
index a530aeb5..f7b3c630 100644
--- a/public/pages/ReviewAndCreate/components/DetectorDefinitionFields/DetectorDefinitionFields.tsx
+++ b/public/pages/ReviewAndCreate/components/DetectorDefinitionFields/DetectorDefinitionFields.tsx
@@ -116,11 +116,12 @@ export const DetectorDefinitionFields = (
   return (
     <ContentPanel
       title="Detector settings"
+      titleDataTestSubj="detectorSettingsHeader"
       titleSize="s"
       panelStyles={{ margin: '0px' }}
       actions={[
         <EuiButton
-          data-test-subj="editDetectorButton"
+          data-test-subj="editDetectorSettingsButton"
           onClick={props.onEditDetectorDefinition}
         >
           Edit
@@ -129,13 +130,13 @@ export const DetectorDefinitionFields = (
     >
       {props.isCreate ? getValidationCallout() : null}
       <EuiFlexGrid columns={0} gutterSize="l" style={{ border: 'none' }}>
-        <EuiFlexItem>
+        <EuiFlexItem data-test-subj="detectorNameCell">
           <ConfigCell
             title="Name"
             description={get(props, 'detector.name', '')}
           />
         </EuiFlexItem>
-        <EuiFlexItem>
+        <EuiFlexItem data-test-subj="indexNameCell">
           <ConfigCell
             title="Data source index"
             description={get(props, 'detector.indices.0', '')}
@@ -155,20 +156,20 @@ export const DetectorDefinitionFields = (
           />
         </EuiFlexItem>
         {props.isCreate ? null : (
-          <EuiFlexItem>
+          <EuiFlexItem data-test-subj="detectorIdCell">
             <ConfigCell
               title="ID"
               description={get(props, 'detector.id', '')}
             />
           </EuiFlexItem>
         )}
-        <EuiFlexItem>
+        <EuiFlexItem data-test-subj="detectorDescriptionCell">
           <ConfigCell
             title="Description"
             description={get(props, 'detector.description', '')}
           />
         </EuiFlexItem>
-        <EuiFlexItem>
+        <EuiFlexItem data-test-subj="timestampNameCell">
           <ConfigCell
             title="Timestamp"
             description={get(props, 'detector.timeField', '')}
diff --git a/public/pages/ReviewAndCreate/components/DetectorScheduleFields/DetectorScheduleFields.tsx b/public/pages/ReviewAndCreate/components/DetectorScheduleFields/DetectorScheduleFields.tsx
index 06d84472..4126a337 100644
--- a/public/pages/ReviewAndCreate/components/DetectorScheduleFields/DetectorScheduleFields.tsx
+++ b/public/pages/ReviewAndCreate/components/DetectorScheduleFields/DetectorScheduleFields.tsx
@@ -41,6 +41,7 @@ export const DetectorScheduleFields = (props: DetectorScheduleFieldsProps) => {
   return (
     <ContentPanel
       title="Detector schedule"
+      titleDataTestSubj="detectorScheduleHeader"
       titleSize="s"
       panelStyles={{ margin: '0px' }}
       actions={[
diff --git a/public/pages/ReviewAndCreate/components/ModelConfigurationFields/ModelConfigurationFields.tsx b/public/pages/ReviewAndCreate/components/ModelConfigurationFields/ModelConfigurationFields.tsx
index 9a9e3955..f2299ef2 100644
--- a/public/pages/ReviewAndCreate/components/ModelConfigurationFields/ModelConfigurationFields.tsx
+++ b/public/pages/ReviewAndCreate/components/ModelConfigurationFields/ModelConfigurationFields.tsx
@@ -299,6 +299,7 @@ export const ModelConfigurationFields = (
           titleSize="s"
         >
           <EuiBasicTable
+            data-test-subj="featureTable"
             items={sortedItems}
             columns={columns}
             cellProps={getCellProps}
diff --git a/public/pages/ReviewAndCreate/components/__tests__/__snapshots__/DetectorDefinitionFields.test.tsx.snap b/public/pages/ReviewAndCreate/components/__tests__/__snapshots__/DetectorDefinitionFields.test.tsx.snap
index 082319dc..b63606bd 100644
--- a/public/pages/ReviewAndCreate/components/__tests__/__snapshots__/DetectorDefinitionFields.test.tsx.snap
+++ b/public/pages/ReviewAndCreate/components/__tests__/__snapshots__/DetectorDefinitionFields.test.tsx.snap
@@ -15,6 +15,7 @@ exports[`<AdditionalSettings /> spec renders the component in create mode (no ID
       >
         <h3
           class="euiTitle euiTitle--small"
+          data-test-subj="detectorSettingsHeader"
         >
           Detector settings
         </h3>
@@ -38,7 +39,7 @@ exports[`<AdditionalSettings /> spec renders the component in create mode (no ID
           >
             <button
               class="euiButton euiButton--primary"
-              data-test-subj="editDetectorButton"
+              data-test-subj="editDetectorSettingsButton"
               type="button"
             >
               <span
@@ -70,6 +71,7 @@ exports[`<AdditionalSettings /> spec renders the component in create mode (no ID
         >
           <div
             class="euiFlexItem"
+            data-test-subj="detectorNameCell"
           >
             <div
               class="euiFormRow"
@@ -104,6 +106,7 @@ exports[`<AdditionalSettings /> spec renders the component in create mode (no ID
           </div>
           <div
             class="euiFlexItem"
+            data-test-subj="indexNameCell"
           >
             <div
               class="euiFormRow"
@@ -203,6 +206,7 @@ exports[`<AdditionalSettings /> spec renders the component in create mode (no ID
           </div>
           <div
             class="euiFlexItem"
+            data-test-subj="detectorDescriptionCell"
           >
             <div
               class="euiFormRow"
@@ -237,6 +241,7 @@ exports[`<AdditionalSettings /> spec renders the component in create mode (no ID
           </div>
           <div
             class="euiFlexItem"
+            data-test-subj="timestampNameCell"
           >
             <div
               class="euiFormRow"
@@ -359,6 +364,7 @@ exports[`<AdditionalSettings /> spec renders the component in edit mode (with ID
       >
         <h3
           class="euiTitle euiTitle--small"
+          data-test-subj="detectorSettingsHeader"
         >
           Detector settings
         </h3>
@@ -382,7 +388,7 @@ exports[`<AdditionalSettings /> spec renders the component in edit mode (with ID
           >
             <button
               class="euiButton euiButton--primary"
-              data-test-subj="editDetectorButton"
+              data-test-subj="editDetectorSettingsButton"
               type="button"
             >
               <span
@@ -414,6 +420,7 @@ exports[`<AdditionalSettings /> spec renders the component in edit mode (with ID
         >
           <div
             class="euiFlexItem"
+            data-test-subj="detectorNameCell"
           >
             <div
               class="euiFormRow"
@@ -448,6 +455,7 @@ exports[`<AdditionalSettings /> spec renders the component in edit mode (with ID
           </div>
           <div
             class="euiFlexItem"
+            data-test-subj="indexNameCell"
           >
             <div
               class="euiFormRow"
@@ -547,6 +555,7 @@ exports[`<AdditionalSettings /> spec renders the component in edit mode (with ID
           </div>
           <div
             class="euiFlexItem"
+            data-test-subj="detectorIdCell"
           >
             <div
               class="euiFormRow"
@@ -581,6 +590,7 @@ exports[`<AdditionalSettings /> spec renders the component in edit mode (with ID
           </div>
           <div
             class="euiFlexItem"
+            data-test-subj="detectorDescriptionCell"
           >
             <div
               class="euiFormRow"
@@ -615,6 +625,7 @@ exports[`<AdditionalSettings /> spec renders the component in edit mode (with ID
           </div>
           <div
             class="euiFlexItem"
+            data-test-subj="timestampNameCell"
           >
             <div
               class="euiFormRow"
diff --git a/public/pages/ReviewAndCreate/containers/ReviewAndCreate.tsx b/public/pages/ReviewAndCreate/containers/ReviewAndCreate.tsx
index 3f6a7614..002d2744 100644
--- a/public/pages/ReviewAndCreate/containers/ReviewAndCreate.tsx
+++ b/public/pages/ReviewAndCreate/containers/ReviewAndCreate.tsx
@@ -259,7 +259,7 @@ export function ReviewAndCreate(props: ReviewAndCreateProps) {
             <EuiPageBody>
               <EuiPageHeader>
                 <EuiPageHeaderSection>
-                  <EuiTitle size="l">
+                  <EuiTitle size="l" data-test-subj="reviewAndCreateTitle">
                     <h1>Review and create </h1>
                   </EuiTitle>
                 </EuiPageHeaderSection>
diff --git a/public/pages/ReviewAndCreate/containers/__tests__/__snapshots__/ReviewAndCreate.test.tsx.snap b/public/pages/ReviewAndCreate/containers/__tests__/__snapshots__/ReviewAndCreate.test.tsx.snap
index 8df47be9..1f5884c3 100644
--- a/public/pages/ReviewAndCreate/containers/__tests__/__snapshots__/ReviewAndCreate.test.tsx.snap
+++ b/public/pages/ReviewAndCreate/containers/__tests__/__snapshots__/ReviewAndCreate.test.tsx.snap
@@ -16,6 +16,7 @@ exports[`<ReviewAndCreate /> spec renders the component 1`] = `
       >
         <h1
           class="euiTitle euiTitle--large"
+          data-test-subj="reviewAndCreateTitle"
         >
           Review and create 
         </h1>
@@ -34,6 +35,7 @@ exports[`<ReviewAndCreate /> spec renders the component 1`] = `
         >
           <h3
             class="euiTitle euiTitle--small"
+            data-test-subj="detectorSettingsHeader"
           >
             Detector settings
           </h3>
@@ -57,7 +59,7 @@ exports[`<ReviewAndCreate /> spec renders the component 1`] = `
             >
               <button
                 class="euiButton euiButton--primary"
-                data-test-subj="editDetectorButton"
+                data-test-subj="editDetectorSettingsButton"
                 type="button"
               >
                 <span
@@ -119,6 +121,7 @@ exports[`<ReviewAndCreate /> spec renders the component 1`] = `
           >
             <div
               class="euiFlexItem"
+              data-test-subj="detectorNameCell"
             >
               <div
                 class="euiFormRow"
@@ -151,6 +154,7 @@ exports[`<ReviewAndCreate /> spec renders the component 1`] = `
             </div>
             <div
               class="euiFlexItem"
+              data-test-subj="indexNameCell"
             >
               <div
                 class="euiFormRow"
@@ -260,6 +264,7 @@ exports[`<ReviewAndCreate /> spec renders the component 1`] = `
             </div>
             <div
               class="euiFlexItem"
+              data-test-subj="detectorDescriptionCell"
             >
               <div
                 class="euiFormRow"
@@ -292,6 +297,7 @@ exports[`<ReviewAndCreate /> spec renders the component 1`] = `
             </div>
             <div
               class="euiFlexItem"
+              data-test-subj="timestampNameCell"
             >
               <div
                 class="euiFormRow"
@@ -410,6 +416,7 @@ exports[`<ReviewAndCreate /> spec renders the component 1`] = `
         >
           <h3
             class="euiTitle euiTitle--small"
+            data-test-subj="contentPanelTitle"
           >
             Model configuration
           </h3>
@@ -615,6 +622,7 @@ exports[`<ReviewAndCreate /> spec renders the component 1`] = `
                 >
                   <div
                     class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+                    data-test-subj="contentPanelTitle"
                   >
                     <div
                       class="euiFlexItem"
@@ -665,6 +673,7 @@ exports[`<ReviewAndCreate /> spec renders the component 1`] = `
                 >
                   <div
                     class="euiBasicTable"
+                    data-test-subj="featureTable"
                   >
                     <div>
                       <div
@@ -851,6 +860,7 @@ exports[`<ReviewAndCreate /> spec renders the component 1`] = `
         >
           <h3
             class="euiTitle euiTitle--small"
+            data-test-subj="detectorScheduleHeader"
           >
             Detector schedule
           </h3>