diff --git a/src/plugins/data/public/ui/filter_bar/filter_item.tsx b/src/plugins/data/public/ui/filter_bar/filter_item.tsx index 7b65805a482dd..0d730aed0b28a 100644 --- a/src/plugins/data/public/ui/filter_bar/filter_item.tsx +++ b/src/plugins/data/public/ui/filter_bar/filter_item.tsx @@ -153,7 +153,14 @@ export function FilterItem(props: Props) { const dataTestSubjNegated = filter.meta.negate ? 'filter-negated' : ''; const dataTestSubjDisabled = `filter-${isDisabled(labelConfig) ? 'disabled' : 'enabled'}`; const dataTestSubjPinned = `filter-${isFilterPinned(filter) ? 'pinned' : 'unpinned'}`; - return `filter ${dataTestSubjDisabled} ${dataTestSubjKey} ${dataTestSubjValue} ${dataTestSubjPinned} ${dataTestSubjNegated}`; + return classNames( + 'filter', + dataTestSubjDisabled, + dataTestSubjKey, + dataTestSubjValue, + dataTestSubjPinned, + dataTestSubjNegated + ); } function getPanels() { diff --git a/test/functional/services/filter_bar.ts b/test/functional/services/filter_bar.ts index de895918efbba..546f83e5b710a 100644 --- a/test/functional/services/filter_bar.ts +++ b/test/functional/services/filter_bar.ts @@ -17,6 +17,7 @@ * under the License. */ +import classNames from 'classnames'; import { FtrProviderContext } from '../ftr_provider_context'; export function FilterBarProvider({ getService, getPageObjects }: FtrProviderContext) { @@ -45,7 +46,14 @@ export function FilterBarProvider({ getService, getPageObjects }: FtrProviderCon const filterPinnedState = pinned ? 'pinned' : 'unpinned'; const filterNegatedState = negated ? 'filter-negated' : ''; return testSubjects.exists( - `filter filter-${filterActivationState} filter-key-${key} filter-value-${value} filter-${filterPinnedState} ${filterNegatedState}`, + classNames( + 'filter', + `filter-${filterActivationState}`, + key !== '' && `filter-key-${key}`, + value !== '' && `filter-value-${value}`, + `filter-${filterPinnedState}`, + filterNegatedState + ), { allowHidden: true, } diff --git a/x-pack/plugins/security_solution/cypress/integration/timeline_data_providers.spec.ts b/x-pack/plugins/security_solution/cypress/integration/timeline_data_providers.spec.ts index d2a20fe1ecdbc..2a1eab44b80f4 100644 --- a/x-pack/plugins/security_solution/cypress/integration/timeline_data_providers.spec.ts +++ b/x-pack/plugins/security_solution/cypress/integration/timeline_data_providers.spec.ts @@ -25,9 +25,7 @@ import { closeTimeline, createNewTimeline } from '../tasks/timeline'; import { HOSTS_URL } from '../urls/navigation'; import { cleanKibana } from '../tasks/common'; -// FLAKY: https://github.com/elastic/kibana/issues/85098 -// FLAKY: https://github.com/elastic/kibana/issues/62060 -describe.skip('timeline data providers', () => { +describe('timeline data providers', () => { before(() => { cleanKibana(); loginAndWaitForPage(HOSTS_URL); diff --git a/x-pack/plugins/security_solution/cypress/screens/timeline.ts b/x-pack/plugins/security_solution/cypress/screens/timeline.ts index 12df10c38c260..fef94da062e01 100644 --- a/x-pack/plugins/security_solution/cypress/screens/timeline.ts +++ b/x-pack/plugins/security_solution/cypress/screens/timeline.ts @@ -89,6 +89,18 @@ export const SAVE_FILTER_BTN = '[data-test-subj="saveFilter"]'; export const SEARCH_OR_FILTER_CONTAINER = '[data-test-subj="timeline-search-or-filter-search-container"]'; +export const QUERY_TAB_EVENTS_TABLE = '[data-test-subj="query-events-table"]'; + +export const QUERY_TAB_EVENTS_BODY = '[data-test-subj="query-tab-flyout-body"]'; + +export const QUERY_TAB_EVENTS_FOOTER = '[data-test-subj="query-tab-flyout-footer"]'; + +export const PINNED_TAB_EVENTS_TABLE = '[data-test-subj="pinned-events-table"]'; + +export const PINNED_TAB_EVENTS_BODY = '[data-test-subj="pinned-tab-flyout-body"]'; + +export const PINNED_TAB_EVENTS_FOOTER = '[data-test-subj="pinned-tab-flyout-footer"]'; + export const SERVER_SIDE_EVENT_COUNT = '[data-test-subj="server-side-event-count"]'; export const STAR_ICON = '[data-test-subj="timeline-favorite-empty-star"]'; @@ -111,10 +123,8 @@ export const TIMELINE_DROPPED_DATA_PROVIDERS = '[data-test-subj="providerContain export const TIMELINE_FIELDS_BUTTON = '[data-test-subj="timeline"] [data-test-subj="show-field-browser"]'; -export const TIMELINE_FILTER = (filter: TimelineFilter) => { - // The space at the end of the line is required. We want to keep it until it is updated. - return `[data-test-subj="filter filter-enabled filter-key-${filter.field} filter-value-${filter.value} filter-unpinned "]`; -}; +export const TIMELINE_FILTER = (filter: TimelineFilter) => + `[data-test-subj="filter filter-enabled filter-key-${filter.field} filter-value-${filter.value} filter-unpinned"]`; export const TIMELINE_FILTER_FIELD = '[data-test-subj="filterFieldSuggestionList"]'; @@ -127,9 +137,9 @@ export const TIMELINE_FILTER_VALUE = export const TIMELINE_FLYOUT = '[data-test-subj="eui-flyout"]'; -export const TIMELINE_FLYOUT_HEADER = '[data-test-subj="eui-flyout-header"]'; +export const TIMELINE_FLYOUT_HEADER = '[data-test-subj="query-tab-flyout-header"]'; -export const TIMELINE_FLYOUT_BODY = '[data-test-subj="eui-flyout-body"]'; +export const TIMELINE_FLYOUT_BODY = '[data-test-subj="query-tab-flyout-body"]'; export const TIMELINE_INSPECT_BUTTON = `${TIMELINE_FLYOUT} [data-test-subj="inspect-icon-button"]`; diff --git a/x-pack/plugins/security_solution/cypress/tasks/timeline.ts b/x-pack/plugins/security_solution/cypress/tasks/timeline.ts index 680aa11e1607f..47c1fd237432c 100644 --- a/x-pack/plugins/security_solution/cypress/tasks/timeline.ts +++ b/x-pack/plugins/security_solution/cypress/tasks/timeline.ts @@ -118,7 +118,6 @@ export const closeTimeline = () => { export const createNewTimeline = () => { cy.get(TIMELINE_SETTINGS_ICON).filter(':visible').click({ force: true }); - cy.wait(1000); cy.get(CREATE_NEW_TIMELINE).should('be.visible'); cy.get(CREATE_NEW_TIMELINE).click(); }; diff --git a/x-pack/plugins/security_solution/public/timelines/components/timeline/body/index.tsx b/x-pack/plugins/security_solution/public/timelines/components/timeline/body/index.tsx index a03f4c07645ad..8f306ef19e036 100644 --- a/x-pack/plugins/security_solution/public/timelines/components/timeline/body/index.tsx +++ b/x-pack/plugins/security_solution/public/timelines/components/timeline/body/index.tsx @@ -179,7 +179,7 @@ export const BodyComponent = React.memo( { ); - expect(wrapper.find('[data-test-subj="events-table"]').exists()).toEqual(true); + expect( + wrapper.find(`[data-test-subj="${TimelineTabs.pinned}-events-table"]`).exists() + ).toEqual(true); }); it('it shows the timeline footer', () => { diff --git a/x-pack/plugins/security_solution/public/timelines/components/timeline/pinned_tab_content/index.tsx b/x-pack/plugins/security_solution/public/timelines/components/timeline/pinned_tab_content/index.tsx index 1054b5405d9d9..e204578db610c 100644 --- a/x-pack/plugins/security_solution/public/timelines/components/timeline/pinned_tab_content/index.tsx +++ b/x-pack/plugins/security_solution/public/timelines/components/timeline/pinned_tab_content/index.tsx @@ -173,10 +173,13 @@ export const PinnedTabContentComponent: React.FC = ({ return ( <> - + - + = ({ />