diff --git a/superset-frontend/spec/javascripts/explore/components/FixedOrMetricControl_spec.jsx b/superset-frontend/spec/javascripts/explore/components/FixedOrMetricControl_spec.jsx
deleted file mode 100644
index dae156cd24..0000000000
--- a/superset-frontend/spec/javascripts/explore/components/FixedOrMetricControl_spec.jsx
+++ /dev/null
@@ -1,43 +0,0 @@
-/**
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-/* eslint-disable no-unused-expressions */
-import React from 'react';
-import { shallow } from 'enzyme';
-
-import TextControl from 'src/explore/components/controls/TextControl';
-import FixedOrMetricControl from 'src/explore/components/controls/FixedOrMetricControl';
-import MetricsControl from 'src/explore/components/controls/MetricControl/MetricsControl';
-
-const defaultProps = {
- value: {},
- datasource: {},
-};
-
-describe('FixedOrMetricControl', () => {
- let wrapper;
-
- beforeEach(() => {
- wrapper = shallow();
- });
-
- it('renders a TextControl and a SelectControl', () => {
- expect(wrapper.find(TextControl)).toExist();
- expect(wrapper.find(MetricsControl)).toExist();
- });
-});
diff --git a/superset-frontend/src/explore/components/controls/FixedOrMetricControl/FixedOrMetricControl.test.tsx b/superset-frontend/src/explore/components/controls/FixedOrMetricControl/FixedOrMetricControl.test.tsx
new file mode 100644
index 0000000000..6a2efd59ab
--- /dev/null
+++ b/superset-frontend/src/explore/components/controls/FixedOrMetricControl/FixedOrMetricControl.test.tsx
@@ -0,0 +1,105 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import React from 'react';
+import { render, screen } from 'spec/helpers/testing-library';
+import userEvent from '@testing-library/user-event';
+import FixedOrMetricControl from '.';
+
+const createProps = () => ({
+ datasource: {
+ columns: [{ column_name: 'Column A' }],
+ metrics: [{ metric_name: 'Metric A', expression: 'COUNT(*)' }],
+ },
+});
+
+test('renders with minimal props', () => {
+ render();
+ expect(screen.getByRole('button')).toBeInTheDocument();
+ expect(screen.getByText('5')).toBeInTheDocument();
+});
+
+test('renders with default value', () => {
+ render(
+ ,
+ );
+ expect(screen.getByRole('button')).toBeInTheDocument();
+ expect(screen.getByText('10')).toBeInTheDocument();
+});
+
+test('renders with value', () => {
+ render(
+ ,
+ );
+ expect(screen.getByRole('button')).toBeInTheDocument();
+ expect(screen.getByText('20')).toBeInTheDocument();
+});
+
+test('renders with metric type', () => {
+ render(
+ ,
+ );
+ expect(screen.getByRole('button')).toBeInTheDocument();
+ expect(screen.getByText('Metric A')).toBeInTheDocument();
+});
+
+test('triggers onChange', () => {
+ const onChange = jest.fn();
+ render(
+ ,
+ );
+ userEvent.click(screen.getByText('10'));
+ expect(onChange).not.toHaveBeenCalled();
+ userEvent.type(screen.getByRole('textbox'), '20');
+ expect(onChange).toHaveBeenCalled();
+});
+
+test('switches control type', () => {
+ render(
+ ,
+ );
+ userEvent.click(screen.getByText('10'));
+ userEvent.click(screen.getByText('Based on a metric'));
+ expect(screen.getByText('metric:')).toBeInTheDocument();
+ userEvent.click(screen.getByText('Fixed'));
+ expect(screen.getByText('10')).toBeInTheDocument();
+});
diff --git a/superset-frontend/src/explore/components/controls/FixedOrMetricControl.jsx b/superset-frontend/src/explore/components/controls/FixedOrMetricControl/index.jsx
similarity index 95%
rename from superset-frontend/src/explore/components/controls/FixedOrMetricControl.jsx
rename to superset-frontend/src/explore/components/controls/FixedOrMetricControl/index.jsx
index c538f1307e..3400b9251c 100644
--- a/superset-frontend/src/explore/components/controls/FixedOrMetricControl.jsx
+++ b/superset-frontend/src/explore/components/controls/FixedOrMetricControl/index.jsx
@@ -22,10 +22,10 @@ import { css } from '@emotion/core';
import { t } from '@superset-ui/core';
import Label from 'src/components/Label';
import Collapse from 'src/common/components/Collapse';
-import TextControl from './TextControl';
-import MetricsControl from './MetricControl/MetricsControl';
-import ControlHeader from '../ControlHeader';
-import PopoverSection from '../../../components/PopoverSection';
+import TextControl from 'src/explore/components/controls/TextControl';
+import MetricsControl from 'src/explore/components/controls/MetricControl/MetricsControl';
+import ControlHeader from 'src/explore/components/ControlHeader';
+import PopoverSection from 'src/components/PopoverSection';
const controlTypes = {
fixed: 'fix',
diff --git a/superset-frontend/src/explore/components/controls/MetricControl/MetricsControl.jsx b/superset-frontend/src/explore/components/controls/MetricControl/MetricsControl.jsx
index fbf04152cf..2230824c76 100644
--- a/superset-frontend/src/explore/components/controls/MetricControl/MetricsControl.jsx
+++ b/superset-frontend/src/explore/components/controls/MetricControl/MetricsControl.jsx
@@ -294,7 +294,7 @@ class MetricsControl extends React.PureComponent {
null,
)}
datasource={this.props.datasource}
- savedMetric={{}}
+ savedMetric={{ metric_name: '', expression: '' }}
datasourceType={this.props.datasourceType}
createNew
>