Add dashboard tests (#14775) (#14826)

* add a test that will fail due to the current TSVB bug

* add a test to catch the latest bug with saved searches

* reorder array so tests pass

* Update tests since the first panel is TSVB and won't have a spy pane toggle

test/functional/apps/dashboard/_dashboard.js

@@ -7,8 +7,11 @@ import {
 export default function ({ getService, getPageObjects }) {
   const retry = getService('retry');
   const log = getService('log');
+  const dashboardVisualizations = getService('dashboardVisualizations');
   const remote = getService('remote');
-  const PageObjects = getPageObjects(['common', 'dashboard', 'header', 'visualize']);
+  const PageObjects = getPageObjects(['common', 'dashboard', 'header', 'visualize', 'discover']);
+  const testVisualizationTitles = [];
+  const testVisualizationDescriptions = [];
 
   describe('dashboard tab', function describeIndexTests() {
     before(async function () {
@@ -32,15 +35,31 @@ export default function ({ getService, getPageObjects }) {
       await PageObjects.header.clickDashboard();
 
       await PageObjects.dashboard.clickNewDashboard();
+      await dashboardVisualizations.createAndAddTSVBVisualization('TSVB');
       await PageObjects.dashboard.addVisualizations(PageObjects.dashboard.getTestVisualizationNames());
+      await dashboardVisualizations.createAndAddSavedSearch('saved search');
+      testVisualizationTitles.push('TSVB');
+      testVisualizationTitles.splice(1, 0, ...PageObjects.dashboard.getTestVisualizationNames());
+      testVisualizationTitles.push('saved search');
 
-      log.debug('done adding visualizations');
+      testVisualizationDescriptions.push('');
+      testVisualizationDescriptions.splice(
+        1, 0, ...PageObjects.dashboard.getTestVisualizations().map(visualization => visualization.description)
+      );
+      testVisualizationDescriptions.push('');
     });
 
     it('set the timepicker time to that which contains our test data', async function setTimepicker() {
       await PageObjects.dashboard.setTimepickerInDataRange();
     });
 
+    it('saved search loaded with columns', async () => {
+      const headers = await PageObjects.discover.getColumnHeaders();
+      expect(headers.length).to.be(3);
+      expect(headers[1]).to.be('bytes');
+      expect(headers[2]).to.be('agent');
+    });
+
     it('should save and load dashboard', async function saveAndLoadDashboard() {
       const dashboardName = 'Dashboard Test 1';
       await PageObjects.dashboard.saveDashboard(dashboardName);
@@ -57,8 +76,7 @@ export default function ({ getService, getPageObjects }) {
       return retry.tryForTime(10000, function () {
         return PageObjects.dashboard.getPanelTitles()
         .then(function (panelTitles) {
-          log.info('visualization titles = ' + panelTitles);
-          expect(panelTitles).to.eql(PageObjects.dashboard.getTestVisualizationNames());
+          expect(panelTitles).to.eql(testVisualizationTitles);
         });
       })
       .then(function () {
@@ -88,28 +106,28 @@ export default function ({ getService, getPageObjects }) {
     });
 
     it('should have data-shared-items-count set to the number of visualizations', function checkSavedItemsCount() {
-      const visualizations = PageObjects.dashboard.getTestVisualizations();
       return retry.tryForTime(10000, () => PageObjects.dashboard.getSharedItemsCount())
       .then(function (count) {
         log.info('data-shared-items-count = ' + count);
-        expect(count).to.eql(visualizations.length);
+        expect(count).to.eql(testVisualizationTitles.length);
       });
     });
 
     it('should have panels with expected data-shared-item title and description', function () {
-      const visualizations = PageObjects.dashboard.getTestVisualizations();
       return retry.tryForTime(10000, function () {
         return PageObjects.dashboard.getPanelSharedItemData()
         .then(function (data) {
-          expect(data.map(item => item.title)).to.eql(visualizations.map(v => v.name));
-          expect(data.map(item => item.description)).to.eql(visualizations.map(v => v.description));
+          expect(data.map(item => item.title)).to.eql(testVisualizationTitles);
+          expect(data.map(item => item.description)).to.eql(testVisualizationDescriptions);
         });
       });
     });
 
     describe('expanding a panel', () => {
       it('hides other panels', async () => {
-        await PageObjects.dashboard.toggleExpandPanel();
+        // Don't expand TSVB since it doesn't have the spy panel.
+        const panels = await PageObjects.dashboard.getDashboardPanels();
+        await PageObjects.dashboard.toggleExpandPanel(panels[1]);
         await retry.try(async () => {
           const panels = await PageObjects.dashboard.getDashboardPanels();
           expect(panels.length).to.eql(1);
@@ -142,7 +160,7 @@ export default function ({ getService, getPageObjects }) {
         await PageObjects.dashboard.loadSavedDashboard('spy pane test');
         const panels = await PageObjects.dashboard.getDashboardPanels();
         // Simulate hover
-        await remote.moveMouseTo(panels[0]);
+        await remote.moveMouseTo(panels[1]);
         const spyToggleExists = await PageObjects.visualize.getSpyToggleExists();
         expect(spyToggleExists).to.be(true);
       });
@@ -156,8 +174,7 @@ export default function ({ getService, getPageObjects }) {
         // being a CSS update is causing the UI to change slower than grabbing the panels?
         retry.try(async () => {
           const panels = await PageObjects.dashboard.getDashboardPanels();
-          const visualizations = PageObjects.dashboard.getTestVisualizations();
-          expect(panels.length).to.eql(visualizations.length);
+          expect(panels.length).to.eql(testVisualizationTitles.length);
         });
       });
     });
@@ -251,10 +268,9 @@ export default function ({ getService, getPageObjects }) {
         await PageObjects.visualize.saveVisualization('visualization from add new link');
         await PageObjects.header.clickToastOK();
 
-        const visualizations = PageObjects.dashboard.getTestVisualizations();
         return retry.try(async () => {
           const panelCount = await PageObjects.dashboard.getPanelCount();
-          expect(panelCount).to.eql(visualizations.length + 1);
+          expect(panelCount).to.eql(testVisualizationTitles.length + 1);
         });
       });
 

test/functional/config.js

@@ -21,6 +21,7 @@ import {
   TestSubjectsProvider,
   DocTableProvider,
   ScreenshotsProvider,
+  DashboardVisualizationProvider,
 } from './services';
 
 export default async function ({ readConfigFile }) {
@@ -64,6 +65,7 @@ export default async function ({ readConfigFile }) {
       testSubjects: TestSubjectsProvider,
       docTable: DocTableProvider,
       screenshots: ScreenshotsProvider,
+      dashboardVisualizations: DashboardVisualizationProvider,
     },
     servers: commonConfig.get('servers'),
     apps: {

test/functional/page_objects/dashboard_page.js

@@ -512,12 +512,15 @@ export function DashboardPageProvider({ getService, getPageObjects }) {
       });
     }
 
-    async toggleExpandPanel() {
+    async toggleExpandPanel(panel) {
       log.debug('toggleExpandPanel');
-      await testSubjects.moveMouseTo('dashboardPanelTitle');
+      await (panel ? remote.moveMouseTo(panel) : testSubjects.moveMouseTo('dashboardPanelTitle'));
       const expandShown = await testSubjects.exists('dashboardPanelExpandIcon');
       if (!expandShown) {
-        await testSubjects.click('dashboardPanelToggleMenuIcon');
+        const toggleMenuItem = panel ?
+          await testSubjects.findDescendant('dashboardPanelToggleMenuIcon', panel) :
+          testSubjects.find('dashboardPanelToggleMenuIcon');
+        await toggleMenuItem.click();
       }
       await testSubjects.click('dashboardPanelExpandIcon');
     }

test/functional/services/dashboard/index.js

@@ -0,0 +1 @@
+export { DashboardVisualizationProvider } from './visualizations';

test/functional/services/dashboard/visualizations.js

@@ -0,0 +1,39 @@
+
+export function DashboardVisualizationProvider({ getService, getPageObjects }) {
+  const log = getService('log');
+  const PageObjects = getPageObjects(['dashboard', 'visualize', 'header', 'discover']);
+
+  return new class DashboardVisualizations {
+    async createAndAddTSVBVisualization(name) {
+      log.debug(`createAndAddTSVBVisualization(${name})`);
+      const inViewMode = await PageObjects.dashboard.getIsInViewMode();
+      if (inViewMode) {
+        await PageObjects.dashboard.clickEdit();
+      }
+      await PageObjects.dashboard.clickAddVisualization();
+      await PageObjects.dashboard.clickAddNewVisualizationLink();
+      await PageObjects.visualize.clickVisualBuilder();
+      await PageObjects.visualize.saveVisualization(name);
+      await PageObjects.header.clickToastOK();
+    }
+
+    async createAndAddSavedSearch(name) {
+      log.debug(`createAndAddSavedSearch(${name})`);
+      await PageObjects.header.clickDiscover();
+      await PageObjects.dashboard.setTimepickerInDataRange();
+      await PageObjects.discover.clickFieldListItemAdd('bytes');
+      await PageObjects.discover.clickFieldListItemAdd('agent');
+      await PageObjects.discover.saveSearch(name);
+      await PageObjects.header.waitUntilLoadingHasFinished();
+      await PageObjects.header.clickToastOK();
+
+      await PageObjects.header.clickDashboard();
+
+      const inViewMode = await PageObjects.dashboard.getIsInViewMode();
+      if (inViewMode) {
+        await PageObjects.dashboard.clickEdit();
+      }
+      await PageObjects.dashboard.addSavedSearch(name);
+    }
+  };
+}

test/functional/services/index.js

@@ -5,3 +5,4 @@ export { TestSubjectsProvider } from './test_subjects';
 export { RemoteProvider } from './remote';
 export { DocTableProvider } from './doc_table';
 export { ScreenshotsProvider } from './screenshots';
+export { DashboardVisualizationProvider } from './dashboard';