fix fetchSoon delay in case of 0ms. Add async_dashboard test (#65083)

* forwardport #64999

* Add additional verifications on dashboard

I hope you don't mind me updating the test directly.
I *thought* the other dashboard tests required a consistent set of exact documents so that the count would always be the same.  Since the test uses sample data, I added a new timepicker:quickRanges so that the test can just select it.  Test FTR isn't set up to do relative time ranges right now.
But it looks like the dashboard checks aren't that specific to the data.  The dashboard seems to have `Last 24 hours` saved in it.  And when I don't change it to the whole sample data time range the test still passes.

* fix eslint error

* [page_objects/time_picker] allow any string in setCommonlyUsedTime

Co-authored-by: Lee Drengenberg <lee.drengenberg@elastic.co>
Co-authored-by: Dzmitry Lemechko <dzmitry.lemechko@elastic.co>

src/plugins/data/public/search/legacy/fetch_soon.test.ts

@@ -58,7 +58,7 @@ describe('fetchSoon', () => {
     (callClient as jest.Mock).mockClear();
   });
 
-  test('should delay by 0ms if config is set to not batch searches', () => {
+  test('should execute asap if config is set to not batch searches', () => {
     const config = getConfigStub({
       'courier:batchSearches': false,
     });
@@ -67,8 +67,6 @@ describe('fetchSoon', () => {
 
     fetchSoon(request, options, { config } as FetchHandlers);
 
-    expect(callClient).not.toBeCalled();
-    jest.advanceTimersByTime(0);
     expect(callClient).toBeCalled();
   });
 

src/plugins/data/public/search/legacy/fetch_soon.ts

@@ -67,6 +67,10 @@ async function delayedFetch(
   fetchHandlers: FetchHandlers,
   ms: number
 ) {
+  if (ms === 0) {
+    return callClient([request], [options], fetchHandlers)[0];
+  }
+
   const i = requestsToFetch.length;
   requestsToFetch = [...requestsToFetch, request];
   requestOptions = [...requestOptions, options];

test/functional/page_objects/time_picker.ts

@@ -65,7 +65,7 @@ export function TimePickerProvider({ getService, getPageObjects }: FtrProviderCo
      * Sets commonly used time
      * @param option 'Today' | 'This_week' | 'Last_15 minutes' | 'Last_24 hours' ...
      */
-    async setCommonlyUsedTime(option: CommonlyUsed) {
+    async setCommonlyUsedTime(option: CommonlyUsed | string) {
       await testSubjects.click('superDatePickerToggleQuickMenuButton');
       await testSubjects.click(`superDatePickerCommonlyUsed_${option}`);
     }

x-pack/test/functional/apps/dashboard/_async_dashboard.ts

@@ -0,0 +1,174 @@
+/*
+ * 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 expect from '@kbn/expect';
+import { FtrProviderContext } from '../../ftr_provider_context';
+
+export default function({ getService, getPageObjects }: FtrProviderContext) {
+  const retry = getService('retry');
+  const kibanaServer = getService('kibanaServer');
+  const log = getService('log');
+  const pieChart = getService('pieChart');
+  const find = getService('find');
+  const renderable = getService('renderable');
+  const dashboardExpect = getService('dashboardExpect');
+  const appMenu = getService('appsMenu');
+  const PageObjects = getPageObjects([
+    'common',
+    'header',
+    'home',
+    'discover',
+    'dashboard',
+    'timePicker',
+  ]);
+
+  describe('sample data dashboard', function describeIndexTests() {
+    before(async () => {
+      await PageObjects.common.sleep(5000);
+      await PageObjects.common.navigateToUrl('home', 'tutorial_directory/sampleData');
+      await PageObjects.header.waitUntilLoadingHasFinished();
+      await PageObjects.home.addSampleDataSet('flights');
+      const isInstalled = await PageObjects.home.isSampleDataSetInstalled('flights');
+      expect(isInstalled).to.be(true);
+      // add the range of the sample data so we can pick it in the quick pick list
+      const SAMPLE_DATA_RANGE = `[
+        {
+          "from": "now-30d",
+          "to": "now+40d",
+          "display": "sample data range"
+        },
+        {
+          "from": "now/d",
+          "to": "now/d",
+          "display": "Today"
+        },
+        {
+          "from": "now/w",
+          "to": "now/w",
+          "display": "This week"
+        },
+        {
+          "from": "now-15m",
+          "to": "now",
+          "display": "Last 15 minutes"
+        },
+        {
+          "from": "now-30m",
+          "to": "now",
+          "display": "Last 30 minutes"
+        },
+        {
+          "from": "now-1h",
+          "to": "now",
+          "display": "Last 1 hour"
+        },
+        {
+          "from": "now-24h",
+          "to": "now",
+          "display": "Last 24 hours"
+        },
+        {
+          "from": "now-7d",
+          "to": "now",
+          "display": "Last 7 days"
+        },
+        {
+          "from": "now-30d",
+          "to": "now",
+          "display": "Last 30 days"
+        },
+        {
+          "from": "now-90d",
+          "to": "now",
+          "display": "Last 90 days"
+        },
+        {
+          "from": "now-1y",
+          "to": "now",
+          "display": "Last 1 year"
+        }
+      ]`;
+
+      await kibanaServer.uiSettings.update({ 'timepicker:quickRanges': SAMPLE_DATA_RANGE });
+      await appMenu.clickLink('Discover');
+      await PageObjects.discover.selectIndexPattern('kibana_sample_data_flights');
+      await PageObjects.timePicker.setCommonlyUsedTime('sample_data range');
+      await retry.try(async function() {
+        const hitCount = parseInt(await PageObjects.discover.getHitCount(), 10);
+        expect(hitCount).to.be.greaterThan(0);
+      });
+    });
+
+    after(async () => {
+      await PageObjects.common.navigateToUrl('home', 'tutorial_directory/sampleData');
+      await PageObjects.home.removeSampleDataSet('flights');
+      const isInstalled = await PageObjects.home.isSampleDataSetInstalled('flights');
+      expect(isInstalled).to.be(false);
+    });
+
+    it('should launch sample flights data set dashboard', async () => {
+      await appMenu.clickLink('Dashboard');
+      await PageObjects.dashboard.loadSavedDashboard('[Flights] Global Flight Dashboard');
+      await PageObjects.header.waitUntilLoadingHasFinished();
+      await PageObjects.timePicker.setCommonlyUsedTime('sample_data range');
+      await PageObjects.header.waitUntilLoadingHasFinished();
+
+      // check at least one visualization
+      await renderable.waitForRender();
+      log.debug('Checking pie charts rendered');
+      await pieChart.expectPieSliceCount(4);
+
+      await appMenu.clickLink('Discover');
+      await retry.try(async function() {
+        const hitCount = parseInt(await PageObjects.discover.getHitCount(), 10);
+        expect(hitCount).to.be.greaterThan(0);
+      });
+      await appMenu.clickLink('Dashboard');
+      await PageObjects.header.waitUntilLoadingHasFinished();
+      await renderable.waitForRender();
+      log.debug('Checking pie charts rendered');
+      await pieChart.expectPieSliceCount(4);
+    });
+
+    it('toggle from Discover to Dashboard attempt 1', async () => {
+      await appMenu.clickLink('Discover');
+      await retry.try(async function() {
+        const hitCount = parseInt(await PageObjects.discover.getHitCount(), 10);
+        expect(hitCount).to.be.greaterThan(0);
+      });
+      await appMenu.clickLink('Dashboard');
+      await PageObjects.header.waitUntilLoadingHasFinished();
+      await renderable.waitForRender();
+      log.debug('Checking pie charts rendered');
+      await pieChart.expectPieSliceCount(4);
+    });
+
+    it('toggle from Discover to Dashboard attempt 2', async () => {
+      await appMenu.clickLink('Discover');
+      await retry.try(async function() {
+        const hitCount = parseInt(await PageObjects.discover.getHitCount(), 10);
+        expect(hitCount).to.be.greaterThan(0);
+      });
+      await appMenu.clickLink('Dashboard');
+      await PageObjects.header.waitUntilLoadingHasFinished();
+      await renderable.waitForRender();
+      log.debug('Checking pie charts rendered');
+      await pieChart.expectPieSliceCount(4);
+
+      log.debug('Checking area, bar and heatmap charts rendered');
+      await dashboardExpect.seriesElementCount(15);
+      log.debug('Checking saved searches rendered');
+      await dashboardExpect.savedSearchRowCount(50);
+      log.debug('Checking input controls rendered');
+      await dashboardExpect.inputControlItemCount(3);
+      log.debug('Checking tag cloud rendered');
+      await dashboardExpect.tagCloudWithValuesFound(['Sunny', 'Rain', 'Clear', 'Cloudy', 'Hail']);
+      log.debug('Checking vega chart rendered');
+      const tsvb = await find.existsByCssSelector('.vgaVis__view');
+      expect(tsvb).to.be(true);
+    });
+  });
+}

x-pack/test/functional/apps/dashboard/index.ts

@@ -13,5 +13,6 @@ export default function({ loadTestFile }: FtrProviderContext) {
     loadTestFile(require.resolve('./preserve_url'));
     loadTestFile(require.resolve('./reporting'));
     loadTestFile(require.resolve('./drilldowns'));
+    loadTestFile(require.resolve('./_async_dashboard'));
   });
 }