diff --git a/superset-frontend/cypress-base/cypress/downloads/new-chart-2022-09-09T14-22-31.728Z.jpg b/superset-frontend/cypress-base/cypress/downloads/new-chart-2022-09-09T14-22-31.728Z.jpg deleted file mode 100644 index 81bcb35cf..000000000 Binary files a/superset-frontend/cypress-base/cypress/downloads/new-chart-2022-09-09T14-22-31.728Z.jpg and /dev/null differ diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard/drilltodetail.test.ts b/superset-frontend/cypress-base/cypress/integration/dashboard/drilltodetail.test.ts index d44f6a27e..edce9053f 100644 --- a/superset-frontend/cypress-base/cypress/integration/dashboard/drilltodetail.test.ts +++ b/superset-frontend/cypress-base/cypress/integration/dashboard/drilltodetail.test.ts @@ -42,10 +42,13 @@ function openModalFromMenu(chartType: string) { function openModalFromChartContext(targetMenuItem: string) { interceptSamples(); + cy.wait(500); cy.get('.ant-dropdown') .not('.ant-dropdown-hidden') + .first() .find("[role='menu'] [role='menuitem']") - .should('contain', targetMenuItem) + .contains(targetMenuItem) + .first() .click(); cy.wait('@samples'); } @@ -62,6 +65,56 @@ function setTopLevelTab(tabName: string) { cy.get("div#TABS-TOP div[role='tab']").contains(tabName).click(); } +function testTimeChart(vizType: string) { + interceptSamples(); + + cy.get(`[data-test-viz-type='${vizType}'] canvas`).then($canvas => { + cy.wrap($canvas) + .scrollIntoView() + .trigger('mousemove', 70, 93) + .rightclick(70, 93); + + openModalFromChartContext('Drill to detail by 1965'); + cy.getBySel('filter-val').should('contain', '1965'); + closeModal(); + + cy.wrap($canvas) + .scrollIntoView() + .trigger('mousemove', 70, 93) + .rightclick(70, 93); + + openModalFromChartContext('Drill to detail by boy'); + cy.getBySel('filter-val').should('contain', 'boy'); + closeModal(); + + cy.wrap($canvas) + .scrollIntoView() + .trigger('mousemove', 70, 93) + .rightclick(70, 93); + + openModalFromChartContext('Drill to detail by all'); + cy.getBySel('filter-val').first().should('contain', '1965'); + cy.getBySel('filter-val').eq(1).should('contain', 'boy'); + closeModal(); + + cy.wrap($canvas) + .scrollIntoView() + .trigger('mousemove', 70, 145) + .rightclick(70, 145); + openModalFromChartContext('Drill to detail by girl'); + cy.getBySel('filter-val').should('contain', 'girl'); + closeModal(); + + cy.wrap($canvas) + .scrollIntoView() + .trigger('mousemove', 70, 145) + .rightclick(70, 145); + openModalFromChartContext('Drill to detail by all'); + cy.getBySel('filter-val').first().should('contain', '1965'); + cy.getBySel('filter-val').eq(1).should('contain', 'girl'); + }); +} + describe('Drill to detail modal', () => { beforeEach(() => { cy.preserveLogin(); @@ -130,60 +183,6 @@ describe('Drill to detail modal', () => { }); }); - describe('Time-series Bar Chart V2', () => { - it('opens the modal with the correct filters', () => { - interceptSamples(); - - cy.get("[data-test-viz-type='echarts_timeseries_bar'] canvas").then( - $canvas => { - cy.wrap($canvas) - .scrollIntoView() - .rightclick(70, 100, { force: true }); - cy.get('.ant-dropdown') - .not('.ant-dropdown-hidden') - .find("[role='menu'] [role='menuitem']") - .should('have.length', 3) - .then($menuitems => { - expect($menuitems).to.contain('Drill to detail by 1965'); - expect($menuitems).to.contain('Drill to detail by boy'); - expect($menuitems).to.contain('Drill to detail by all'); - }) - .eq(2) - .click(); - cy.wait('@samples'); - - cy.getBySel('filter-val').then($filters => { - expect($filters).to.contain('1965'); - expect($filters).to.contain('boy'); - }); - }, - ); - }); - }); - - describe('Pie', () => { - it('opens the modal with the correct filters', () => { - interceptSamples(); - - // opens the modal by clicking on the slice of the Pie chart - cy.get("[data-test-viz-type='pie'] canvas").then($canvas => { - const canvasWidth = $canvas.width() || 0; - const canvasHeight = $canvas.height() || 0; - const canvasCenterX = canvasWidth / 3; - const canvasCenterY = canvasHeight / 2; - - cy.wrap($canvas) - .scrollIntoView() - .rightclick(canvasCenterX, canvasCenterY, { force: true }); - - openModalFromChartContext('Drill to detail by girl'); - - // checking the filtered and paginated data - cy.getBySel('filter-val').should('contain', 'girl'); - }); - }); - }); - describe('Big number total', () => { it('opens the modal with no filters', () => { interceptSamples(); @@ -212,8 +211,197 @@ describe('Drill to detail modal', () => { cy.getBySel('filter-val').should('not.exist'); - // TODO: test clicking on a trendline - // Cypress is refusing to rightclick on the dot + closeModal(); + + // opens the modal by clicking on the trendline + cy.get("[data-test-viz-type='big_number'] canvas").then($canvas => { + cy.wrap($canvas) + .scrollIntoView() + .trigger('mousemove', 1, 14) + .rightclick(1, 14); + + openModalFromChartContext('Drill to detail by 1965'); + + // checking the filter + cy.getBySel('filter-val').should('contain', '1965'); + }); + }); + }); + + describe('Table', () => { + it('opens the modal with the correct filters', () => { + interceptSamples(); + + cy.get("[data-test-viz-type='table']") + .scrollIntoView() + .contains('boy') + .rightclick(); + + openModalFromChartContext('Drill to detail by boy'); + + cy.getBySel('filter-val').should('contain', 'boy'); + + closeModal(); + + cy.get("[data-test-viz-type='table']") + .scrollIntoView() + .contains('girl') + .rightclick(); + + openModalFromChartContext('Drill to detail by girl'); + + cy.getBySel('filter-val').should('contain', 'girl'); + }); + }); + + describe('Pivot Table V2', () => { + it('opens the modal with the correct filters', () => { + interceptSamples(); + + cy.get("[data-test-viz-type='pivot_table_v2']") + .scrollIntoView() + .find('[role="gridcell"]') + .first() + .rightclick(); + + openModalFromChartContext('Drill to detail by boy'); + + cy.getBySel('filter-val').should('contain', 'boy'); + closeModal(); + + cy.get("[data-test-viz-type='pivot_table_v2']") + .scrollIntoView() + .find('[role="gridcell"]') + .first() + .rightclick(); + + openModalFromChartContext('Drill to detail by CA'); + + cy.getBySel('filter-val').should('contain', 'CA'); + closeModal(); + + cy.get("[data-test-viz-type='pivot_table_v2']") + .scrollIntoView() + .find('[role="gridcell"]') + .eq(3) + .rightclick(); + + openModalFromChartContext('Drill to detail by girl'); + + cy.getBySel('filter-val').should('contain', 'girl'); + closeModal(); + + cy.get("[data-test-viz-type='pivot_table_v2']") + .scrollIntoView() + .find('[role="gridcell"]') + .eq(3) + .rightclick(); + + openModalFromChartContext('Drill to detail by FL'); + + cy.getBySel('filter-val').should('contain', 'FL'); + closeModal(); + + cy.get("[data-test-viz-type='pivot_table_v2']") + .scrollIntoView() + .find('[role="gridcell"]') + .eq(3) + .rightclick(); + + openModalFromChartContext('Drill to detail by all'); + + cy.getBySel('filter-val').first().should('contain', 'girl'); + cy.getBySel('filter-val').eq(1).should('contain', 'FL'); + }); + }); + + describe('Time-Series Line Chart', () => { + it('opens the modal with the correct filters', () => { + testTimeChart('echarts_timeseries_line'); + }); + }); + + describe('Time-series Bar Chart V2', () => { + it('opens the modal with the correct filters', () => { + interceptSamples(); + + cy.get("[data-test-viz-type='echarts_timeseries_bar'] canvas").then( + $canvas => { + cy.wrap($canvas).scrollIntoView().rightclick(70, 100); + + openModalFromChartContext('Drill to detail by 1965'); + cy.getBySel('filter-val').should('contain', '1965'); + closeModal(); + + cy.wrap($canvas).scrollIntoView().rightclick(70, 100); + + openModalFromChartContext('Drill to detail by boy'); + cy.getBySel('filter-val').should('contain', 'boy'); + closeModal(); + + cy.wrap($canvas).scrollIntoView().rightclick(70, 100); + + openModalFromChartContext('Drill to detail by all'); + cy.getBySel('filter-val').first().should('contain', '1965'); + cy.getBySel('filter-val').eq(1).should('contain', 'boy'); + closeModal(); + + cy.wrap($canvas).scrollIntoView().rightclick(72, 200); + + openModalFromChartContext('Drill to detail by girl'); + cy.getBySel('filter-val').should('contain', 'girl'); + }, + ); + }); + }); + + describe('Time-Series Area Chart', () => { + it('opens the modal with the correct filters', () => { + testTimeChart('echarts_area'); + }); + }); + + describe('Time-Series Scatter Chart', () => { + it('opens the modal with the correct filters', () => { + testTimeChart('echarts_timeseries_scatter'); + }); + }); + + describe('Pie', () => { + it('opens the modal with the correct filters', () => { + interceptSamples(); + + // opens the modal by clicking on the slice of the Pie chart + cy.get("[data-test-viz-type='pie'] canvas").then($canvas => { + cy.wrap($canvas).scrollIntoView().rightclick(130, 150); + + openModalFromChartContext('Drill to detail by girl'); + cy.getBySel('filter-val').should('contain', 'girl'); + closeModal(); + + cy.wrap($canvas).scrollIntoView().rightclick(230, 190); + + openModalFromChartContext('Drill to detail by boy'); + cy.getBySel('filter-val').should('contain', 'boy'); + }); + }); + }); + + describe('World Map', () => { + it('opens the modal with the correct filters', () => { + interceptSamples(); + + cy.get("[data-test-viz-type='world_map'] svg").then($canvas => { + cy.wrap($canvas).scrollIntoView().rightclick(70, 150); + openModalFromChartContext('Drill to detail by United States'); + cy.getBySel('filter-val').should('contain', 'United States'); + closeModal(); + }); + cy.get("[data-test-viz-type='world_map'] svg").then($canvas => { + cy.wrap($canvas).scrollIntoView().rightclick(200, 140); + openModalFromChartContext('Drill to detail by Slovakia'); + cy.getBySel('filter-val').should('contain', 'Slovakia'); + }); }); }); }); @@ -274,21 +462,123 @@ describe('Drill to detail modal', () => { it('opens the modal with the correct filters', () => { interceptSamples(); - // opens the modal by clicking on the box on the chart cy.get("[data-test-viz-type='box_plot'] canvas").then($canvas => { - const canvasWidth = $canvas.width() || 0; - const canvasHeight = $canvas.height() || 0; - const canvasCenterX = canvasWidth / 3; - const canvasCenterY = (canvasHeight * 5) / 6; + cy.wrap($canvas) + .scrollIntoView() + .trigger('mousemove', 135, 275) + .rightclick(135, 275); + + openModalFromChartContext('Drill to detail by boy'); + cy.getBySel('filter-val').should('contain', 'boy'); + closeModal(); cy.wrap($canvas) .scrollIntoView() - .rightclick(canvasCenterX, canvasCenterY, { force: true }); + .trigger('mousemove', 270, 280) + .rightclick(270, 280); + + openModalFromChartContext('Drill to detail by girl'); + cy.getBySel('filter-val').should('contain', 'girl'); + }); + }); + }); + + describe('Time-Series Generic Chart', () => { + it('opens the modal with the correct filters', () => { + testTimeChart('echarts_timeseries'); + }); + }); + + describe('Time-Series Smooth Chart', () => { + it('opens the modal with the correct filters', () => { + testTimeChart('echarts_timeseries_smooth'); + }); + }); + + describe('Time-Series Step Line Chart', () => { + it('opens the modal with the correct filters', () => { + testTimeChart('echarts_timeseries_step'); + }); + }); + + describe('Funnel Chart', () => { + it('opens the modal with the correct filters', () => { + interceptSamples(); + + cy.get("[data-test-viz-type='funnel'] canvas").then($canvas => { + cy.wrap($canvas).scrollIntoView().rightclick(170, 90); openModalFromChartContext('Drill to detail by boy'); - - // checking the filter cy.getBySel('filter-val').should('contain', 'boy'); + closeModal(); + + cy.wrap($canvas).scrollIntoView().rightclick(190, 250); + + openModalFromChartContext('Drill to detail by girl'); + cy.getBySel('filter-val').should('contain', 'girl'); + }); + }); + }); + + describe('Gauge Chart', () => { + it('opens the modal with the correct filters', () => { + interceptSamples(); + + cy.get("[data-test-viz-type='gauge_chart'] canvas").then($canvas => { + cy.wrap($canvas).scrollIntoView().rightclick(135, 95); + + openModalFromChartContext('Drill to detail by boy'); + cy.getBySel('filter-val').should('contain', 'boy'); + closeModal(); + + cy.wrap($canvas).scrollIntoView().rightclick(95, 135); + + openModalFromChartContext('Drill to detail by girl'); + cy.getBySel('filter-val').should('contain', 'girl'); + }); + }); + }); + + describe('Mixed Chart', () => { + it('opens the modal with the correct filters', () => { + testTimeChart('mixed_timeseries'); + }); + }); + + describe('Radar Chart', () => { + it('opens the modal with the correct filters', () => { + interceptSamples(); + + cy.get("[data-test-viz-type='radar'] canvas").then($canvas => { + cy.wrap($canvas).scrollIntoView().rightclick(180, 45); + + openModalFromChartContext('Drill to detail by boy'); + cy.getBySel('filter-val').should('contain', 'boy'); + closeModal(); + + cy.wrap($canvas).scrollIntoView().rightclick(180, 85); + + openModalFromChartContext('Drill to detail by girl'); + cy.getBySel('filter-val').should('contain', 'girl'); + }); + }); + }); + + describe('Treemap V2', () => { + it('opens the modal with the correct filters', () => { + interceptSamples(); + + cy.get("[data-test-viz-type='treemap_v2'] canvas").then($canvas => { + cy.wrap($canvas).scrollIntoView().rightclick(100, 30); + + openModalFromChartContext('Drill to detail by boy'); + cy.getBySel('filter-val').should('contain', 'boy'); + closeModal(); + + cy.wrap($canvas).scrollIntoView().rightclick(150, 250); + + openModalFromChartContext('Drill to detail by girl'); + cy.getBySel('filter-val').should('contain', 'girl'); }); }); }); diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard/nativeFilters.test.ts b/superset-frontend/cypress-base/cypress/integration/dashboard/nativeFilters.test.ts index 403faf166..184ac8613 100644 --- a/superset-frontend/cypress-base/cypress/integration/dashboard/nativeFilters.test.ts +++ b/superset-frontend/cypress-base/cypress/integration/dashboard/nativeFilters.test.ts @@ -64,7 +64,7 @@ function visitDashboard() { cy.wait('@get'); cy.wait('@getCharts'); cy.wait('@getDatasets'); - cy.wait(500); + cy.url().should('contain', 'native_filters_key'); } function prepareDashboardFilters( @@ -454,6 +454,7 @@ describe('Native filters', () => { let filterKey: string; const removeFirstChar = (search: string) => search.split('').slice(1, search.length).join(''); + cy.location().then(loc => { const queryParams = qs.parse(removeFirstChar(loc.search)); filterKey = queryParams.native_filters_key as string; diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/area.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/area.test.js index 069b457aa..a8af76a65 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/area.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/area.test.js @@ -17,6 +17,11 @@ * under the License. */ describe('Visualization > Area', () => { + beforeEach(() => { + cy.preserveLogin(); + cy.intercept('POST', '/superset/explore_json/**').as('getJson'); + }); + const AREA_FORM_DATA = { datasource: '2__table', viz_type: 'area', @@ -55,11 +60,6 @@ describe('Visualization > Area', () => { cy.verifySliceSuccess({ waitAlias: '@getJson', chartSelector: 'svg' }); } - beforeEach(() => { - cy.login(); - cy.intercept('POST', '/superset/explore_json/**').as('getJson'); - }); - it('should work without groupby', () => { verify(AREA_FORM_DATA); cy.get('.nv-area').should('have.length', 1); @@ -105,6 +105,8 @@ describe('Visualization > Area', () => { }); it('should allow type to search color schemes and apply the scheme', () => { + verify(AREA_FORM_DATA); + cy.get('#controlSections-tab-display').click(); cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); cy.get('.Control[data-test="color_scheme"] input[type="search"]') diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/big_number.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/big_number.test.js index ede7ed47f..5701ed810 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/big_number.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/big_number.test.js @@ -19,6 +19,11 @@ import { interceptChart } from 'cypress/utils'; describe('Visualization > Big Number with Trendline', () => { + beforeEach(() => { + cy.preserveLogin(); + interceptChart({ legacy: false }).as('chartData'); + }); + const BIG_NUMBER_FORM_DATA = { datasource: '2__table', viz_type: 'big_number', @@ -49,11 +54,6 @@ describe('Visualization > Big Number with Trendline', () => { }); } - beforeEach(() => { - cy.login(); - interceptChart({ legacy: false }).as('chartData'); - }); - it('should work', () => { verify(BIG_NUMBER_FORM_DATA); cy.get('.chart-container .header-line'); diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/big_number_total.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/big_number_total.test.js index e2fcc5a1a..8ef01b7a4 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/big_number_total.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/big_number_total.test.js @@ -20,16 +20,16 @@ import { interceptChart } from 'cypress/utils'; import { FORM_DATA_DEFAULTS, NUM_METRIC } from './shared.helper'; describe('Visualization > Big Number Total', () => { + beforeEach(() => { + cy.preserveLogin(); + interceptChart({ legacy: false }).as('chartData'); + }); + const BIG_NUMBER_DEFAULTS = { ...FORM_DATA_DEFAULTS, viz_type: 'big_number_total', }; - beforeEach(() => { - cy.login(); - interceptChart({ legacy: false }).as('chartData'); - }); - it('Test big number chart with adhoc metric', () => { const formData = { ...BIG_NUMBER_DEFAULTS, metric: NUM_METRIC }; diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/box_plot.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/box_plot.test.js index 46242e011..d88ef7562 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/box_plot.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/box_plot.test.js @@ -17,6 +17,11 @@ * under the License. */ describe('Visualization > Box Plot', () => { + beforeEach(() => { + cy.preserveLogin(); + cy.intercept('POST', '/api/v1/chart/data*').as('getJson'); + }); + const BOX_PLOT_FORM_DATA = { datasource: '2__table', viz_type: 'box_plot', @@ -37,17 +42,14 @@ describe('Visualization > Box Plot', () => { cy.verifySliceSuccess({ waitAlias: '@getJson' }); } - beforeEach(() => { - cy.login(); - cy.intercept('POST', '/api/v1/chart/data*').as('getJson'); - }); - it('should work', () => { verify(BOX_PLOT_FORM_DATA); cy.get('.chart-container .box_plot canvas').should('have.length', 1); }); it('should allow type to search color schemes', () => { + verify(BOX_PLOT_FORM_DATA); + cy.get('#controlSections-tab-display').click(); cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); cy.get('.Control[data-test="color_scheme"] input[type="search"]') diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/bubble.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/bubble.test.js index e41535b54..9a0e4ca2b 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/bubble.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/bubble.test.js @@ -17,6 +17,11 @@ * under the License. */ describe('Visualization > Bubble', () => { + beforeEach(() => { + cy.preserveLogin(); + cy.intercept('POST', '/superset/explore_json/**').as('getJson'); + }); + const BUBBLE_FORM_DATA = { datasource: '2__table', viz_type: 'bubble', @@ -51,33 +56,6 @@ describe('Visualization > Bubble', () => { cy.verifySliceSuccess({ waitAlias: '@getJson', chartSelector: 'svg' }); } - beforeEach(() => { - cy.login(); - cy.intercept('POST', '/superset/explore_json/**').as('getJson'); - }); - - // Number of circles are pretty unstable when there are a lot of circles - // Since main functionality is already covered in filter test below, - // skip this test until we find a solution. - it.skip('should work', () => { - cy.visitChartByParams(BUBBLE_FORM_DATA).then(() => { - cy.wait('@getJson').then(xhr => { - let expectedBubblesNumber = 0; - xhr.responseBody.data.forEach(element => { - expectedBubblesNumber += element.values.length; - }); - cy.get('[data-test="chart-container"]') - .should('be.visible', { timeout: 15000 }) - .within(() => { - cy.get('svg') - .should('exist') - .find('.nv-point-clips circle') - .should('have.length', expectedBubblesNumber); - }); - }); - }); - }); - it('should work with filter', () => { verify({ ...BUBBLE_FORM_DATA, @@ -109,6 +87,8 @@ describe('Visualization > Bubble', () => { }); it('should allow type to search color schemes and apply the scheme', () => { + cy.visitChartByParams(BUBBLE_FORM_DATA); + cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); cy.get('.Control[data-test="color_scheme"] input[type="search"]') .focus() diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/compare.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/compare.test.js index 71f61c143..d319944b3 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/compare.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/compare.test.js @@ -17,6 +17,11 @@ * under the License. */ describe('Visualization > Compare', () => { + beforeEach(() => { + cy.preserveLogin(); + cy.intercept('POST', '/superset/explore_json/**').as('getJson'); + }); + const COMPARE_FORM_DATA = { datasource: '3__table', viz_type: 'compare', @@ -51,11 +56,6 @@ describe('Visualization > Compare', () => { cy.verifySliceSuccess({ waitAlias: '@getJson', chartSelector: 'svg' }); } - beforeEach(() => { - cy.login(); - cy.intercept('POST', '/superset/explore_json/**').as('getJson'); - }); - it('should work without groupby', () => { verify(COMPARE_FORM_DATA); cy.get('.chart-container .nvd3 path.nv-line').should('have.length', 1); @@ -88,6 +88,8 @@ describe('Visualization > Compare', () => { }); it('should allow type to search color schemes and apply the scheme', () => { + verify(COMPARE_FORM_DATA); + cy.get('#controlSections-tab-display').click(); cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); cy.get('.Control[data-test="color_scheme"] input[type="search"]') diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/dist_bar.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/dist_bar.test.js index 9f62003c8..0a81ab78f 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/dist_bar.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/dist_bar.test.js @@ -19,21 +19,20 @@ import { FORM_DATA_DEFAULTS, NUM_METRIC } from './shared.helper'; describe('Visualization > Distribution bar chart', () => { - const VIZ_DEFAULTS = { ...FORM_DATA_DEFAULTS, viz_type: 'dist_bar' }; - beforeEach(() => { - cy.login(); + cy.preserveLogin(); cy.intercept('POST', '/superset/explore_json/**').as('getJson'); }); - it('should work with adhoc metric', () => { - const formData = { - ...VIZ_DEFAULTS, - metrics: NUM_METRIC, - groupby: ['state'], - }; + const VIZ_DEFAULTS = { ...FORM_DATA_DEFAULTS, viz_type: 'dist_bar' }; + const DISTBAR_FORM_DATA = { + ...VIZ_DEFAULTS, + metrics: NUM_METRIC, + groupby: ['state'], + }; - cy.visitChartByParams(formData); + it('should work with adhoc metric', () => { + cy.visitChartByParams(DISTBAR_FORM_DATA); cy.verifySliceSuccess({ waitAlias: '@getJson', querySubstring: NUM_METRIC.label, @@ -79,6 +78,8 @@ describe('Visualization > Distribution bar chart', () => { }); it('should allow type to search color schemes and apply the scheme', () => { + cy.visitChartByParams(DISTBAR_FORM_DATA); + cy.get('#controlSections-tab-display').click(); cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); cy.get('.Control[data-test="color_scheme"] input[type="search"]') diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/dual_line.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/dual_line.test.js index 1e7ed4c45..be9b26739 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/dual_line.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/dual_line.test.js @@ -17,6 +17,11 @@ * under the License. */ describe('Visualization > Dual Line', () => { + beforeEach(() => { + cy.preserveLogin(); + cy.intercept('POST', '/superset/explore_json/**').as('getJson'); + }); + const DUAL_LINE_FORM_DATA = { datasource: '3__table', viz_type: 'dual_line', @@ -39,11 +44,6 @@ describe('Visualization > Dual Line', () => { cy.verifySliceSuccess({ waitAlias: '@getJson', chartSelector: 'svg' }); } - beforeEach(() => { - cy.login(); - cy.intercept('POST', '/superset/explore_json/**').as('getJson'); - }); - it('should work', () => { verify(DUAL_LINE_FORM_DATA); cy.get('.chart-container svg path.nv-line').should('have.length', 2); @@ -68,6 +68,8 @@ describe('Visualization > Dual Line', () => { }); it('should allow type to search color schemes and apply the scheme', () => { + verify(DUAL_LINE_FORM_DATA); + cy.get('#controlSections-tab-display').click(); cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); cy.get('.Control[data-test="color_scheme"] input[type="search"]') diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/gauge.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/gauge.test.js index e8a85e83d..023b3aeaa 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/gauge.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/gauge.test.js @@ -17,14 +17,18 @@ * under the License. */ -// TODO(kgabryje): fix it and un-skip -describe.skip('Visualization > Gauge', () => { +describe('Visualization > Gauge', () => { + beforeEach(() => { + cy.preserveLogin(); + cy.intercept('POST', '/api/v1/chart/data*').as('getJson'); + }); + const GAUGE_FORM_DATA = { - datasource: '2__table', + datasource: '3__table', viz_type: 'gauge_chart', metric: 'count', adhoc_filters: [], - slice_id: 49, + slice_id: 54, row_limit: 10, }; @@ -33,11 +37,6 @@ describe.skip('Visualization > Gauge', () => { cy.verifySliceSuccess({ waitAlias: '@getJson' }); } - beforeEach(() => { - cy.login(); - cy.intercept('POST', '/api/v1/chart/data*').as('getJson'); - }); - it('should work', () => { verify(GAUGE_FORM_DATA); cy.get('.chart-container .gauge_chart canvas').should('have.length', 1); @@ -64,6 +63,8 @@ describe.skip('Visualization > Gauge', () => { }); it('should allow type to search color schemes', () => { + verify(GAUGE_FORM_DATA); + cy.get('#controlSections-tab-display').click(); cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); cy.get('.Control[data-test="color_scheme"] input[type="search"]') diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/graph.test.ts b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/graph.test.ts index 16747d722..76883ca87 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/graph.test.ts +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/graph.test.ts @@ -27,6 +27,11 @@ type adhocFilter = { }; describe('Visualization > Graph', () => { + beforeEach(() => { + cy.preserveLogin(); + cy.intercept('POST', '/api/v1/chart/data*').as('getJson'); + }); + const GRAPH_FORM_DATA = { datasource: '1__table', viz_type: 'graph_chart', @@ -50,11 +55,6 @@ describe('Visualization > Graph', () => { cy.verifySliceSuccess({ waitAlias: '@getJson' }); } - beforeEach(() => { - cy.login(); - cy.intercept('POST', '/api/v1/chart/data*').as('getJson'); - }); - it('should work with ad-hoc metric', () => { verify(GRAPH_FORM_DATA); cy.get('.chart-container .graph_chart canvas').should('have.length', 1); @@ -79,6 +79,8 @@ describe('Visualization > Graph', () => { }); it('should allow type to search color schemes', () => { + verify(GRAPH_FORM_DATA); + cy.get('#controlSections-tab-display').click(); cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); cy.get('.Control[data-test="color_scheme"] input[type="search"]') diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/histogram.test.ts b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/histogram.test.ts index fbd5cfade..5a8576df2 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/histogram.test.ts +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/histogram.test.ts @@ -19,6 +19,11 @@ import { QueryFormData } from '@superset-ui/core'; describe('Visualization > Histogram', () => { + beforeEach(() => { + cy.preserveLogin(); + cy.intercept('POST', '/superset/explore_json/**').as('getJson'); + }); + const HISTOGRAM_FORM_DATA: QueryFormData = { datasource: '3__table', viz_type: 'histogram', @@ -43,11 +48,6 @@ describe('Visualization > Histogram', () => { cy.verifySliceSuccess({ waitAlias: '@getJson', chartSelector: 'svg' }); } - beforeEach(() => { - cy.login(); - cy.intercept('POST', '/superset/explore_json/**').as('getJson'); - }); - it('should work without groupby', () => { verify(HISTOGRAM_FORM_DATA); cy.get('.chart-container svg .vx-bar').should( @@ -86,6 +86,8 @@ describe('Visualization > Histogram', () => { }); it('should allow type to search color schemes and apply the scheme', () => { + verify(HISTOGRAM_FORM_DATA); + cy.get('#controlSections-tab-display').click(); cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); cy.get('.Control[data-test="color_scheme"] input[type="search"]') diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/line.test.ts b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/line.test.ts index 03ab7a6ed..7f55529a6 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/line.test.ts +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/line.test.ts @@ -19,13 +19,13 @@ import { FORM_DATA_DEFAULTS, NUM_METRIC, SIMPLE_FILTER } from './shared.helper'; describe('Visualization > Line', () => { - const LINE_CHART_DEFAULTS = { ...FORM_DATA_DEFAULTS, viz_type: 'line' }; - beforeEach(() => { - cy.login(); + cy.preserveLogin(); cy.intercept('POST', '/superset/explore_json/**').as('getJson'); }); + const LINE_CHART_DEFAULTS = { ...FORM_DATA_DEFAULTS, viz_type: 'line' }; + it('should show validator error when no metric', () => { const formData = { ...LINE_CHART_DEFAULTS, metrics: [] }; cy.visitChartByParams(formData); diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/pie.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/pie.test.js index 6c6d33e6e..77f502e17 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/pie.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/pie.test.js @@ -17,6 +17,11 @@ * under the License. */ describe('Visualization > Pie', () => { + beforeEach(() => { + cy.preserveLogin(); + cy.intercept('POST', '/api/v1/chart/data*').as('getJson'); + }); + const PIE_FORM_DATA = { datasource: '3__table', viz_type: 'pie', @@ -41,11 +46,6 @@ describe('Visualization > Pie', () => { cy.verifySliceSuccess({ waitAlias: '@getJson' }); } - beforeEach(() => { - cy.login(); - cy.intercept('POST', '/api/v1/chart/data*').as('getJson'); - }); - it('should work with ad-hoc metric', () => { verify(PIE_FORM_DATA); cy.get('.chart-container .pie canvas').should('have.length', 1); @@ -70,6 +70,8 @@ describe('Visualization > Pie', () => { }); it('should allow type to search color schemes', () => { + verify(PIE_FORM_DATA); + cy.get('#controlSections-tab-display').click(); cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); cy.get('.Control[data-test="color_scheme"] input[type="search"]') diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/pivot_table.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/pivot_table.test.js index ef62beb38..dbf74472a 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/pivot_table.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/pivot_table.test.js @@ -17,6 +17,11 @@ * under the License. */ describe('Visualization > Pivot Table', () => { + beforeEach(() => { + cy.preserveLogin(); + cy.intercept('POST', '/superset/explore_json/**').as('getJson'); + }); + const PIVOT_TABLE_FORM_DATA = { datasource: '3__table', viz_type: 'pivot_table', @@ -58,11 +63,6 @@ describe('Visualization > Pivot Table', () => { cy.verifySliceSuccess({ waitAlias: '@getJson', chartSelector: 'table' }); } - beforeEach(() => { - cy.login(); - cy.intercept('POST', '/superset/explore_json/**').as('getJson'); - }); - it('should work with single groupby', () => { verify(PIVOT_TABLE_FORM_DATA); cy.get('.chart-container tr:eq(0) th:eq(1)').contains('sum__num'); diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/sankey.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/sankey.test.js index fccefecf3..b0da5cd80 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/sankey.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/sankey.test.js @@ -17,6 +17,11 @@ * under the License. */ describe('Visualization > Sankey', () => { + beforeEach(() => { + cy.preserveLogin(); + cy.intercept('POST', '/superset/explore_json/**').as('getJson'); + }); + const SANKEY_FORM_DATA = { datasource: '1__table', viz_type: 'sankey', @@ -37,11 +42,6 @@ describe('Visualization > Sankey', () => { cy.verifySliceSuccess({ waitAlias: '@getJson', chartSelector: 'svg' }); } - beforeEach(() => { - cy.login(); - cy.intercept('POST', '/superset/explore_json/**').as('getJson'); - }); - it('should work', () => { verify(SANKEY_FORM_DATA); cy.get('.chart-container svg g.node rect').should('have.length', 41); @@ -75,6 +75,8 @@ describe('Visualization > Sankey', () => { }); it('should allow type to search color schemes', () => { + verify(SANKEY_FORM_DATA); + cy.get('#controlSections-tab-display').click(); cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); cy.get('.Control[data-test="color_scheme"] input[type="search"]') diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/sunburst.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/sunburst.test.js index 990d1d529..a3e556d59 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/sunburst.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/sunburst.test.js @@ -17,6 +17,11 @@ * under the License. */ describe('Visualization > Sunburst', () => { + beforeEach(() => { + cy.preserveLogin(); + cy.intercept('POST', '/superset/explore_json/**').as('getJson'); + }); + const SUNBURST_FORM_DATA = { datasource: '2__table', viz_type: 'sunburst', @@ -36,11 +41,6 @@ describe('Visualization > Sunburst', () => { cy.verifySliceSuccess({ waitAlias: '@getJson', chartSelector: 'svg' }); } - beforeEach(() => { - cy.login(); - cy.intercept('POST', '/superset/explore_json/**').as('getJson'); - }); - it('should work without secondary metric', () => { verify(SUNBURST_FORM_DATA); // There should be 7 visible arcs + 1 hidden @@ -82,6 +82,8 @@ describe('Visualization > Sunburst', () => { }); it('should allow type to search color schemes', () => { + verify(SUNBURST_FORM_DATA); + cy.get('#controlSections-tab-display').click(); cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); cy.get('.Control[data-test="color_scheme"] input[type="search"]') diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/table.test.ts b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/table.test.ts index f11b23d59..b91df4a45 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/table.test.ts +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/table.test.ts @@ -27,6 +27,11 @@ import { // Table describe('Visualization > Table', () => { + beforeEach(() => { + cy.preserveLogin(); + interceptChart({ legacy: false }).as('chartData'); + }); + const VIZ_DEFAULTS = { ...FORM_DATA_DEFAULTS, viz_type: 'table', @@ -43,11 +48,6 @@ describe('Visualization > Table', () => { optionName: 'metric_6qwzgc8bh2v_zox7hil1mzs', }; - beforeEach(() => { - cy.login(); - interceptChart({ legacy: false }).as('chartData'); - }); - it('Use default time column', () => { cy.visitChartByParams({ ...VIZ_DEFAULTS, diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/time_table.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/time_table.js index eb81d17a3..ef9863a56 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/time_table.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/time_table.js @@ -19,13 +19,13 @@ import { FORM_DATA_DEFAULTS, NUM_METRIC } from './shared.helper'; describe('Visualization > Time TableViz', () => { - const VIZ_DEFAULTS = { ...FORM_DATA_DEFAULTS, viz_type: 'time_table' }; - beforeEach(() => { - cy.login(); + cy.preserveLogin(); cy.intercept('POST', '/superset/explore_json/**').as('getJson'); }); + const VIZ_DEFAULTS = { ...FORM_DATA_DEFAULTS, viz_type: 'time_table' }; + it('Test time series table multiple metrics last year total', () => { const formData = { ...VIZ_DEFAULTS, diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/treemap.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/treemap.test.js index efd92a3e4..9b7ea9819 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/treemap.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/treemap.test.js @@ -17,6 +17,11 @@ * under the License. */ describe('Visualization > Treemap', () => { + beforeEach(() => { + cy.preserveLogin(); + cy.intercept('POST', '/superset/explore_json/**').as('getJson'); + }); + const TREEMAP_FORM_DATA = { datasource: '2__table', viz_type: 'treemap', @@ -42,11 +47,6 @@ describe('Visualization > Treemap', () => { cy.verifySliceSuccess({ waitAlias: '@getJson', chartSelector: 'svg' }); } - beforeEach(() => { - cy.login(); - cy.intercept('POST', '/superset/explore_json/**').as('getJson'); - }); - it('should work', () => { verify(TREEMAP_FORM_DATA); cy.get(level0).should('have.length', 1); @@ -82,6 +82,8 @@ describe('Visualization > Treemap', () => { }); it('should allow type to search color schemes and apply the scheme', () => { + verify(TREEMAP_FORM_DATA); + cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); cy.get('.Control[data-test="color_scheme"] input[type="search"]') .focus() diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/world_map.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/world_map.test.js index 8faa4e412..4afb5f54f 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/world_map.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/world_map.test.js @@ -17,6 +17,11 @@ * under the License. */ describe('Visualization > World Map', () => { + beforeEach(() => { + cy.preserveLogin(); + cy.intercept('POST', '/superset/explore_json/**').as('getJson'); + }); + const WORLD_MAP_FORM_DATA = { datasource: '2__table', viz_type: 'world_map', @@ -39,11 +44,6 @@ describe('Visualization > World Map', () => { cy.verifySliceSuccess({ waitAlias: '@getJson', chartSelector: 'svg' }); } - beforeEach(() => { - cy.login(); - cy.intercept('POST', '/superset/explore_json/**').as('getJson'); - }); - it('should work with ad-hoc metric', () => { verify(WORLD_MAP_FORM_DATA); cy.get('.bubbles circle.datamaps-bubble').should('have.length', 206); @@ -82,6 +82,8 @@ describe('Visualization > World Map', () => { }); it('should allow type to search color schemes', () => { + verify(WORLD_MAP_FORM_DATA); + cy.get('.Control[data-test="linear_color_scheme"]').scrollIntoView(); cy.get('.Control[data-test="linear_color_scheme"] input[type="search"]') .focus() diff --git a/superset/examples/supported_charts_dashboard.py b/superset/examples/supported_charts_dashboard.py index 8d0b3570e..aa4f404cc 100644 --- a/superset/examples/supported_charts_dashboard.py +++ b/superset/examples/supported_charts_dashboard.py @@ -171,18 +171,6 @@ def create_slices(tbl: SqlaTable) -> List[Slice]: groupby=["gender"], ), ), - # TODO: use a different dataset for world map - Slice( - **slice_props, - slice_name="World Map", - viz_type="world_map", - params=get_slice_json( - defaults, - viz_type="world_map", - metric="sum__num", - entity="gender", - ), - ), # --------------------- # TIER 2 # --------------------- @@ -673,7 +661,7 @@ def load_supported_charts_dashboard() -> None: "meta": { "chartId": 11, "height": 50, - "sliceName": "World Map", + "sliceName": "% Rural", "width": 4 }, "type": "CHART"