From f319a0289beeb0b4b465968eb4e6e676cbcd2063 Mon Sep 17 00:00:00 2001 From: "Eyo O. Eyo" <7893459+eokoneyo@users.noreply.github.com> Date: Tue, 12 Mar 2024 20:16:13 +0100 Subject: [PATCH] Fix how sample data test install state is determined in test (#178529) ## Summary Closes https://github.com/elastic/kibana/issues/112103 Make sample data install status available to be read by test util, as documented by @gsoldevila in the issue referenced above. The issue happens because there's a slight delay that really can't be walked around where the install status in this particular instance is still 'installed' but the call to mark the sample data completes so there's that flicker where the `remove` element is displayed momentarily because the component doesn't quite received the update to the sample data's install status immediately. The proposed fix opts to complement the current way of determining if any sample data is installed using the newly introduced `data-status` attribute, here we wait till the result of clicking the remove button actually triggers a change in the value of the install state of said sample data, which in turn is reflected in the value of `data-status` alongside checking that the remove button exists. ### Checklist - [x] [Unit or functional tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html) were updated or added to match the most common scenarios - [x] [Flaky Test Runner](https://ci-stats.kibana.dev/trigger_flaky_test_runner/1) was used on any tests changed (cherry picked from commit 910188e4e0baf6b2dbfbab88f4f4466a077f87c2) --- .../sample_data_card.test.tsx.snap | 165 ++++++++++-------- .../sample_data_card/src/footer/index.tsx | 30 +++- test/functional/page_objects/home_page.ts | 5 +- .../tests/browser.ts | 3 +- 4 files changed, 117 insertions(+), 86 deletions(-) diff --git a/packages/home/sample_data_card/src/__snapshots__/sample_data_card.test.tsx.snap b/packages/home/sample_data_card/src/__snapshots__/sample_data_card.test.tsx.snap index 269499f65547a..76a56fb33c5e4 100644 --- a/packages/home/sample_data_card/src/__snapshots__/sample_data_card.test.tsx.snap +++ b/packages/home/sample_data_card/src/__snapshots__/sample_data_card.test.tsx.snap @@ -57,56 +57,61 @@ exports[`SampleDataCard installed renders with app links 1`] = ` class="emotion-euiCard__footer" >
- -
-
+
+
+ +
+
@@ -171,47 +176,52 @@ exports[`SampleDataCard installed renders without app links 1`] = ` class="emotion-euiCard__footer" >
- -
-
-
+
- - View data + + View data + - - + +
@@ -265,27 +275,32 @@ exports[`SampleDataCard not installed renders 1`] = ` class="emotion-euiCard__footer" >
- + +
diff --git a/packages/home/sample_data_card/src/footer/index.tsx b/packages/home/sample_data_card/src/footer/index.tsx index 3ef415d07c507..eaf00c8198b7e 100644 --- a/packages/home/sample_data_card/src/footer/index.tsx +++ b/packages/home/sample_data_card/src/footer/index.tsx @@ -6,7 +6,7 @@ * Side Public License, v 1. */ -import React from 'react'; +import React, { useCallback } from 'react'; import { SampleDataSet, InstalledStatus } from '@kbn/home-sample-data-types'; import { INSTALLED_STATUS, UNINSTALLED_STATUS } from '../constants'; @@ -28,13 +28,27 @@ export interface Props { * Displays the appropriate Footer component based on the status of the Sample Data Set. */ export const Footer = ({ sampleDataSet, onAction }: Props) => { - if (sampleDataSet.status === INSTALLED_STATUS) { - return onAction(id, UNINSTALLED_STATUS)} {...sampleDataSet} />; - } + const renderContent = useCallback(() => { + if (sampleDataSet.status === INSTALLED_STATUS) { + return ( + onAction(id, UNINSTALLED_STATUS)} {...sampleDataSet} /> + ); + } - if (sampleDataSet.status === UNINSTALLED_STATUS) { - return onAction(id, INSTALLED_STATUS)} {...sampleDataSet} />; - } + if (sampleDataSet.status === UNINSTALLED_STATUS) { + return ( + onAction(id, INSTALLED_STATUS)} {...sampleDataSet} /> + ); + } - return ; + return ; + }, [onAction, sampleDataSet]); + + return ( + // the data-status attribute is added to solve issues with failing test, + // see https://github.com/elastic/kibana/issues/112103 +
+ {renderContent()} +
+ ); }; diff --git a/test/functional/page_objects/home_page.ts b/test/functional/page_objects/home_page.ts index 1901f12073438..4225f52b16994 100644 --- a/test/functional/page_objects/home_page.ts +++ b/test/functional/page_objects/home_page.ts @@ -48,9 +48,12 @@ export class HomePageObject extends FtrService { async isSampleDataSetInstalled(id: string) { const sampleDataCard = await this.testSubjects.find(`sampleDataSetCard${id}`); + const installStatus = await ( + await sampleDataCard.findByCssSelector('[data-status]') + ).getAttribute('data-status'); const deleteButton = await sampleDataCard.findAllByTestSubject(`removeSampleDataSet${id}`); this.log.debug(`Sample data installed: ${deleteButton.length > 0}`); - return deleteButton.length > 0; + return installStatus === 'installed' && deleteButton.length > 0; } async isWelcomeInterstitialDisplayed() { diff --git a/x-pack/test/functional_execution_context/tests/browser.ts b/x-pack/test/functional_execution_context/tests/browser.ts index 63f575b798b93..f7d265316decb 100644 --- a/x-pack/test/functional_execution_context/tests/browser.ts +++ b/x-pack/test/functional_execution_context/tests/browser.ts @@ -12,8 +12,7 @@ import { assertLogContains, isExecutionContextLog, readLogFile } from '../test_u export default function ({ getService, getPageObjects }: FtrProviderContext) { const PageObjects = getPageObjects(['common', 'dashboard', 'header', 'home', 'timePicker']); - // FLAKY: https://github.com/elastic/kibana/issues/112103 - describe.skip('Browser apps', () => { + describe('Browser apps', () => { let logs: Ecs[]; const retry = getService('retry');