Add cypress test

x-pack/plugins/siem/cypress/integration/search_bar.spec.ts

@@ -0,0 +1,26 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { loginAndWaitForPage } from '../tasks/login';
+import { openAddFilterPopover, fillAddFilterForm } from '../tasks/search_bar';
+import { GLOBAL_SEARCH_BAR_FILTER_ITEM } from '../screens/search_bar';
+
+import { HOSTS_PAGE } from '../urls/navigation';
+
+describe('SearchBar', () => {
+  before(() => {
+    loginAndWaitForPage(HOSTS_PAGE);
+  });
+
+  it('adds correctly a filter to the global search bar', () => {
+    const filterKey = 'host.ip';
+    const filterValue = '1.1.1.1';
+
+    openAddFilterPopover();
+    fillAddFilterForm(filterKey, filterValue);
+    cy.get(GLOBAL_SEARCH_BAR_FILTER_ITEM(filterKey, filterValue)).should('be.visible');
+  });
+});

x-pack/plugins/siem/cypress/screens/search_bar.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;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+export const GLOBAL_SEARCH_BAR_ADD_FILTER =
+  '[data-test-subj="globalDatePicker"] [data-test-subj="addFilter"]';
+
+export const ADD_FILTER_FORM_FIELD_INPUT =
+  '[data-test-subj="filterFieldSuggestionList"] input[data-test-subj="comboBoxSearchInput"]';
+
+export const ADD_FILTER_FORM_FIELD_OPTION = (value: string) =>
+  `[data-test-subj="comboBoxOptionsList filterFieldSuggestionList-optionsList"] button[title="${value}"] strong`;
+
+export const ADD_FILTER_FORM_OPERATOR_FIELD =
+  '[data-test-subj="filterOperatorList"] input[data-test-subj="comboBoxSearchInput"]';
+
+export const ADD_FILTER_FORM_OPERATOR_OPTION_IS =
+  '[data-test-subj="comboBoxOptionsList filterOperatorList-optionsList"] button[title="is"]';
+
+export const ADD_FILTER_FORM_FILTER_VALUE_INPUT = '[data-test-subj="filterParams"] input';
+
+export const ADD_FILTER_FORM_SAVE_BUTTON = '[data-test-subj="saveFilter"]';
+
+export const GLOBAL_SEARCH_BAR_FILTER_ITEM = (filterKey: string, filterValue: string) =>
+  `[data-test-subj="filter filter-enabled filter-key-${filterKey} filter-value-${filterValue} filter-unpinned"]`;

x-pack/plugins/siem/cypress/tasks/search_bar.ts

@@ -0,0 +1,28 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import {
+  GLOBAL_SEARCH_BAR_ADD_FILTER,
+  ADD_FILTER_FORM_SAVE_BUTTON,
+  ADD_FILTER_FORM_FIELD_INPUT,
+  ADD_FILTER_FORM_OPERATOR_OPTION_IS,
+  ADD_FILTER_FORM_OPERATOR_FIELD,
+  ADD_FILTER_FORM_FIELD_OPTION,
+  ADD_FILTER_FORM_FILTER_VALUE_INPUT,
+} from '../screens/search_bar';
+
+export const openAddFilterPopover = () => {
+  cy.get(GLOBAL_SEARCH_BAR_ADD_FILTER).click({ force: true });
+};
+
+export const fillAddFilterForm = (filterKey: string, filterValue: string) => {
+  cy.get(ADD_FILTER_FORM_FIELD_INPUT).type(filterKey);
+  cy.get(ADD_FILTER_FORM_FIELD_OPTION(filterKey)).click({ force: true });
+  cy.get(ADD_FILTER_FORM_OPERATOR_FIELD).click();
+  cy.get(ADD_FILTER_FORM_OPERATOR_OPTION_IS).click();
+  cy.get(ADD_FILTER_FORM_FILTER_VALUE_INPUT).type(filterValue);
+  cy.get(ADD_FILTER_FORM_SAVE_BUTTON).click();
+};