diff --git a/test/functional/apps/visualize/_tsvb_time_series.ts b/test/functional/apps/visualize/_tsvb_time_series.ts
index 6f4d1de31236..7b675012ee96 100644
--- a/test/functional/apps/visualize/_tsvb_time_series.ts
+++ b/test/functional/apps/visualize/_tsvb_time_series.ts
@@ -23,6 +23,7 @@ import { FtrProviderContext } from '../../ftr_provider_context';
 export default function({ getPageObjects, getService }: FtrProviderContext) {
   const { visualize, visualBuilder } = getPageObjects(['visualBuilder', 'visualize']);
   const retry = getService('retry');
+  const log = getService('log');
 
   describe('visual builder', function describeIndexTests() {
     beforeEach(async () => {
@@ -105,13 +106,22 @@ export default function({ getPageObjects, getService }: FtrProviderContext) {
         expect(actualCount).to.be(expectedLegendValue);
       });
 
-      it('should show the correct count in the legend with duration formatter', async () => {
-        const expectedLegendValue = '156.00';
-
+      it('should show the correct count in the legend with "Human readable" duration formatter', async () => {
         await visualBuilder.clickSeriesOption();
         await visualBuilder.changeDataFormatter('Duration');
-        const actualCount = await visualBuilder.getRhythmChartLegendValue();
-        expect(actualCount).to.be(expectedLegendValue);
+        await visualBuilder.setDurationFormatterSettings({ to: 'Human readable' });
+        const actualCountDefault = await visualBuilder.getRhythmChartLegendValue();
+        expect(actualCountDefault).to.be('a few seconds');
+
+        log.debug(`to: 'Human readable', from: 'Seconds'`);
+        await visualBuilder.setDurationFormatterSettings({ to: 'Human readable', from: 'Seconds' });
+        const actualCountSec = await visualBuilder.getRhythmChartLegendValue();
+        expect(actualCountSec).to.be('3 minutes');
+
+        log.debug(`to: 'Human readable', from: 'Minutes'`);
+        await visualBuilder.setDurationFormatterSettings({ to: 'Human readable', from: 'Minutes' });
+        const actualCountMin = await visualBuilder.getRhythmChartLegendValue();
+        expect(actualCountMin).to.be('3 hours');
       });
     });
   });
diff --git a/test/functional/page_objects/visual_builder_page.ts b/test/functional/page_objects/visual_builder_page.ts
index 0acdb83e40b2..bba019d2732f 100644
--- a/test/functional/page_objects/visual_builder_page.ts
+++ b/test/functional/page_objects/visual_builder_page.ts
@@ -28,6 +28,19 @@ export function VisualBuilderPageProvider({ getService, getPageObjects }: FtrPro
   const comboBox = getService('comboBox');
   const PageObjects = getPageObjects(['common', 'header', 'visualize', 'timePicker']);
 
+  type Duration =
+    | 'Milliseconds'
+    | 'Seconds'
+    | 'Minutes'
+    | 'Hours'
+    | 'Days'
+    | 'Weeks'
+    | 'Months'
+    | 'Years';
+
+  type FromDuration = Duration | 'Picoseconds' | 'Nanoseconds' | 'Microseconds';
+  type ToDuration = Duration | 'Human readable';
+
   class VisualBuilderPage {
     public async resetPage(
       fromTime = '2015-09-19 06:31:44.000',
@@ -225,10 +238,40 @@ export function VisualBuilderPageProvider({ getService, getPageObjects }: FtrPro
     public async changeDataFormatter(
       formatter: 'Bytes' | 'Number' | 'Percent' | 'Duration' | 'Custom'
     ) {
-      const [formatterEl] = await find.allByCssSelector('.euiComboBox');
+      const formatterEl = await find.byCssSelector('[id$="row"] .euiComboBox');
       await comboBox.setElement(formatterEl, formatter);
     }
 
+    /**
+     * set duration formatter additional settings
+     *
+     * @param from start format
+     * @param to end format
+     * @param decimalPlaces decimals count
+     */
+    public async setDurationFormatterSettings({
+      from,
+      to,
+      decimalPlaces,
+    }: {
+      from?: FromDuration;
+      to?: ToDuration;
+      decimalPlaces?: string;
+    }) {
+      if (from) {
+        const fromCombobox = await find.byCssSelector('[id$="from-row"] .euiComboBox');
+        await comboBox.setElement(fromCombobox, from);
+      }
+      if (to) {
+        const toCombobox = await find.byCssSelector('[id$="to-row"] .euiComboBox');
+        await comboBox.setElement(toCombobox, to);
+      }
+      if (decimalPlaces) {
+        const decimalPlacesInput = await find.byCssSelector('[id$="decimal"]');
+        await decimalPlacesInput.type(decimalPlaces);
+      }
+    }
+
     /**
      * write template for aggregation row in the `option` tab
      *