diff --git a/src/ui/public/filter_editor/filter_editor.html b/src/ui/public/filter_editor/filter_editor.html
index 224d3396698e..0b69a1d5661d 100644
--- a/src/ui/public/filter_editor/filter_editor.html
+++ b/src/ui/public/filter_editor/filter_editor.html
@@ -55,6 +55,7 @@
 
         <div class="kuiFieldGroupSection">
           <filter-operator-select
+            data-test-subj="filterOperatorList"
             ng-if="filterEditor.field"
             field="filterEditor.field"
             operator="filterEditor.operator"
@@ -64,6 +65,7 @@
 
         <div class="kuiFieldGroupSection kuiFieldGroupSection--wide filterEditor__wideField filterEditorParamsInput">
           <filter-params-editor
+            data-test-subj="filterParams"
             ng-if="filterEditor.field && filterEditor.operator"
             field="filterEditor.field"
             operator="filterEditor.operator"
diff --git a/test/functional/apps/dashboard/_dashboard_filtering.js b/test/functional/apps/dashboard/_dashboard_filtering.js
index 38dcf1b04bb4..5f717cf32b02 100644
--- a/test/functional/apps/dashboard/_dashboard_filtering.js
+++ b/test/functional/apps/dashboard/_dashboard_filtering.js
@@ -26,7 +26,7 @@ export default function ({ getService, getPageObjects }) {
         await dashboardAddPanel.closeAddPanel();
         await PageObjects.header.waitUntilLoadingHasFinished();
         await PageObjects.dashboard.waitForRenderComplete();
-        await filterBar.addFilter('bytes', 'is', '12345678', 'kuiTextInput');
+        await filterBar.addFilter('bytes', 'is', '12345678');
         await PageObjects.header.waitUntilLoadingHasFinished();
         await PageObjects.dashboard.waitForRenderComplete();
       });
diff --git a/test/functional/apps/visualize/_data_table.js b/test/functional/apps/visualize/_data_table.js
index 60e2738b45ec..e5aacc102fb8 100644
--- a/test/functional/apps/visualize/_data_table.js
+++ b/test/functional/apps/visualize/_data_table.js
@@ -3,6 +3,7 @@ import expect from 'expect.js';
 export default function ({ getService, getPageObjects }) {
   const log = getService('log');
   const retry = getService('retry');
+  const filterBar = getService('filterBar');
   const PageObjects = getPageObjects(['common', 'visualize', 'header']);
 
   describe('visualize app', function describeIndexTests() {
@@ -91,6 +92,34 @@ export default function ({ getService, getPageObjects }) {
         });
       });
 
+      it('should show correct data for a data table with date histogram', async () => {
+        await PageObjects.common.navigateToUrl('visualize', 'new');
+        await PageObjects.visualize.clickDataTable();
+        await PageObjects.visualize.clickNewSearch();
+        await PageObjects.header.setAbsoluteRange(fromTime, toTime);
+        await PageObjects.visualize.clickBucket('Split Rows');
+        await PageObjects.visualize.selectAggregation('Date Histogram');
+        await PageObjects.visualize.selectField('@timestamp');
+        await PageObjects.visualize.setInterval('Daily');
+        await PageObjects.visualize.clickGo();
+        await PageObjects.header.waitUntilLoadingHasFinished();
+        const data = await PageObjects.visualize.getDataTableData();
+        expect(data.trim().split('\n')).to.be.eql([
+          '2015-09-20', '4,757',
+          '2015-09-21', '4,614',
+          '2015-09-22', '4,633',
+        ]);
+      });
+
+      it('should correctly filter for applied time filter on the main timefield', async () => {
+        await filterBar.addFilter('@timestamp', 'is between', ['2015-09-19', '2015-09-21']);
+        await PageObjects.header.waitUntilLoadingHasFinished();
+        const data = await PageObjects.visualize.getDataTableData();
+        expect(data.trim().split('\n')).to.be.eql([
+          '2015-09-20', '4,757',
+        ]);
+      });
+
     });
   });
 }
diff --git a/test/functional/services/filter_bar.js b/test/functional/services/filter_bar.js
index fed775b7d6d6..b00e6cd5ca7e 100644
--- a/test/functional/services/filter_bar.js
+++ b/test/functional/services/filter_bar.js
@@ -3,6 +3,14 @@ export function FilterBarProvider({ getService }) {
   const testSubjects = getService('testSubjects');
   const find = getService('find');
 
+  async function typeIntoReactSelect(testSubj, value) {
+    const select = await testSubjects.find(testSubj);
+    const input = await select.findByClassName('ui-select-search');
+    await input.type(value);
+    const activeSelection = await select.findByClassName('active');
+    await activeSelection.click();
+  }
+
   class FilterBar {
     hasFilter(key, value, enabled = true) {
       const filterActivationState = enabled ? 'enabled' : 'disabled';
@@ -23,17 +31,25 @@ export function FilterBarProvider({ getService }) {
       await testSubjects.click(`filter & filter-key-${key} disableFilter-${key}`);
     }
 
-    async addFilter(field, operator, value, inputCssClass = 'ui-select-search') {
+    async addFilter(field, operator, values) {
+      if (!Array.isArray(values)) {
+        values = [values];
+      }
       await testSubjects.click('addFilter');
-      let input = await find.byCssSelector(`filter-field-select input.ui-select-search`);
-      await input.type(field);
-      await remote.pressKeys('\uE006');
-      input = await find.byCssSelector(`filter-operator-select input.ui-select-search`);
-      await input.type(operator);
-      await remote.pressKeys('\uE006');
-      input = await find.byCssSelector(`filter-params-editor input.${inputCssClass}`);
-      await input.type(value);
-      await remote.pressKeys('\uE006');
+      await typeIntoReactSelect('filterfieldSuggestionList', field);
+      await typeIntoReactSelect('filterOperatorList', operator);
+      const params = await testSubjects.find('filterParams');
+      const paramFields = await params.findAllByTagName('input');
+      await Promise.all(values.map(async (value, index) => {
+        await paramFields[index].type(value);
+        // Checks if the actual options value has an auto complete (like 'is one of' filter)
+        // In this case we need to click the active autocompletion.
+        const hasAutocompletion = await find.exists(async () => await params.findByClassName('active'));
+        if (hasAutocompletion) {
+          const activeSelection = await params.findByClassName('active');
+          await activeSelection.click();
+        }
+      }));
       await testSubjects.click('saveFilter');
     }