From 3582bf9e565ad0c2945372bcf5bf80dd6bea68a9 Mon Sep 17 00:00:00 2001 From: Gabriel Dutra Date: Thu, 3 Oct 2019 20:15:12 -0300 Subject: [PATCH 1/4] Fix null static value after selecting it --- client/app/components/ParameterMappingInput.jsx | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/client/app/components/ParameterMappingInput.jsx b/client/app/components/ParameterMappingInput.jsx index 6eb1d41ff2..da362dbc43 100644 --- a/client/app/components/ParameterMappingInput.jsx +++ b/client/app/components/ParameterMappingInput.jsx @@ -1,6 +1,7 @@ /* eslint-disable react/no-multi-comp */ -import { isString, extend, each, map, includes, findIndex, find, fromPairs, clone, isEmpty } from 'lodash'; +import { isString, extend, each, has, map, includes, findIndex, find, + fromPairs, clone, isEmpty } from 'lodash'; import React, { Fragment } from 'react'; import PropTypes from 'prop-types'; import classNames from 'classnames'; @@ -158,6 +159,13 @@ export class ParameterMappingInput extends React.Component { newMapping.param = newMapping.param.clone(); newMapping.param.setValue(newMapping.value); } + if (has(update, 'type')) { + if (update.type === MappingType.StaticValue) { + newMapping.value = newMapping.param.value; + } else { + newMapping.value = null; + } + } onChange(newMapping); }; From 4c6d64f8534b8e53261d134e8ec932d2e7263707 Mon Sep 17 00:00:00 2001 From: Gabriel Dutra Date: Thu, 3 Oct 2019 20:24:39 -0300 Subject: [PATCH 2/4] Fix field not updating after changing the mapping --- .../dashboards/dashboard-widget/VisualizationWidget.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/client/app/components/dashboards/dashboard-widget/VisualizationWidget.jsx b/client/app/components/dashboards/dashboard-widget/VisualizationWidget.jsx index b965d028d6..820dce3a7e 100644 --- a/client/app/components/dashboards/dashboard-widget/VisualizationWidget.jsx +++ b/client/app/components/dashboards/dashboard-widget/VisualizationWidget.jsx @@ -214,14 +214,14 @@ class VisualizationWidget extends React.Component { }; editParameterMappings = () => { - const { widget, dashboard, onParameterMappingsChange } = this.props; + const { widget, dashboard, onRefresh, onParameterMappingsChange } = this.props; EditParameterMappingsDialog.showModal({ dashboard, widget, }).result.then((valuesChanged) => { // refresh widget if any parameter value has been updated if (valuesChanged) { - this.refresh(); + onRefresh(); } onParameterMappingsChange(); this.setState({ localParameters: widget.getLocalParameters() }); From abd82428250464b1cbb323557cbc950b598204fb Mon Sep 17 00:00:00 2001 From: Gabriel Dutra Date: Fri, 4 Oct 2019 17:28:28 -0300 Subject: [PATCH 3/4] Cypress tests part 1 --- .../app/components/ParameterMappingInput.jsx | 13 +- client/app/components/ParameterValueInput.jsx | 2 +- client/app/pages/dashboards/dashboard.html | 2 +- .../dashboard/parameter_mapping_spec.js | 136 ++++++++++++++++++ 4 files changed, 145 insertions(+), 8 deletions(-) create mode 100644 client/cypress/integration/dashboard/parameter_mapping_spec.js diff --git a/client/app/components/ParameterMappingInput.jsx b/client/app/components/ParameterMappingInput.jsx index da362dbc43..bb138f2b8e 100644 --- a/client/app/components/ParameterMappingInput.jsx +++ b/client/app/components/ParameterMappingInput.jsx @@ -176,7 +176,7 @@ export class ParameterMappingInput extends React.Component { value={this.props.mapping.type} onChange={e => this.updateSourceType(e.target.value)} > - + New dashboard parameter ) : null } - + Widget parameter - + Static value @@ -343,7 +343,7 @@ class MappingEditor extends React.Component { const { mapping, inputError } = this.state; return ( -
+
Edit Source and Value
@@ -362,15 +362,16 @@ class MappingEditor extends React.Component { } render() { + const { visible, mapping } = this.state; return ( - diff --git a/client/app/components/ParameterValueInput.jsx b/client/app/components/ParameterValueInput.jsx index fa5b411091..e0ecfffcab 100644 --- a/client/app/components/ParameterValueInput.jsx +++ b/client/app/components/ParameterValueInput.jsx @@ -185,7 +185,7 @@ class ParameterValueInput extends React.Component { const { isDirty } = this.state; return ( -
+
{this.renderInput()}
); diff --git a/client/app/pages/dashboards/dashboard.html b/client/app/pages/dashboards/dashboard.html index c594824840..114a07fd63 100644 --- a/client/app/pages/dashboards/dashboard.html +++ b/client/app/pages/dashboards/dashboard.html @@ -93,7 +93,7 @@

-
+
diff --git a/client/cypress/integration/dashboard/parameter_mapping_spec.js b/client/cypress/integration/dashboard/parameter_mapping_spec.js new file mode 100644 index 0000000000..5f569dcd02 --- /dev/null +++ b/client/cypress/integration/dashboard/parameter_mapping_spec.js @@ -0,0 +1,136 @@ +import { createDashboard } from '../../support/redash-api'; +import { createQueryAndAddWidget } from '../../support/dashboard'; + +describe('Parameter Mapping', () => { + beforeEach(function () { + cy.login(); + createDashboard('Foo Bar').then(({ slug, id }) => { + this.dashboardId = id; + this.dashboardUrl = `/dashboard/${slug}`; + }).then(() => { + const queryData = { + name: 'Text Parameter', + query: "SELECT '{{test-parameter}}' AS parameter", + options: { + parameters: [ + { name: 'test-parameter', title: 'Test Parameter', type: 'text', value: 'example' }, + ], + }, + }; + const widgetOptions = { position: { col: 0, row: 0, sizeX: 3, sizeY: 10, autoHeight: false } }; + createQueryAndAddWidget(this.dashboardId, queryData, widgetOptions).then((widgetTestId) => { + cy.visit(this.dashboardUrl); + this.widgetTestId = widgetTestId; + }); + }); + }); + + const openMappingOptions = (widgetTestId, paramName) => { + cy.getByTestId(widgetTestId) + .within(() => { + cy.getByTestId('WidgetDropdownButton') + .click(); + }); + + cy.getByTestId('WidgetDropdownButtonMenu') + .contains('Edit Parameters') + .click(); + + cy.getByTestId(`EditParamMappingButon-${paramName}`) + .click(); + }; + + const saveMappingOptions = () => { + cy.getByTestId('EditParamMappingPopover') + .within(() => { + cy.contains('button', 'OK') + .click(); + }); + + cy.contains('button', 'OK') + .click(); + }; + + it('has widget mapping as the default', function () { + cy.getByTestId(this.widgetTestId) + .within(() => { + cy.getByTestId('TableVisualization') + .should('contain', 'example'); + + cy.getByTestId('ParameterName-test-parameter') + .find('input') + .type('{selectall}Redash'); + + cy.getByTestId('ParameterApplyButton') + .click(); + + cy.getByTestId('TableVisualization') + .should('contain', 'Redash'); + }); + + cy.getByTestId('DashboardParameters') + .should('not.exist'); + }); + + it('supports dashboard parameters', function () { + openMappingOptions(this.widgetTestId, 'test-parameter'); + + cy.getByTestId('NewDashboardParameterOption') + .click(); + + saveMappingOptions(); + + cy.getByTestId(this.widgetTestId) + .within(() => { + cy.getByTestId('ParameterName-test-parameter') + .should('not.exist'); + }); + + cy.getByTestId('DashboardParameters') + .within(() => { + cy.getByTestId('ParameterName-test-parameter') + .find('input') + .type('{selectall}DashboardParam'); + + cy.getByTestId('ParameterApplyButton') + .click(); + }); + + cy.getByTestId(this.widgetTestId) + .within(() => { + cy.getByTestId('TableVisualization') + .should('contain', 'DashboardParam'); + }); + }); + + it('supports static values for parameters', function () { + openMappingOptions(this.widgetTestId, 'test-parameter'); + + cy.getByTestId('StaticValueOption') + .click(); + + cy.getByTestId('EditParamMappingPopover') + .within(() => { + cy.getByTestId('ParameterValueInput') + .find('input') + .type('{selectall}StaticValue'); + }); + + saveMappingOptions(); + + cy.getByTestId(this.widgetTestId) + .within(() => { + cy.getByTestId('ParameterName-test-parameter') + .should('not.exist'); + }); + + cy.getByTestId('DashboardParameters') + .should('not.exist'); + + cy.getByTestId(this.widgetTestId) + .within(() => { + cy.getByTestId('TableVisualization') + .should('contain', 'StaticValue'); + }); + }); +}); From c42dabc85ff51602ded6bab97bbc1f0a7c2ad7cb Mon Sep 17 00:00:00 2001 From: Gabriel Dutra Date: Sat, 5 Oct 2019 10:44:28 -0300 Subject: [PATCH 4/4] Updating naming for widget mapping test --- client/cypress/integration/dashboard/parameter_mapping_spec.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/client/cypress/integration/dashboard/parameter_mapping_spec.js b/client/cypress/integration/dashboard/parameter_mapping_spec.js index 5f569dcd02..23e46d05a1 100644 --- a/client/cypress/integration/dashboard/parameter_mapping_spec.js +++ b/client/cypress/integration/dashboard/parameter_mapping_spec.js @@ -51,7 +51,8 @@ describe('Parameter Mapping', () => { .click(); }; - it('has widget mapping as the default', function () { + it('supports widget parameters', function () { + // widget parameter mapping is the default for the API cy.getByTestId(this.widgetTestId) .within(() => { cy.getByTestId('TableVisualization')