[Emotion] Use patched Emotion library to resolve Flyout System issue

package.json

@@ -79,6 +79,7 @@
   },
   "resolutions": {
     "**/@babel/parser": "7.24.7",
+    "**/@emotion/sheet": "npm:@elastic/emotion-sheet@1.4.1",
     "**/@hello-pangea/dnd": "18.0.1",
     "**/@langchain/core": "0.3.80",
     "**/@langchain/google-common": "0.2.18",

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

@@ -23,6 +23,7 @@ import { createLazyPageObject } from './utils';
 import { Inspector } from './inspector';
 import { LensApp } from './lens_app';
 import { LoginPage } from './login_page';
+import { OverlaysPage } from './overlays';
 import type { KibanaUrl } from '../../common/services/kibana_url';
 
 export interface PageObjectsFixtures {
@@ -45,6 +46,7 @@ export interface PageObjects {
   inspector: Inspector;
   lens: LensApp;
   login: LoginPage;
+  overlays: OverlaysPage;
 }
 
 /**
@@ -67,6 +69,6 @@ export function createCorePageObjects(fixtures: PageObjectsFixtures): PageObject
     inspector: createLazyPageObject(Inspector, fixtures.page),
     lens: createLazyPageObject(LensApp, fixtures.page),
     login: createLazyPageObject(LoginPage, fixtures.page, fixtures.kbnUrl),
-    // Add new page objects here
+    overlays: createLazyPageObject(OverlaysPage, fixtures.page),
   };
 }

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

@@ -0,0 +1,43 @@
+/*
+ * 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 type { ScoutPage } from '..';
+import { expect } from '..';
+
+export class OverlaysPage {
+  constructor(private readonly page: ScoutPage) {}
+
+  public get docViewerFlyout() {
+    return this.page.testSubj.locator('docViewerFlyout');
+  }
+
+  public get newsfeedButton() {
+    return this.page.testSubj.locator('newsfeed');
+  }
+
+  public get newsfeedFlyout() {
+    return this.page.testSubj.locator('NewsfeedFlyout');
+  }
+
+  public get newsfeedFlyoutCloseButton() {
+    return this.page.testSubj
+      .locator('NewsfeedFlyout')
+      .locator('[data-test-subj="euiFlyoutCloseButton"]');
+  }
+
+  public async openNewsfeedFlyout() {
+    await this.newsfeedButton.click();
+    await expect(this.newsfeedFlyout).toBeVisible();
+  }
+
+  public async closeNewsfeedFlyout() {
+    await this.newsfeedFlyoutCloseButton.click();
+    await expect(this.newsfeedFlyout).toBeHidden();
+  }
+}

src/platform/plugins/shared/discover/test/scout/ui/fixtures/flyout_stability/constants.ts

@@ -0,0 +1,16 @@
+/*
+ * 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".
+ */
+
+export const LOGSTASH = {
+  DEFAULT_START_TIME: 'Sep 19, 2015 @ 06:31:44.000',
+  DEFAULT_END_TIME: 'Sep 23, 2015 @ 18:31:44.000',
+  DATA_VIEW_NAME: 'logstash-*',
+  KBN_ARCHIVE:
+    'src/platform/plugins/shared/discover/test/scout/ui/fixtures/flyout_stability/kbn_archives/logstash_data_view.json',
+};

src/platform/plugins/shared/discover/test/scout/ui/fixtures/flyout_stability/index.ts

@@ -0,0 +1,11 @@
+/*
+ * 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".
+ */
+
+export { LOGSTASH } from './constants';
+export { setupFlyoutStability, teardownFlyoutStability } from './setup';

src/platform/plugins/shared/discover/test/scout/ui/fixtures/flyout_stability/kbn_archives/logstash_data_view.json

@@ -0,0 +1,15 @@
+{
+  "attributes": {
+    "name": "logstash-*",
+    "timeFieldName": "@timestamp",
+    "title": "logstash-*"
+  },
+  "coreMigrationVersion": "8.8.0",
+  "created_at": "2025-01-01T00:00:00.000Z",
+  "id": "logstash-data-view",
+  "managed": false,
+  "references": [],
+  "type": "index-pattern",
+  "typeMigrationVersion": "7.11.0",
+  "updated_at": "2025-01-01T00:00:00.000Z"
+}

src/platform/plugins/shared/discover/test/scout/ui/fixtures/flyout_stability/setup.ts

@@ -0,0 +1,27 @@
+/*
+ * 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 type { ScoutParallelWorkerFixtures } from '@kbn/scout';
+import { LOGSTASH } from './constants';
+
+export async function setupFlyoutStability(scoutSpace: ScoutParallelWorkerFixtures['scoutSpace']) {
+  await scoutSpace.savedObjects.load(LOGSTASH.KBN_ARCHIVE);
+  await scoutSpace.uiSettings.setDefaultIndex(LOGSTASH.DATA_VIEW_NAME);
+  await scoutSpace.uiSettings.setDefaultTime({
+    from: LOGSTASH.DEFAULT_START_TIME,
+    to: LOGSTASH.DEFAULT_END_TIME,
+  });
+}
+
+export async function teardownFlyoutStability(
+  scoutSpace: ScoutParallelWorkerFixtures['scoutSpace']
+) {
+  await scoutSpace.uiSettings.unset('defaultIndex', 'timepicker:timeDefaults');
+  await scoutSpace.savedObjects.cleanStandardList();
+}

src/platform/plugins/shared/discover/test/scout/ui/parallel_tests/flyout_stability/flyout_emotion_cache.spec.ts

@@ -0,0 +1,69 @@
+/*
+ * 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, spaceTest } from '@kbn/scout';
+import { expect } from '@kbn/scout/ui';
+import { setupFlyoutStability, teardownFlyoutStability } from '../../fixtures/flyout_stability';
+
+spaceTest.describe('Flyout system Emotion cache stability', { tag: tags.stateful.classic }, () => {
+  spaceTest.beforeAll(async ({ scoutSpace }) => {
+    await setupFlyoutStability(scoutSpace);
+  });
+
+  spaceTest.beforeEach(async ({ browserAuth, pageObjects }) => {
+    await browserAuth.loginAsViewer();
+    await pageObjects.discover.goto();
+  });
+
+  spaceTest.afterAll(async ({ scoutSpace }) => {
+    await teardownFlyoutStability(scoutSpace);
+  });
+
+  spaceTest(
+    'opening a flyout after a cascade close does not corrupt the Emotion style cache',
+    async ({ page, pageObjects }) => {
+      const consoleErrors: string[] = [];
+      page.on('console', (msg) => {
+        if (msg.type() === 'error') {
+          consoleErrors.push(msg.text());
+        }
+      });
+
+      await spaceTest.step('open a document flyout', async () => {
+        await pageObjects.discover.waitUntilSearchingHasFinished();
+        await pageObjects.discover.openDocumentDetails({ rowIndex: 0 });
+        await expect(pageObjects.overlays.docViewerFlyout).toBeVisible();
+      });
+
+      await spaceTest.step('open a second flyout from a different domain', async () => {
+        await pageObjects.overlays.openNewsfeedFlyout();
+      });
+
+      await spaceTest.step('close the second flyout, triggering a cascade close', async () => {
+        await pageObjects.overlays.closeNewsfeedFlyout();
+        await expect(pageObjects.overlays.docViewerFlyout).toBeHidden();
+      });
+
+      await spaceTest.step('open a new flyout after the cascade close', async () => {
+        await pageObjects.discover.openDocumentDetails({ rowIndex: 0 });
+        await expect(pageObjects.overlays.docViewerFlyout).toBeVisible();
+      });
+
+      await spaceTest.step(
+        'verify no insertBefore errors from stale Emotion cache refs',
+        async () => {
+          await expect(page.testSubj.locator('discoverDocumentsTable')).toBeVisible();
+
+          const hasInsertBeforeError = consoleErrors.some((msg) => msg.includes('insertBefore'));
+          expect(hasInsertBeforeError).toBe(false);
+        }
+      );
+    }
+  );
+});

src/platform/plugins/shared/discover/test/scout/ui/parallel_tests/global.setup.ts

@@ -13,7 +13,24 @@ import { TRACES, richTrace, traceCorrelatedLogs } from '../fixtures/traces_exper
 
 globalSetupHook(
   'Setup Discover tests data',
-  async ({ esClient, apmSynthtraceEsClient, logsSynthtraceEsClient, apiServices, config, log }) => {
+  async ({
+    esClient,
+    esArchiver,
+    apmSynthtraceEsClient,
+    logsSynthtraceEsClient,
+    apiServices,
+    config,
+    log,
+  }) => {
+    // Logstash data for flyout stability tests
+    log.debug(
+      '[setup:logstash] loading logstash_functional ES data (only if it does not exist)...'
+    );
+    await esArchiver.loadIfNeeded(
+      'src/platform/test/functional/fixtures/es_archiver/logstash_functional'
+    );
+    log.debug('[setup:logstash] logstash_functional ES data ready');
+
     // Metrics Experience setup
     log.debug('[setup:metrics] creating metrics test index (only if it does not exist)...');
     const created = await createMetricsTestIndexIfNeeded(esClient);