properly render disabled range control

src/core_plugins/input_control_vis/public/components/vis/__snapshots__/list_control.test.js.snap

@@ -1,5 +1,22 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`disableMsg 1`] = `
+<FormRow
+  controlIndex={0}
+  disableMsg="control is disabled to test rendering when disabled"
+  id="mock-list-control"
+  label="list control"
+>
+  <EuiFieldText
+    compressed={false}
+    disabled={true}
+    fullWidth={false}
+    isLoading={false}
+    placeholder="Select..."
+  />
+</FormRow>
+`;
+
 exports[`renders ListControl 1`] = `
 <FormRow
   controlIndex={0}

src/core_plugins/input_control_vis/public/components/vis/__snapshots__/range_control.test.js.snap

@@ -1,5 +1,27 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`disabled 1`] = `
+<FormRow
+  controlIndex={0}
+  disableMsg="control is disabled to test rendering when disabled"
+  id="mock-range-control"
+  label="range control"
+>
+  <EuiRange
+    compressed={false}
+    disabled={true}
+    fullWidth={false}
+    levels={Array []}
+    max={100}
+    min={1}
+    showInput={false}
+    showLabels={false}
+    showTicks={false}
+    showValue={false}
+  />
+</FormRow>
+`;
+
 exports[`renders RangeControl 1`] = `
 <FormRow
   controlIndex={0}
@@ -31,7 +53,6 @@ exports[`renders RangeControl 1`] = `
         <input
           className="euiFieldNumber"
           data-test-subj="rangeControlMinInputValue"
-          disabled={false}
           id="mock-range-control_min"
           max={100}
           min={0}
@@ -86,7 +107,6 @@ exports[`renders RangeControl 1`] = `
         <input
           className="euiFieldNumber"
           data-test-subj="rangeControlMaxInputValue"
-          disabled={false}
           id="mock-range-control_max"
           max={100}
           min={0}

src/core_plugins/input_control_vis/public/components/vis/list_control.test.js

@@ -48,3 +48,15 @@ test('renders ListControl', () => {
   />);
   expect(component).toMatchSnapshot(); // eslint-disable-line
 });
+
+test('disableMsg', () => {
+  const component = shallow(<ListControl
+    id="mock-list-control"
+    label="list control"
+    multiselect={true}
+    controlIndex={0}
+    stageFilter={stageFilter}
+    disableMsg={'control is disabled to test rendering when disabled'}
+  />);
+  expect(component).toMatchSnapshot(); // eslint-disable-line
+});

src/core_plugins/input_control_vis/public/components/vis/range_control.js

@@ -27,6 +27,7 @@ import {
   EuiFormRow,
   EuiFlexGroup,
   EuiFlexItem,
+  EuiRange,
 } from '@elastic/eui';
 
 const toState = ({ control }) => {
@@ -122,6 +123,14 @@ export class RangeControl extends Component {
   };
 
   renderControl() {
+    if (!this.props.control.isEnabled()) {
+      return (
+        <EuiRange
+          disabled
+        />
+      );
+    }
+
     return (
       <EuiFormRow
         isInvalid={!this.state.isRangeValid}
@@ -132,7 +141,6 @@ export class RangeControl extends Component {
           <EuiFlexItem grow={false}>
             <input
               id={`${this.props.control.id}_min`}
-              disabled={!this.props.control.isEnabled()}
               name="min"
               type="number"
               data-test-subj="rangeControlMinInputValue"
@@ -145,7 +153,6 @@ export class RangeControl extends Component {
           </EuiFlexItem>
           <EuiFlexItem className="inputRangeContainer">
             <InputRange
-              disabled={!this.props.control.isEnabled()}
               maxValue={this.props.control.max}
               minValue={this.props.control.min}
               step={this.props.control.options.step}
@@ -160,7 +167,6 @@ export class RangeControl extends Component {
           <EuiFlexItem grow={false}>
             <input
               id={`${this.props.control.id}_max`}
-              disabled={!this.props.control.isEnabled()}
               name="max"
               type="number"
               className="euiFieldNumber"

src/core_plugins/input_control_vis/public/components/vis/range_control.test.js

@@ -51,6 +51,29 @@ test('renders RangeControl', () => {
   expect(component).toMatchSnapshot(); // eslint-disable-line
 });
 
+test('disabled', () => {
+  const disabledRangeControl = {
+    id: 'mock-range-control',
+    isEnabled: () => { return false; },
+    options: {
+      decimalPlaces: 0,
+      step: 1
+    },
+    type: 'range',
+    label: 'range control',
+    disabledReason: 'control is disabled to test rendering when disabled',
+    hasValue: () => {
+      return false;
+    }
+  };
+  const component = shallow(<RangeControl
+    control={disabledRangeControl}
+    controlIndex={0}
+    stageFilter={() => {}}
+  />);
+  expect(component).toMatchSnapshot(); // eslint-disable-line
+});
+
 describe('min and max input values', () => {
   const component = mount(<RangeControl
     control={control}

src/core_plugins/input_control_vis/public/control/range_control_factory.js

@@ -68,24 +68,17 @@ class RangeControl extends Control {
       return;
     }
 
-    let minMaxReturnedFromAggregation = true;
-    let min = _.get(resp, 'aggregations.minAgg.value');
-    let max = _.get(resp, 'aggregations.maxAgg.value');
-    if (min === null || max === null) {
-      min = 0;
-      max = 1;
-      minMaxReturnedFromAggregation = false;
-    }
+    const min = _.get(resp, 'aggregations.minAgg.value');
+    const max = _.get(resp, 'aggregations.maxAgg.value');
 
-    if (!minMaxReturnedFromAggregation) {
+    if (min === null || max === null) {
       this.disable(noValuesDisableMsg(fieldName, indexPattern.title));
-    } else {
-      this.min = min;
-      this.max = max;
-      this.enable = true;
+      return;
     }
 
-    return 'done';
+    this.min = min;
+    this.max = max;
+    this.enable = true;
   }
 }