add test and fix warning text

src/legacy/core_plugins/vis_type_timeseries/public/components/index_pattern.js

@@ -206,6 +206,7 @@ export const IndexPattern = ({ fields, prefix, onChange, disabled, model: _model
             })}
           >
             <EuiFieldText
+              data-test-subj="metricsIndexPatternInterval"
               isInvalid={!intervalValidation.isValid}
               disabled={disabled || isEntireTimeRangeActive(model, isTimeSeries)}
               onChange={handleTextChange(intervalName, AUTO_INTERVAL)}
@@ -222,6 +223,7 @@ export const IndexPattern = ({ fields, prefix, onChange, disabled, model: _model
             })}
           >
             <YesNo
+              data-test-subj="metricsDropLastBucket"
               value={model[dropBucketName]}
               name={dropBucketName}
               onChange={onChange}

src/legacy/core_plugins/vis_type_timeseries/public/components/yes_no.js

@@ -24,7 +24,7 @@ import { EuiRadio, htmlIdGenerator } from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n/react';
 
 export function YesNo(props) {
-  const { name, value, disabled } = props;
+  const { name, value, disabled, 'data-test-subj': dataTestSubj } = props;
   const handleChange = value => {
     const { name } = props;
     return () => {
@@ -38,6 +38,7 @@ export function YesNo(props) {
     <div>
       <EuiRadio
         id={htmlId('yes')}
+        data-test-subj={`${dataTestSubj}-yes`}
         label={
           <FormattedMessage
             id="visTypeTimeseries.yesButtonLabel"
@@ -55,6 +56,7 @@ export function YesNo(props) {
       &emsp;
       <EuiRadio
         id={htmlId('no')}
+        data-test-subj={`${dataTestSubj}-no`}
         label={
           <FormattedMessage
             id="visTypeTimeseries.noButtonLabel"

test/functional/page_objects/visual_builder_page.ts

@@ -414,6 +414,19 @@ export function VisualBuilderPageProvider({ getService, getPageObjects }: FtrPro
       await PageObjects.header.waitUntilLoadingHasFinished();
     }
 
+    public async setIntervalValue(value: string) {
+      const el = await testSubjects.find('metricsIndexPatternInterval');
+      await el.clearValue();
+      await el.type(value);
+      await PageObjects.header.waitUntilLoadingHasFinished();
+    }
+
+    public async setDropLastBucket(value: boolean) {
+      const option = await testSubjects.find(`metricsDropLastBucket-${value ? 'yes' : 'no'}`);
+      (await option.findByCssSelector('label')).click();
+      await PageObjects.header.waitUntilLoadingHasFinished();
+    }
+
     public async selectIndexPatternTimeField(timeField: string) {
       await retry.try(async () => {
         await comboBox.clearInputField('metricsIndexPatternFieldsSelect');

x-pack/legacy/plugins/rollup/public/index_pattern_creation/components/rollup_prompt/rollup_prompt.js

@@ -13,7 +13,7 @@ export const RollupPrompt = () => (
     <p>
       Kibana&apos;s support for rollup index patterns is in beta. You might encounter issues using
       these patterns in saved searches, visualizations, and dashboards. They are not supported in
-      advanced features, such as TSVB, Timelion, and Machine Learning.
+      some advanced features, such as Timelion, and Machine Learning.
     </p>
     <p>
       You can match a rollup index pattern against one rollup index and zero or more regular

x-pack/test/functional/apps/rollup_job/index.js

@@ -10,5 +10,6 @@ export default function({ loadTestFile }) {
 
     loadTestFile(require.resolve('./rollup_jobs'));
     loadTestFile(require.resolve('./hybrid_index_pattern'));
+    loadTestFile(require.resolve('./tsvb'));
   });
 }

x-pack/test/functional/apps/rollup_job/tsvb.js

@@ -0,0 +1,102 @@
+/*
+ * 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 datemath from '@elastic/datemath';
+import expect from '@kbn/expect';
+import mockRolledUpData from './hybrid_index_helper';
+
+export default function({ getService, getPageObjects }) {
+  const es = getService('legacyEs');
+  const esArchiver = getService('esArchiver');
+  const retry = getService('retry');
+  const PageObjects = getPageObjects([
+    'common',
+    'settings',
+    'visualize',
+    'visualBuilder',
+    'timePicker',
+  ]);
+
+  describe('tsvb integration', function() {
+    //Since rollups can only be created once with the same name (even if you delete it),
+    //we add the Date.now() to avoid name collision if you run the tests locally back to back.
+    const rollupJobName = `tsvb-test-rollup-job-${Date.now()}`;
+    const rollupSourceIndexName = 'rollup-source-data';
+    const rollupTargetIndexName = `rollup-target-data`;
+    const now = new Date();
+    const pastDates = [
+      datemath.parse('now-1m', { forceNow: now }),
+      datemath.parse('now-2m', { forceNow: now }),
+      datemath.parse('now-3m', { forceNow: now }),
+    ];
+
+    before(async () => {
+      // load visualize to have an index pattern ready, otherwise visualize will redirect
+      await esArchiver.load('visualize/default');
+    });
+
+    it('create rollup tsvb', async () => {
+      //Create data for rollup job so it doesn't fail
+      await es.index({
+        index: rollupSourceIndexName,
+        body: {
+          '@timestamp': new Date().toISOString(),
+        },
+      });
+
+      await retry.try(async () => {
+        //Create a rollup for kibana to recognize
+        await es.transport.request({
+          path: `/_rollup/job/${rollupJobName}`,
+          method: 'PUT',
+          body: {
+            index_pattern: rollupSourceIndexName,
+            rollup_index: rollupTargetIndexName,
+            cron: '*/10 * * * * ?',
+            groups: {
+              date_histogram: {
+                fixed_interval: '1000ms',
+                field: '@timestamp',
+                time_zone: 'UTC',
+              },
+            },
+            timeout: '20s',
+            page_size: 1000,
+          },
+        });
+      });
+
+      await pastDates.map(async day => {
+        await es.index(mockRolledUpData(rollupJobName, rollupTargetIndexName, day));
+      });
+
+      await PageObjects.visualize.navigateToNewVisualization();
+      await PageObjects.visualize.clickVisualBuilder();
+      await PageObjects.visualBuilder.checkVisualBuilderIsPresent();
+      await PageObjects.timePicker.openQuickSelectTimeMenu();
+      await PageObjects.visualBuilder.clickMetric();
+      await PageObjects.visualBuilder.checkMetricTabIsPresent();
+      await PageObjects.visualBuilder.clickPanelOptions('metric');
+      await PageObjects.visualBuilder.setIndexPatternValue(rollupTargetIndexName);
+      await PageObjects.visualBuilder.setIntervalValue('1d');
+      await PageObjects.visualBuilder.setDropLastBucket(false);
+      const newValue = await PageObjects.visualBuilder.getMetricValue();
+      expect(newValue).to.eql('3');
+    });
+
+    after(async () => {
+      // Delete the rollup job.
+      await es.transport.request({
+        path: `/_rollup/job/${rollupJobName}`,
+        method: 'DELETE',
+      });
+
+      await es.indices.delete({ index: rollupTargetIndexName });
+      await es.indices.delete({ index: rollupSourceIndexName });
+      await esArchiver.load('empty_kibana');
+    });
+  });
+}