[APM] Refactor Cypress e2e tests

x-pack/plugins/apm/ftr_e2e/config.ts

@@ -33,6 +33,7 @@ async function config({ readConfigFile }: FtrConfigProviderContext) {
       ...xpackFunctionalTestsConfig.get('kbnTestServer'),
       serverArgs: [
         ...xpackFunctionalTestsConfig.get('kbnTestServer.serverArgs'),
+        '--home.disableWelcomeScreen=true',
         '--csp.strict=false',
         // define custom kibana server args here
         `--elasticsearch.ssl.certificateAuthorities=${CA_CERT_PATH}`,

x-pack/plugins/apm/ftr_e2e/cypress/integration/read_only_user/home.spec.ts

@@ -7,7 +7,6 @@
 
 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'];
 
@@ -28,15 +27,10 @@ const apisToIntercept = [
 ];
 
 describe('Home page', () => {
-  before(() => {
-    esArchiverLoad('apm_8.0.0');
-  });
-  after(() => {
-    esArchiverUnload('apm_8.0.0');
-  });
   beforeEach(() => {
     cy.loginAsReadOnlyUser();
   });
+
   it('Redirects to service page with rangeFrom and rangeTo added to the URL', () => {
     cy.visit('/app/apm');
 

x-pack/plugins/apm/ftr_e2e/cypress/integration/read_only_user/service_overview/header_filters.spec.ts

@@ -6,7 +6,6 @@
  */
 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'];
 
@@ -59,15 +58,10 @@ const apisToIntercept = [
 ];
 
 describe('Service overview - header filters', () => {
-  before(() => {
-    esArchiverLoad('apm_8.0.0');
-  });
-  after(() => {
-    esArchiverUnload('apm_8.0.0');
-  });
   beforeEach(() => {
     cy.loginAsReadOnlyUser();
   });
+
   describe('Filtering by transaction type', () => {
     it('changes url when selecting different value', () => {
       cy.visit(serviceOverviewHref);

x-pack/plugins/apm/ftr_e2e/cypress/integration/read_only_user/service_overview/instances_table.spec.ts

@@ -7,7 +7,6 @@
 
 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'];
 
@@ -43,25 +42,21 @@ describe('Instances table', () => {
   beforeEach(() => {
     cy.loginAsReadOnlyUser();
   });
-  describe('when data is not loaded', () => {
-    it('shows empty message', () => {
-      cy.visit(serviceOverviewHref);
-      cy.contains('opbeans-java');
-      cy.get('[data-test-subj="serviceInstancesTableContainer"]').contains(
-        'No items found'
-      );
-    });
-  });
+
+  // describe('when data is not loaded', () => {
+  //   it('shows empty message', () => {
+  //     cy.visit(serviceOverviewHref);
+  //     cy.contains('opbeans-java');
+  //     cy.get('[data-test-subj="serviceInstancesTableContainer"]').contains(
+  //       'No items found'
+  //     );
+  //   });
+  // });
 
   describe('when data is loaded', () => {
-    before(() => {
-      esArchiverLoad('apm_8.0.0');
-    });
-    after(() => {
-      esArchiverUnload('apm_8.0.0');
-    });
     const serviceNodeName =
       '31651f3c624b81c55dd4633df0b5b9f9ab06b151121b0404ae796632cd1f87ad';
+
     it('has data in the table', () => {
       cy.visit(serviceOverviewHref);
       cy.contains('opbeans-java');

x-pack/plugins/apm/ftr_e2e/cypress/integration/read_only_user/service_overview/service_overview.spec.ts

@@ -7,7 +7,6 @@
 
 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'];
 
@@ -18,15 +17,10 @@ const baseUrl = url.format({
 });
 
 describe('Service Overview', () => {
-  before(() => {
-    esArchiverLoad('apm_8.0.0');
-  });
-  after(() => {
-    esArchiverUnload('apm_8.0.0');
-  });
   beforeEach(() => {
     cy.loginAsReadOnlyUser();
   });
+
   it('persists transaction type selected when clicking on Transactions tab', () => {
     cy.visit(baseUrl);
     cy.get('[data-test-subj="headerFilterTransactionType"]').should(

x-pack/plugins/apm/ftr_e2e/cypress/integration/read_only_user/service_overview/time_comparison.spec.ts

@@ -7,7 +7,6 @@
 import url from 'url';
 import moment from 'moment';
 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'];
 
@@ -47,12 +46,6 @@ const apisToIntercept = [
 ];
 
 describe('Service overview: Time Comparison', () => {
-  before(() => {
-    esArchiverLoad('apm_8.0.0');
-  });
-  after(() => {
-    esArchiverUnload('apm_8.0.0');
-  });
   beforeEach(() => {
     cy.loginAsReadOnlyUser();
   });

x-pack/plugins/apm/ftr_e2e/cypress/integration/read_only_user/transactions_overview/transactions_overview.spec.ts

@@ -7,7 +7,6 @@
 
 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,15 +16,10 @@ const serviceOverviewHref = url.format({
 });
 
 describe('Transactions Overview', () => {
-  before(() => {
-    esArchiverLoad('apm_8.0.0');
-  });
-  after(() => {
-    esArchiverUnload('apm_8.0.0');
-  });
   beforeEach(() => {
     cy.loginAsReadOnlyUser();
   });
+
   it('persists transaction type selected when navigating to Overview tab', () => {
     cy.visit(serviceOverviewHref);
     cy.get('[data-test-subj="headerFilterTransactionType"]').should(

x-pack/plugins/apm/ftr_e2e/cypress/support/index.ts

@@ -5,4 +5,12 @@
  * 2.0.
  */
 
+Cypress.on('uncaught:exception', (err, runnable) => {
+  // @see https://stackoverflow.com/a/50387233/434980
+  // ResizeObserver error can be safely ignored
+  if (err.message.includes('ResizeObserver loop limit exceeded')) {
+    return false;
+  }
+});
+
 import './commands';

x-pack/plugins/apm/ftr_e2e/cypress/tasks/es_archiver.ts

@@ -6,31 +6,32 @@
  */
 
 import Path from 'path';
+import { execSync } from 'child_process';
 
 const ES_ARCHIVE_DIR = './cypress/fixtures/es_archiver';
 
-// Otherwise cy.exec would inject NODE_TLS_REJECT_UNAUTHORIZED=0 and node would abort if used over https
+// Otherwise execSync would inject NODE_TLS_REJECT_UNAUTHORIZED=0 and node would abort if used over https
 const NODE_TLS_REJECT_UNAUTHORIZED = '1';
 
 export const esArchiverLoad = (folder: string) => {
   const path = Path.join(ES_ARCHIVE_DIR, folder);
-  cy.exec(
+  execSync(
     `node ../../../../scripts/es_archiver load "${path}" --config ../../../test/functional/config.js`,
-    { env: { NODE_TLS_REJECT_UNAUTHORIZED } }
+    { env: { ...process.env, NODE_TLS_REJECT_UNAUTHORIZED } }
   );
 };
 
 export const esArchiverUnload = (folder: string) => {
   const path = Path.join(ES_ARCHIVE_DIR, folder);
-  cy.exec(
+  execSync(
     `node ../../../../scripts/es_archiver unload "${path}" --config ../../../test/functional/config.js`,
-    { env: { NODE_TLS_REJECT_UNAUTHORIZED } }
+    { env: { ...process.env, NODE_TLS_REJECT_UNAUTHORIZED } }
   );
 };
 
 export const esArchiverResetKibana = () => {
-  cy.exec(
+  execSync(
     `node ../../../../scripts/es_archiver empty-kibana-index --config ../../../test/functional/config.js`,
-    { env: { NODE_TLS_REJECT_UNAUTHORIZED }, failOnNonZeroExit: false }
+    { env: { ...process.env, NODE_TLS_REJECT_UNAUTHORIZED } }
   );
 };

x-pack/plugins/apm/ftr_e2e/cypress_open.ts

@@ -9,9 +9,9 @@ import { FtrConfigProviderContext } from '@kbn/test';
 import { cypressOpenTests } from './cypress_start';
 
 async function openE2ETests({ readConfigFile }: FtrConfigProviderContext) {
-  const cypressConfig = await readConfigFile(require.resolve('./config.ts'));
+  const kibanaConfig = await readConfigFile(require.resolve('./config.ts'));
   return {
-    ...cypressConfig.getAll(),
+    ...kibanaConfig.getAll(),
     testRunner: cypressOpenTests,
   };
 }

x-pack/plugins/apm/ftr_e2e/cypress_run.ts

@@ -8,13 +8,13 @@ import { argv } from 'yargs';
 import { FtrConfigProviderContext } from '@kbn/test';
 import { cypressRunTests } from './cypress_start';
 
-const spec = argv.grep as string;
+const specArg = argv.spec as string | undefined;
 
 async function runE2ETests({ readConfigFile }: FtrConfigProviderContext) {
-  const cypressConfig = await readConfigFile(require.resolve('./config.ts'));
+  const kibanaConfig = await readConfigFile(require.resolve('./config.ts'));
   return {
-    ...cypressConfig.getAll(),
-    testRunner: cypressRunTests(spec),
+    ...kibanaConfig.getAll(),
+    testRunner: cypressRunTests(specArg),
   };
 }
 

x-pack/plugins/apm/ftr_e2e/cypress_start.ts

@@ -9,7 +9,8 @@ import Url from 'url';
 import cypress from 'cypress';
 import { FtrProviderContext } from './ftr_provider_context';
 import archives_metadata from './cypress/fixtures/es_archiver/archives_metadata';
-import { createKibanaUserRole } from '../scripts/kibana-security/create_kibana_user_role';
+import { createApmUsersAndRoles } from '../scripts/create-apm-users-and-roles/create_apm_users_and_roles';
+import { esArchiverLoad, esArchiverUnload } from './cypress/tasks/es_archiver';
 
 export function cypressRunTests(spec?: string) {
   return async ({ getService }: FtrProviderContext) => {
@@ -47,7 +48,7 @@ async function cypressStart(
   });
 
   // Creates APM users
-  await createKibanaUserRole({
+  await createApmUsersAndRoles({
     elasticsearch: {
       username: config.get('servers.elasticsearch.username'),
       password: config.get('servers.elasticsearch.password'),
@@ -58,13 +59,19 @@ async function cypressStart(
     },
   });
 
-  return cypressExecution({
-    ...(spec !== 'undefined' ? { spec } : {}),
+  await esArchiverLoad('apm_8.0.0');
+
+  const res = await cypressExecution({
+    ...(spec !== undefined ? { spec } : {}),
     config: { baseUrl: kibanaUrl },
     env: {
       START_DATE: start,
       END_DATE: end,
       KIBANA_URL: kibanaUrl,
     },
   });
+
+  await esArchiverUnload('apm_8.0.0');
+
+  return res;
 }

x-pack/plugins/apm/public/components/app/error_group_overview/List/index.tsx

@@ -195,7 +195,7 @@ function ErrorGroupList({ items, serviceName }: Props) {
   return (
     <ManagedTable
       noItemsMessage={i18n.translate('xpack.apm.errorsTable.noErrorsLabel', {
-        defaultMessage: 'No errors were found',
+        defaultMessage: 'No errors found',
       })}
       items={items}
       columns={columns}

x-pack/plugins/apm/public/components/app/service_overview/service_overview_errors_table/index.tsx

@@ -209,6 +209,17 @@ export function ServiceOverviewErrorsTable({ serviceName }: Props) {
             }
           >
             <EuiBasicTable
+              noItemsMessage={
+                status === FETCH_STATUS.LOADING
+                  ? i18n.translate(
+                      'xpack.apm.serviceOverview.errorsTable.loading',
+                      { defaultMessage: 'Loading...' }
+                    )
+                  : i18n.translate(
+                      'xpack.apm.serviceOverview.errorsTable.noResults',
+                      { defaultMessage: 'No errors found' }
+                    )
+              }
               columns={columns}
               items={items}
               pagination={{

x-pack/plugins/apm/public/components/app/service_overview/service_overview_instances_table/index.tsx

@@ -146,6 +146,15 @@ export function ServiceOverviewInstancesTable({
             isEmptyAndLoading={mainStatsItemCount === 0 && isLoading}
           >
             <EuiBasicTable
+              noItemsMessage={
+                isLoading
+                  ? i18n.translate('xpack.apm.serviceOverview.loadingText', {
+                      defaultMessage: 'No instances found',
+                    })
+                  : i18n.translate('xpack.apm.serviceOverview.noResultsText', {
+                      defaultMessage: 'No instances found',
+                    })
+              }
               data-test-subj="instancesTable"
               loading={isLoading}
               items={mainStatsItems}

x-pack/plugins/apm/public/components/shared/managed_table/index.tsx

@@ -5,6 +5,7 @@
  * 2.0.
  */
 
+import { i18n } from '@kbn/i18n';
 import { EuiBasicTable, EuiBasicTableColumn } from '@elastic/eui';
 import { orderBy } from 'lodash';
 import React, { ReactNode, useCallback, useMemo } from 'react';
@@ -129,7 +130,13 @@ function UnoptimizedManagedTable<T>(props: Props<T>) {
   return (
     <EuiBasicTable
       loading={isLoading}
-      noItemsMessage={noItemsMessage}
+      noItemsMessage={
+        isLoading
+          ? i18n.translate('xpack.apm.managedTable.loading', {
+              defaultMessage: 'Loading...',
+            })
+          : noItemsMessage
+      }
       items={renderedItems}
       columns={(columns as unknown) as Array<EuiBasicTableColumn<T>>} // EuiBasicTableColumn is stricter than ITableColumn
       sorting={sort}