From 313297a2e00c8e442db322091b19acd3ffba2890 Mon Sep 17 00:00:00 2001
From: Bree Hall <briannajdhall@gmail.com>
Date: Fri, 4 Nov 2022 10:57:53 -0400
Subject: [PATCH] EuiButton - Update EuiButton related snapshots. Updated tests
 that target EuiButton directly to use a data-telementary-id for more specific
 element querying required by Emotion

---
 .../__snapshots__/header_menu.test.tsx.snap   |  6 +-
 .../__snapshots__/menu_items.test.tsx.snap    | 56 +++++++++----------
 .../syncs_context_menu.test.tsx               |  9 ++-
 3 files changed, 37 insertions(+), 34 deletions(-)

diff --git a/packages/kbn-securitysolution-exception-list-components/src/header_menu/__snapshots__/header_menu.test.tsx.snap b/packages/kbn-securitysolution-exception-list-components/src/header_menu/__snapshots__/header_menu.test.tsx.snap
index 20ce1cfcb43e3..584a95a4c1ede 100644
--- a/packages/kbn-securitysolution-exception-list-components/src/header_menu/__snapshots__/header_menu.test.tsx.snap
+++ b/packages/kbn-securitysolution-exception-list-components/src/header_menu/__snapshots__/header_menu.test.tsx.snap
@@ -17,7 +17,7 @@ Object {
           >
             <button
               aria-label="Header menu Button Icon"
-              class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
+              class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
               data-test-subj="ButtonIcon"
               type="button"
             >
@@ -49,7 +49,7 @@ Object {
           tabindex="0"
         >
           <div
-            class="emotion-euiPopoverArrow-bottom"
+            class="euiPopover__arrow emotion-euiPopoverArrow-bottom"
             data-popover-arrow="bottom"
             style="left: 10px; top: 0px;"
           />
@@ -127,7 +127,7 @@ Object {
         >
           <button
             aria-label="Header menu Button Icon"
-            class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
+            class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
             data-test-subj="ButtonIcon"
             type="button"
           >
diff --git a/packages/kbn-securitysolution-exception-list-components/src/list_header/menu_items/__snapshots__/menu_items.test.tsx.snap b/packages/kbn-securitysolution-exception-list-components/src/list_header/menu_items/__snapshots__/menu_items.test.tsx.snap
index 029efe43beeb6..be9608a44a7c7 100644
--- a/packages/kbn-securitysolution-exception-list-components/src/list_header/menu_items/__snapshots__/menu_items.test.tsx.snap
+++ b/packages/kbn-securitysolution-exception-list-components/src/list_header/menu_items/__snapshots__/menu_items.test.tsx.snap
@@ -23,15 +23,15 @@ Object {
           class="euiFlexItem"
         >
           <button
-            class="euiButton euiButton--primary euiButton--fill"
+            class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
             data-test-subj="ManageRulesButton"
             type="button"
           >
             <span
-              class="euiButtonContent euiButton__content"
+              class="emotion-euiButtonDisplayContent"
             >
               <span
-                class="euiButton__text"
+                class="eui-textTruncate"
               >
                 Manage rules
               </span>
@@ -53,7 +53,7 @@ Object {
               >
                 <button
                   aria-label="Header menu Button Icon"
-                  class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
+                  class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
                   data-test-subj="MenuActionsButtonIcon"
                   type="button"
                 >
@@ -90,15 +90,15 @@ Object {
         class="euiFlexItem"
       >
         <button
-          class="euiButton euiButton--primary euiButton--fill"
+          class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
           data-test-subj="ManageRulesButton"
           type="button"
         >
           <span
-            class="euiButtonContent euiButton__content"
+            class="emotion-euiButtonDisplayContent"
           >
             <span
-              class="euiButton__text"
+              class="eui-textTruncate"
             >
               Manage rules
             </span>
@@ -120,7 +120,7 @@ Object {
             >
               <button
                 aria-label="Header menu Button Icon"
-                class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
+                class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
                 data-test-subj="MenuActionsButtonIcon"
                 type="button"
               >
@@ -214,15 +214,15 @@ Object {
           class="euiFlexItem"
         >
           <button
-            class="euiButton euiButton--primary euiButton--fill"
+            class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
             data-test-subj="ManageRulesButton"
             type="button"
           >
             <span
-              class="euiButtonContent euiButton__content"
+              class="emotion-euiButtonDisplayContent"
             >
               <span
-                class="euiButton__text"
+                class="eui-textTruncate"
               >
                 Manage rules
               </span>
@@ -244,7 +244,7 @@ Object {
               >
                 <button
                   aria-label="Header menu Button Icon"
-                  class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
+                  class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
                   data-test-subj="MenuActionsButtonIcon"
                   type="button"
                 >
@@ -278,7 +278,7 @@ Object {
           tabindex="0"
         >
           <div
-            class="emotion-euiPopoverArrow-bottom"
+            class="euiPopover__arrow emotion-euiPopoverArrow-bottom"
             data-popover-arrow="bottom"
             style="left: 10px; top: 0px;"
           />
@@ -361,15 +361,15 @@ Object {
         class="euiFlexItem"
       >
         <button
-          class="euiButton euiButton--primary euiButton--fill"
+          class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
           data-test-subj="ManageRulesButton"
           type="button"
         >
           <span
-            class="euiButtonContent euiButton__content"
+            class="emotion-euiButtonDisplayContent"
           >
             <span
-              class="euiButton__text"
+              class="eui-textTruncate"
             >
               Manage rules
             </span>
@@ -391,7 +391,7 @@ Object {
             >
               <button
                 aria-label="Header menu Button Icon"
-                class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
+                class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
                 data-test-subj="MenuActionsButtonIcon"
                 type="button"
               >
@@ -486,7 +486,7 @@ Object {
               >
                 <button
                   aria-label="Header menu Button Empty"
-                  class="euiButtonEmpty euiButtonEmpty--primary"
+                  class="euiButtonEmpty css-9t7nyf-empty-primary"
                   data-test-subj="LinkedRulesMenuEmptyButton"
                   type="button"
                 >
@@ -513,15 +513,15 @@ Object {
           class="euiFlexItem"
         >
           <button
-            class="euiButton euiButton--primary euiButton--fill"
+            class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
             data-test-subj="ManageRulesButton"
             type="button"
           >
             <span
-              class="euiButtonContent euiButton__content"
+              class="emotion-euiButtonDisplayContent"
             >
               <span
-                class="euiButton__text"
+                class="eui-textTruncate"
               >
                 Manage rules
               </span>
@@ -543,7 +543,7 @@ Object {
               >
                 <button
                   aria-label="Header menu Button Icon"
-                  class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
+                  class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
                   data-test-subj="MenuActionsButtonIcon"
                   type="button"
                 >
@@ -577,7 +577,7 @@ Object {
           tabindex="0"
         >
           <div
-            class="emotion-euiPopoverArrow-bottom"
+            class="euiPopover__arrow emotion-euiPopoverArrow-bottom"
             data-popover-arrow="bottom"
             style="left: 10px; top: 0px;"
           />
@@ -662,7 +662,7 @@ Object {
             >
               <button
                 aria-label="Header menu Button Empty"
-                class="euiButtonEmpty euiButtonEmpty--primary"
+                class="euiButtonEmpty css-9t7nyf-empty-primary"
                 data-test-subj="LinkedRulesMenuEmptyButton"
                 type="button"
               >
@@ -689,15 +689,15 @@ Object {
         class="euiFlexItem"
       >
         <button
-          class="euiButton euiButton--primary euiButton--fill"
+          class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
           data-test-subj="ManageRulesButton"
           type="button"
         >
           <span
-            class="euiButtonContent euiButton__content"
+            class="emotion-euiButtonDisplayContent"
           >
             <span
-              class="euiButton__text"
+              class="eui-textTruncate"
             >
               Manage rules
             </span>
@@ -719,7 +719,7 @@ Object {
             >
               <button
                 aria-label="Header menu Button Icon"
-                class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
+                class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
                 data-test-subj="MenuActionsButtonIcon"
                 type="button"
               >
diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/search_index/components/header_actions/syncs_context_menu.test.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/search_index/components/header_actions/syncs_context_menu.test.tsx
index e49077f040542..b6f94c91410d1 100644
--- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/search_index/components/header_actions/syncs_context_menu.test.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/search_index/components/header_actions/syncs_context_menu.test.tsx
@@ -14,7 +14,6 @@ import {
   EuiPopover,
   EuiContextMenuItem,
   EuiContextMenuPanel,
-  EuiButton,
   EuiResizeObserver,
 } from '@elastic/eui';
 
@@ -59,7 +58,9 @@ describe('SyncsContextMenu', () => {
   it('Can cancel syncs', () => {
     setMockValues({ ...mockValues, isSyncing: true });
     const wrapper = mountWithIntl(<SyncsContextMenu />);
-    const button = wrapper.find(EuiButton);
+    const button = wrapper.find(
+      'button[data-telemetry-id="entSearchContent-connector-header-sync-openSyncMenu"]'
+    );
     button.simulate('click');
 
     const menuItems = wrapper
@@ -83,7 +84,9 @@ describe('SyncsContextMenu', () => {
   it('Can start a sync', () => {
     setMockValues({ ...mockValues, ingestionStatus: IngestionStatus.ERROR });
     const wrapper = mountWithIntl(<SyncsContextMenu />);
-    const button = wrapper.find(EuiButton);
+    const button = wrapper.find(
+      'button[data-telemetry-id="entSearchContent-connector-header-sync-openSyncMenu"]'
+    );
     button.simulate('click');
 
     const menuItems = wrapper