Fix flyout history functionality for EUI v114.0.0 upgrade

src/platform/packages/shared/kbn-scout/src/playwright/page_objects/overlays.ts

@@ -31,10 +31,6 @@ export class OverlaysPage {
       .locator('[data-test-subj="euiFlyoutCloseButton"]');
   }
 
-  public get docViewerFlyoutCloseButton() {
-    return this.docViewerFlyout.locator('[data-test-subj="euiFlyoutCloseButton"]');
-  }
-
   public async openNewsfeedFlyout() {
     await this.newsfeedButton.click();
     await expect(this.newsfeedFlyout).toBeVisible();
@@ -44,9 +40,4 @@ export class OverlaysPage {
     await this.newsfeedFlyoutCloseButton.click();
     await expect(this.newsfeedFlyout).toBeHidden();
   }
-
-  public async closeDocViewerFlyout() {
-    await this.docViewerFlyoutCloseButton.click();
-    await expect(this.docViewerFlyout).toBeHidden();
-  }
 }

src/platform/plugins/shared/discover/test/scout/ui/fixtures/traces_experience/page_objects/apm.ts

@@ -43,7 +43,7 @@ export function createApmPage(page: ScoutPage): ApmPage {
         ? page.testSubj.locator(tableTestSubj)
         : page.locator('table');
 
-      await container.getByText(linkText).click();
+      await container.getByText(linkText).first().click();
     },
 
     async clickWaterfallItem(itemName: string) {

src/platform/plugins/shared/discover/test/scout/ui/fixtures/traces_experience/page_objects/flyout.ts

@@ -50,10 +50,7 @@ export interface TracesFlyout {
 
   readonly waterfallFlyout: {
     readonly container: Locator;
-    /** Present when managed flyout history has entries (e.g. after opening a nested doc flyout). */
     readonly backButton: Locator;
-    /** Always present on managed flyouts; use to dismiss the timeline when Back is hidden (EUI 114+ scoped history). */
-    readonly closeButton: Locator;
     getWaterfallItem(name: string): {
       readonly row: Locator;
       readonly content: Locator;
@@ -135,7 +132,6 @@ export function createTracesFlyout(page: ScoutPage): TracesFlyout {
       return {
         container: timelineFlyout,
         backButton: timelineFlyout.locator('[data-test-subj="euiFlyoutMenuBackButton"]'),
-        closeButton: timelineFlyout.locator('[data-test-subj="euiFlyoutCloseButton"]'),
         getWaterfallItem(name: string) {
           const row = timelineFlyout
             .locator('[data-test-subj="traceItemRowWrapper"]')

src/platform/plugins/shared/discover/test/scout/ui/parallel_tests/traces_experience/flyout_cascade_close.spec.ts

@@ -0,0 +1,110 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the "Elastic License
+ * 2.0", the "GNU Affero General Public License v3.0 only", and the "Server Side
+ * Public License v 1"; you may not use this file except in compliance with, at
+ * your election, the "Elastic License 2.0", the "GNU Affero General Public
+ * License v3.0 only", or the "Server Side Public License, v 1".
+ */
+
+import { tags } from '@kbn/scout';
+import { expect } from '@kbn/scout/ui';
+import type { PageObjects } from '@kbn/scout';
+import {
+  spaceTest,
+  TRACES,
+  RICH_TRACE,
+  setupTracesExperience,
+  teardownTracesExperience,
+} from '../../fixtures/traces_experience';
+import type { TracesFlyout } from '../../fixtures/traces_experience/page_objects/flyout';
+
+type DiscoverPage = PageObjects['discover'];
+
+const openDocViewerAndTraceTimeline = async (pageObjects: {
+  discover: DiscoverPage;
+  tracesExperience: {
+    openOverviewTab: (d: DiscoverPage) => Promise<void>;
+    flyout: TracesFlyout;
+  };
+}) => {
+  await pageObjects.discover.writeAndSubmitEsqlQuery(
+    `${TRACES.ESQL_QUERY} | WHERE transaction.name == "${RICH_TRACE.TRANSACTION_NAME}"`
+  );
+  await pageObjects.tracesExperience.openOverviewTab(pageObjects.discover);
+  await pageObjects.tracesExperience.flyout.traceSummary.fullScreenButton.click();
+  await expect(pageObjects.tracesExperience.flyout.waterfallFlyout.container).toBeVisible();
+};
+
+spaceTest.describe(
+  'Traces in Discover - Flyout cascade-close Emotion cache stability',
+  {
+    tag: [...tags.stateful.all, ...tags.serverless.observability.complete],
+  },
+  () => {
+    spaceTest.beforeAll(async ({ scoutSpace, config }) => {
+      await setupTracesExperience(scoutSpace, config);
+    });
+
+    spaceTest.beforeEach(async ({ browserAuth, pageObjects, page }) => {
+      await browserAuth.loginAsViewer();
+      await pageObjects.discover.goto();
+      // Suppress the tour so it does not overlap the waterfall flyout interactions.
+      await page.evaluate(() => localStorage.setItem('fullscreenWaterfallTourDismissed', 'true'));
+    });
+
+    spaceTest.afterAll(async ({ scoutSpace }) => {
+      await teardownTracesExperience(scoutSpace);
+    });
+
+    spaceTest(
+      'closing the Trace Timeline flyout navigates back to the Document Viewer without corrupting the Emotion style cache',
+      async ({ page, pageObjects }) => {
+        const { flyout } = pageObjects.tracesExperience;
+        const docViewerFlyout = page.testSubj.locator('docViewerFlyout');
+
+        const consoleErrors: string[] = [];
+        page.on('console', (msg) => {
+          if (msg.type() === 'error') {
+            consoleErrors.push(msg.text());
+          }
+        });
+
+        await spaceTest.step(
+          'open the Document Viewer and Trace Timeline flyouts',
+          async () => {
+            await pageObjects.discover.waitUntilSearchingHasFinished();
+            await openDocViewerAndTraceTimeline(pageObjects);
+          }
+        );
+
+        await spaceTest.step(
+          'close the Trace Timeline flyout via the Back button',
+          async () => {
+            await flyout.waterfallFlyout.backButton.click();
+            await expect(flyout.waterfallFlyout.container).toBeHidden();
+            // The Document Viewer remains visible — it was not cascade-closed because
+            // both flyouts share the same EUI flyout-manager historyKey.
+            await expect(docViewerFlyout).toBeVisible();
+          }
+        );
+
+        await spaceTest.step(
+          're-open the Trace Timeline flyout after navigating back',
+          async () => {
+            await flyout.traceSummary.fullScreenButton.click();
+            await expect(flyout.waterfallFlyout.container).toBeVisible();
+          }
+        );
+
+        await spaceTest.step(
+          'verify no insertBefore errors from stale Emotion cache refs',
+          async () => {
+            const hasInsertBeforeError = consoleErrors.some((msg) => msg.includes('insertBefore'));
+            expect(hasInsertBeforeError).toBe(false);
+          }
+        );
+      }
+    );
+  }
+);

src/platform/plugins/shared/discover/test/scout/ui/parallel_tests/traces_experience/overview_tab_usage.spec.ts

@@ -166,7 +166,7 @@ spaceTest.describe(
           async () => {
             await flyout.traceSummary.waterfallClickArea.click();
             await expect(flyout.waterfallFlyout.container).toBeVisible();
-            await flyout.waterfallFlyout.closeButton.click();
+            await flyout.waterfallFlyout.backButton.click();
             await expect(flyout.waterfallFlyout.container).toBeHidden();
           }
         );
@@ -176,7 +176,7 @@ spaceTest.describe(
           async () => {
             await flyout.traceSummary.fullScreenButton.click();
             await expect(flyout.waterfallFlyout.container).toBeVisible();
-            await flyout.waterfallFlyout.closeButton.click();
+            await flyout.waterfallFlyout.backButton.click();
             await expect(flyout.waterfallFlyout.container).toBeHidden();
           }
         );