iop
/
superset
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

chore: E2E tests for Drill to Detail supported Charts (#21681)

This commit is contained in:
Geido 2022-10-05 19:54:51 +03:00 committed by GitHub
parent b6891aaa9f
commit 7b66e0bb34
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
24 changed files with 489 additions and 206 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
superset-frontend/cypress-base/cypress/downloads/new-chart-2022-09-09T14-22-31.728Z.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 16 KiB

420
superset-frontend/cypress-base/cypress/integration/dashboard/drilltodetail.test.ts
View File

@ -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');
});
});
});

3
superset-frontend/cypress-base/cypress/integration/dashboard/nativeFilters.test.ts
View File

@ -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;

12
superset-frontend/cypress-base/cypress/integration/explore/visualizations/area.test.js
View File

@ -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"]')

10
superset-frontend/cypress-base/cypress/integration/explore/visualizations/big_number.test.js
View File

@ -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');

10
superset-frontend/cypress-base/cypress/integration/explore/visualizations/big_number_total.test.js
View File

@ -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 };

12
superset-frontend/cypress-base/cypress/integration/explore/visualizations/box_plot.test.js
View File

@ -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"]')

34
superset-frontend/cypress-base/cypress/integration/explore/visualizations/bubble.test.js
View File

@ -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()

12
superset-frontend/cypress-base/cypress/integration/explore/visualizations/compare.test.js
View File

@ -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"]')

21
superset-frontend/cypress-base/cypress/integration/explore/visualizations/dist_bar.test.js
View File

@ -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"]')

12
superset-frontend/cypress-base/cypress/integration/explore/visualizations/dual_line.test.js
View File

@ -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"]')

19
superset-frontend/cypress-base/cypress/integration/explore/visualizations/gauge.test.js
View File

@ -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"]')

12
superset-frontend/cypress-base/cypress/integration/explore/visualizations/graph.test.ts
View File

@ -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"]')

12
superset-frontend/cypress-base/cypress/integration/explore/visualizations/histogram.test.ts
View File

@ -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"]')

6
superset-frontend/cypress-base/cypress/integration/explore/visualizations/line.test.ts
View File

@ -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);

12
superset-frontend/cypress-base/cypress/integration/explore/visualizations/pie.test.js
View File

@ -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"]')

10
superset-frontend/cypress-base/cypress/integration/explore/visualizations/pivot_table.test.js
View File

@ -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');

12
superset-frontend/cypress-base/cypress/integration/explore/visualizations/sankey.test.js
View File

@ -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"]')

12
superset-frontend/cypress-base/cypress/integration/explore/visualizations/sunburst.test.js
View File

@ -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"]')

10
superset-frontend/cypress-base/cypress/integration/explore/visualizations/table.test.ts
View File

@ -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,

6
superset-frontend/cypress-base/cypress/integration/explore/visualizations/time_table.js
View File

@ -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,

12
superset-frontend/cypress-base/cypress/integration/explore/visualizations/treemap.test.js
View File

@ -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()

12
superset-frontend/cypress-base/cypress/integration/explore/visualizations/world_map.test.js
View File

@ -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()

14
superset/examples/supported_charts_dashboard.py
View File

@ -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"