From ce0ffe69cc49e1d71e6fb63aa8decd286d47ed64 Mon Sep 17 00:00:00 2001
From: cauemarcondes <caue.marcondes@elastic.co>
Date: Mon, 3 May 2021 14:29:40 -0400
Subject: [PATCH] adding e2e tests

---
 .../integration/read_only_user/home.spec.ts   |  7 ++++++
 .../service_overview/header_filters.spec.ts   | 22 +++++++++++++------
 .../shared/KueryBar/Typeahead/Suggestion.js   |  1 -
 .../shared/KueryBar/Typeahead/Suggestions.js  |  7 +++++-
 .../shared/KueryBar/Typeahead/index.js        |  1 +
 5 files changed, 29 insertions(+), 9 deletions(-)

diff --git a/x-pack/plugins/apm/ftr_e2e/cypress/integration/read_only_user/home.spec.ts b/x-pack/plugins/apm/ftr_e2e/cypress/integration/read_only_user/home.spec.ts
index 8f3bdea973f63f..4d65424a7b9bdb 100644
--- a/x-pack/plugins/apm/ftr_e2e/cypress/integration/read_only_user/home.spec.ts
+++ b/x-pack/plugins/apm/ftr_e2e/cypress/integration/read_only_user/home.spec.ts
@@ -7,6 +7,7 @@
 
 import url from 'url';
 import archives_metadata from '../../fixtures/es_archiver/archives_metadata';
+import { esArchiverLoad, esArchiverUnload } from '../../tasks/es_archiver';
 
 const { start, end } = archives_metadata['apm_8.0.0'];
 
@@ -17,6 +18,12 @@ const baseUrl = url.format({
 });
 
 describe('Home page', () => {
+  before(() => {
+    esArchiverLoad('apm_8.0.0');
+  });
+  after(() => {
+    esArchiverUnload('apm_8.0.0');
+  });
   beforeEach(() => {
     cy.loginAsReadOnlyUser();
   });
diff --git a/x-pack/plugins/apm/ftr_e2e/cypress/integration/read_only_user/service_overview/header_filters.spec.ts b/x-pack/plugins/apm/ftr_e2e/cypress/integration/read_only_user/service_overview/header_filters.spec.ts
index 8d40e8d0f58137..9dd5520954bfe0 100644
--- a/x-pack/plugins/apm/ftr_e2e/cypress/integration/read_only_user/service_overview/header_filters.spec.ts
+++ b/x-pack/plugins/apm/ftr_e2e/cypress/integration/read_only_user/service_overview/header_filters.spec.ts
@@ -4,6 +4,7 @@
  * 2.0; you may not use this file except in compliance with the Elastic License
  * 2.0.
  */
+import { includes } from 'lodash';
 import url from 'url';
 import archives_metadata from '../../../fixtures/es_archiver/archives_metadata';
 import { esArchiverLoad, esArchiverUnload } from '../../../tasks/es_archiver';
@@ -60,10 +61,10 @@ const apisToIntercept = [
 
 describe('Service overview - header filters', () => {
   before(() => {
-    // esArchiverLoad('apm_8.0.0');
+    esArchiverLoad('apm_8.0.0');
   });
   after(() => {
-    // esArchiverUnload('apm_8.0.0');
+    esArchiverUnload('apm_8.0.0');
   });
   beforeEach(() => {
     cy.loginAsReadOnlyUser();
@@ -119,12 +120,19 @@ describe('Service overview - header filters', () => {
   });
 
   describe('Filtering by kuerybar', () => {
-    it('filters by transaction.name', () => {
-      cy.visit(baseUrl);
-      cy.contains('Kibana');
+    it.only('filters by transaction.name', () => {
+      cy.visit(url.format({
+        pathname: '/app/apm/services/opbeans-java/overview',
+        query: { rangeFrom: start, rangeTo: end },
+      }));
+      cy.contains('opbeans-java');
       cy.get('[data-test-subj="headerFilterKuerybar"]').type('transaction.n');
-      // cy.get('[data-test-subj="transaction.name"]').click();
-      // cy.contains('transaction.name').click();
+      cy.contains('transaction.name');
+      cy.get('[data-test-subj="suggestionContainer"]').find('li').first().click();
+      cy.get('[data-test-subj="headerFilterKuerybar"]').type(':');
+      cy.get('[data-test-subj="suggestionContainer"]').find('li').first().click();
+      cy.get('[data-test-subj="suggestionContainer"]').realPress('{enter}')
+      cy.url().should('include', '&kuery=transaction.name')
     });
   });
 });
diff --git a/x-pack/plugins/apm/public/components/shared/KueryBar/Typeahead/Suggestion.js b/x-pack/plugins/apm/public/components/shared/KueryBar/Typeahead/Suggestion.js
index bbe901534e6b7e..d236d486a316b0 100644
--- a/x-pack/plugins/apm/public/components/shared/KueryBar/Typeahead/Suggestion.js
+++ b/x-pack/plugins/apm/public/components/shared/KueryBar/Typeahead/Suggestion.js
@@ -108,7 +108,6 @@ function Suggestion(props) {
       selected={props.selected}
       onClick={() => props.onClick(props.suggestion)}
       onMouseEnter={props.onMouseEnter}
-      data-test-subj={props.suggestion.text}
     >
       <Icon type={props.suggestion.type}>
         <EuiIcon type={getEuiIconType(props.suggestion.type)} />
diff --git a/x-pack/plugins/apm/public/components/shared/KueryBar/Typeahead/Suggestions.js b/x-pack/plugins/apm/public/components/shared/KueryBar/Typeahead/Suggestions.js
index cbbf762fa341c8..e5f0d866e254c0 100644
--- a/x-pack/plugins/apm/public/components/shared/KueryBar/Typeahead/Suggestions.js
+++ b/x-pack/plugins/apm/public/components/shared/KueryBar/Typeahead/Suggestions.js
@@ -72,7 +72,12 @@ class Suggestions extends Component {
     });
 
     return (
-      <List innerRef={(node) => (this.parentNode = node)}>{suggestions}</List>
+      <List
+        data-test-subj="suggestionContainer"
+        innerRef={(node) => (this.parentNode = node)}
+      >
+        {suggestions}
+      </List>
     );
   }
 }
diff --git a/x-pack/plugins/apm/public/components/shared/KueryBar/Typeahead/index.js b/x-pack/plugins/apm/public/components/shared/KueryBar/Typeahead/index.js
index 21524a877d4cc3..f441497209c3a9 100644
--- a/x-pack/plugins/apm/public/components/shared/KueryBar/Typeahead/index.js
+++ b/x-pack/plugins/apm/public/components/shared/KueryBar/Typeahead/index.js
@@ -172,6 +172,7 @@ export class Typeahead extends Component {
       >
         <div style={{ position: 'relative' }}>
           <EuiFieldSearch
+            data-test-subj="headerFilterKuerybar"
             fullWidth
             style={{
               backgroundImage: 'none',