This is an automated email from the ASF dual-hosted git repository. diegopucci pushed a commit to branch chore/cypress-runtime-enhancements in repository https://gitbox.apache.org/repos/asf/superset.git
commit c95faa2ad2ab4783098e6fab864d0bee5b27821a Author: geido <[email protected]> AuthorDate: Thu Sep 1 15:54:37 2022 +0300 Enhance dashboard load tests --- .../cypress/integration/dashboard/controls.test.ts | 6 +- .../dashboard/dashboard.applitools.test.ts | 8 +-- .../integration/dashboard/dashboard.helper.ts | 70 ---------------------- .../integration/dashboard/edit_mode.test.js | 3 +- .../cypress/integration/dashboard/fav_star.test.js | 3 +- .../cypress/integration/dashboard/filter.test.ts | 6 +- .../integration/dashboard/key_value.test.ts | 6 +- .../cypress/integration/dashboard/load.test.ts | 21 ++++--- .../integration/dashboard/nativeFilters.test.ts | 7 ++- .../cypress/integration/dashboard/save.test.js | 6 +- .../integration/dashboard/url_params.test.ts | 7 ++- .../cypress/integration/dashboard/utils.ts | 18 ++++++ .../cypress-base/cypress/utils/index.ts | 58 +++++++++++++++++- .../cypress-base/cypress/utils/urls.ts | 1 + 14 files changed, 115 insertions(+), 105 deletions(-) diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard/controls.test.ts b/superset-frontend/cypress-base/cypress/integration/dashboard/controls.test.ts index 961e71bfd6..3c772fdca9 100644 --- a/superset-frontend/cypress-base/cypress/integration/dashboard/controls.test.ts +++ b/superset-frontend/cypress-base/cypress/integration/dashboard/controls.test.ts @@ -17,12 +17,12 @@ * under the License. */ import { - WORLD_HEALTH_CHARTS, - WORLD_HEALTH_DASHBOARD, waitForChartLoad, ChartSpec, getChartAliasesBySpec, -} from './dashboard.helper'; +} from 'cypress/utils'; +import { WORLD_HEALTH_CHARTS } from './utils'; +import { WORLD_HEALTH_DASHBOARD } from 'cypress/utils/urls'; import { isLegacyResponse } from '../../utils/vizPlugins'; describe('Dashboard top-level controls', () => { diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard/dashboard.applitools.test.ts b/superset-frontend/cypress-base/cypress/integration/dashboard/dashboard.applitools.test.ts index d492175a5e..a604ada58a 100644 --- a/superset-frontend/cypress-base/cypress/integration/dashboard/dashboard.applitools.test.ts +++ b/superset-frontend/cypress-base/cypress/integration/dashboard/dashboard.applitools.test.ts @@ -16,11 +16,9 @@ * specific language governing permissions and limitations * under the License. */ -import { - waitForChartLoad, - WORLD_HEALTH_CHARTS, - WORLD_HEALTH_DASHBOARD, -} from './dashboard.helper'; +import { WORLD_HEALTH_CHARTS } from './utils'; +import { WORLD_HEALTH_DASHBOARD } from 'cypress/utils/urls'; +import { waitForChartLoad } from 'cypress/utils'; describe('Dashboard load', () => { beforeEach(() => { diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard/dashboard.helper.ts b/superset-frontend/cypress-base/cypress/integration/dashboard/dashboard.helper.ts index 486833c72b..39b7fc40c2 100644 --- a/superset-frontend/cypress-base/cypress/integration/dashboard/dashboard.helper.ts +++ b/superset-frontend/cypress-base/cypress/integration/dashboard/dashboard.helper.ts @@ -1,4 +1,3 @@ -import { getChartAlias, Slice } from 'cypress/utils/vizPlugins'; import { dashboardView } from 'cypress/support/directories'; /** @@ -19,7 +18,6 @@ import { dashboardView } from 'cypress/support/directories'; * specific language governing permissions and limitations * under the License. */ -export const WORLD_HEALTH_DASHBOARD = '/superset/dashboard/world_health/'; export const USA_BIRTH_NAMES_DASHBOARD = '/superset/dashboard/births/'; export const testDashboard = '/superset/dashboard/538/'; export const TABBED_DASHBOARD = '/superset/dashboard/tabbed_dash/'; @@ -61,19 +59,6 @@ export const testItems = { export const CHECK_DASHBOARD_FAVORITE_ENDPOINT = '/superset/favstar/Dashboard/*/count'; -export const WORLD_HEALTH_CHARTS = [ - { name: '% Rural', viz: 'world_map' }, - { name: 'Most Populated Countries', viz: 'table' }, - { name: 'Region Filter', viz: 'filter_box' }, - { name: "World's Population", viz: 'big_number' }, - { name: 'Growth Rate', viz: 'line' }, - { name: 'Rural Breakdown', viz: 'sunburst' }, - { name: "World's Pop Growth", viz: 'area' }, - { name: 'Life Expectancy VS Rural %', viz: 'bubble' }, - { name: 'Treemap', viz: 'treemap' }, - { name: 'Box plot', viz: 'box_plot' }, -] as const; - export const ECHARTS_CHARTS = [ { name: 'Number of Girls', viz: 'big_number_total' }, { name: 'Participants', viz: 'big_number' }, @@ -82,61 +67,6 @@ export const ECHARTS_CHARTS = [ { name: 'Energy Force Layout', viz: 'graph_chart' }, ] as const; -/** Used to specify charts expected by the test suite */ -export interface ChartSpec { - name: string; - viz: string; -} - -export function getChartGridComponent({ name, viz }: ChartSpec) { - return cy - .get(`[data-test-chart-name="${name}"]`) - .should('have.attr', 'data-test-viz-type', viz); -} - -export function waitForChartLoad(chart: ChartSpec) { - return getChartGridComponent(chart).then(gridComponent => { - const chartId = gridComponent.attr('data-test-chart-id'); - // the chart should load in under half a minute - return ( - cy - // this id only becomes visible when the chart is loaded - .get(`#chart-id-${chartId}`, { - timeout: 30000, - }) - .should('be.visible') - // return the chart grid component - .then(() => gridComponent) - ); - }); -} - -const toSlicelike = ($chart: JQuery<HTMLElement>): Slice => ({ - slice_id: parseInt($chart.attr('data-test-chart-id')!, 10), - form_data: { - viz_type: $chart.attr('data-test-viz-type')!, - }, -}); - -export function getChartAliasBySpec(chart: ChartSpec) { - return getChartGridComponent(chart).then($chart => - cy.wrap(getChartAlias(toSlicelike($chart))), - ); -} - -export function getChartAliasesBySpec(charts: readonly ChartSpec[]) { - const aliases: string[] = []; - charts.forEach(chart => - getChartAliasBySpec(chart).then(alias => { - aliases.push(alias); - }), - ); - // Wrapping the aliases is key. - // That way callers can chain off this function - // and actually get the list of aliases. - return cy.wrap(aliases); -} - /** * Drag an element and drop it to another element. * Usage: diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard/edit_mode.test.js b/superset-frontend/cypress-base/cypress/integration/dashboard/edit_mode.test.js index 10b8a4a40d..0f646cce3d 100644 --- a/superset-frontend/cypress-base/cypress/integration/dashboard/edit_mode.test.js +++ b/superset-frontend/cypress-base/cypress/integration/dashboard/edit_mode.test.js @@ -16,7 +16,8 @@ * specific language governing permissions and limitations * under the License. */ -import { WORLD_HEALTH_DASHBOARD, drag } from './dashboard.helper'; +import { drag } from './dashboard.helper'; +import { WORLD_HEALTH_DASHBOARD } from 'cypress/utils/urls'; describe('Dashboard edit mode', () => { beforeEach(() => { diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard/fav_star.test.js b/superset-frontend/cypress-base/cypress/integration/dashboard/fav_star.test.js index a20b1eb3f5..9b527a4c7a 100644 --- a/superset-frontend/cypress-base/cypress/integration/dashboard/fav_star.test.js +++ b/superset-frontend/cypress-base/cypress/integration/dashboard/fav_star.test.js @@ -17,10 +17,11 @@ * under the License. */ import { - WORLD_HEALTH_DASHBOARD, CHECK_DASHBOARD_FAVORITE_ENDPOINT, } from './dashboard.helper'; +import { WORLD_HEALTH_DASHBOARD } from 'cypress/utils/urls'; + describe('Dashboard add to favorite', () => { let isFavoriteDashboard = false; diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard/filter.test.ts b/superset-frontend/cypress-base/cypress/integration/dashboard/filter.test.ts index e1dd45cf3c..389c181cba 100644 --- a/superset-frontend/cypress-base/cypress/integration/dashboard/filter.test.ts +++ b/superset-frontend/cypress-base/cypress/integration/dashboard/filter.test.ts @@ -18,11 +18,11 @@ */ import { isLegacyResponse, parsePostForm } from 'cypress/utils'; import { - WORLD_HEALTH_CHARTS, - WORLD_HEALTH_DASHBOARD, getChartAliasesBySpec, waitForChartLoad, -} from './dashboard.helper'; +} from 'cypress/utils'; +import {WORLD_HEALTH_CHARTS } from './utils'; +import { WORLD_HEALTH_DASHBOARD } from 'cypress/utils/urls'; describe('Dashboard filter', () => { before(() => { diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard/key_value.test.ts b/superset-frontend/cypress-base/cypress/integration/dashboard/key_value.test.ts index 1738ea5bd3..42ac6cf7c7 100644 --- a/superset-frontend/cypress-base/cypress/integration/dashboard/key_value.test.ts +++ b/superset-frontend/cypress-base/cypress/integration/dashboard/key_value.test.ts @@ -18,10 +18,10 @@ */ import qs from 'querystringify'; import { - WORLD_HEALTH_DASHBOARD, - WORLD_HEALTH_CHARTS, waitForChartLoad, -} from './dashboard.helper'; +} from 'cypress/utils'; +import {WORLD_HEALTH_CHARTS} from './utils'; +import { WORLD_HEALTH_DASHBOARD } from 'cypress/utils/urls'; interface QueryString { native_filters_key: string; diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard/load.test.ts b/superset-frontend/cypress-base/cypress/integration/dashboard/load.test.ts index 9fb84f70c9..f1c374b158 100644 --- a/superset-frontend/cypress-base/cypress/integration/dashboard/load.test.ts +++ b/superset-frontend/cypress-base/cypress/integration/dashboard/load.test.ts @@ -16,17 +16,19 @@ * specific language governing permissions and limitations * under the License. */ -import { - waitForChartLoad, - WORLD_HEALTH_CHARTS, - WORLD_HEALTH_DASHBOARD, -} from './dashboard.helper'; +import { WORLD_HEALTH_CHARTS, interceptLog } from './utils'; +import { WORLD_HEALTH_DASHBOARD } from 'cypress/utils/urls'; +import { waitForChartLoad } from 'cypress/utils'; describe('Dashboard load', () => { - beforeEach(() => { + before(() => { cy.login(); }); + beforeEach(() => { + cy.preserveLogin(); + }); + it('should load dashboard', () => { cy.visit(WORLD_HEALTH_DASHBOARD); WORLD_HEALTH_CHARTS.forEach(waitForChartLoad); @@ -34,7 +36,7 @@ describe('Dashboard load', () => { it('should load in edit mode', () => { cy.visit(`${WORLD_HEALTH_DASHBOARD}?edit=true&standalone=true`); - cy.get('[data-test="discard-changes-button"]').should('be.visible'); + cy.getBySel('discard-changes-button').should('be.visible'); }); it('should load in standalone mode', () => { @@ -44,12 +46,13 @@ describe('Dashboard load', () => { it('should load in edit/standalone mode', () => { cy.visit(`${WORLD_HEALTH_DASHBOARD}?edit=true&standalone=true`); - cy.get('[data-test="discard-changes-button"]').should('be.visible'); + cy.getBySel('discard-changes-button').should('be.visible'); cy.get('#app-menu').should('not.exist'); }); it('should send log data', () => { + interceptLog(); cy.visit(WORLD_HEALTH_DASHBOARD); - cy.intercept('/superset/log/?explode=events&dashboard_id=*'); + cy.wait('@logs'); }); }); 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 d63478ca6b..024f7b6fa3 100644 --- a/superset-frontend/cypress-base/cypress/integration/dashboard/nativeFilters.test.ts +++ b/superset-frontend/cypress-base/cypress/integration/dashboard/nativeFilters.test.ts @@ -27,10 +27,11 @@ import { cleanUp, copyTestDashboard, testItems, - waitForChartLoad, - WORLD_HEALTH_DASHBOARD, - WORLD_HEALTH_CHARTS, } from './dashboard.helper'; +import { waitForChartLoad } from 'cypress/utils'; +import {WORLD_HEALTH_CHARTS} from './utils'; +import { WORLD_HEALTH_DASHBOARD } from 'cypress/utils/urls'; + import { addCountryCodeFilter, addCountryNameFilter, diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard/save.test.js b/superset-frontend/cypress-base/cypress/integration/dashboard/save.test.js index 419346cf98..07be4ef626 100644 --- a/superset-frontend/cypress-base/cypress/integration/dashboard/save.test.js +++ b/superset-frontend/cypress-base/cypress/integration/dashboard/save.test.js @@ -20,9 +20,9 @@ import shortid from 'shortid'; import { waitForChartLoad, - WORLD_HEALTH_CHARTS, - WORLD_HEALTH_DASHBOARD, -} from './dashboard.helper'; +} from 'cypress/utils'; +import { WORLD_HEALTH_CHARTS } from './utils'; +import { WORLD_HEALTH_DASHBOARD } from 'cypress/utils/urls'; function openDashboardEditProperties() { // open dashboard properties edit modal diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard/url_params.test.ts b/superset-frontend/cypress-base/cypress/integration/dashboard/url_params.test.ts index 5f9ad7382e..c5b4c6655f 100644 --- a/superset-frontend/cypress-base/cypress/integration/dashboard/url_params.test.ts +++ b/superset-frontend/cypress-base/cypress/integration/dashboard/url_params.test.ts @@ -18,10 +18,11 @@ */ import { parsePostForm, JsonObject } from 'cypress/utils'; import { - WORLD_HEALTH_DASHBOARD, - WORLD_HEALTH_CHARTS, waitForChartLoad, -} from './dashboard.helper'; +} from 'cypress/utils'; + +import { WORLD_HEALTH_CHARTS } from './utils'; +import { WORLD_HEALTH_DASHBOARD } from 'cypress/utils/urls'; describe('Dashboard form data', () => { const urlParams = { param1: '123', param2: 'abc' }; diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard/utils.ts b/superset-frontend/cypress-base/cypress/integration/dashboard/utils.ts index 645c24dff1..b4d2dd3100 100644 --- a/superset-frontend/cypress-base/cypress/integration/dashboard/utils.ts +++ b/superset-frontend/cypress-base/cypress/integration/dashboard/utils.ts @@ -17,6 +17,19 @@ * under the License. */ + export const WORLD_HEALTH_CHARTS = [ + { name: '% Rural', viz: 'world_map' }, + { name: 'Most Populated Countries', viz: 'table' }, + { name: 'Region Filter', viz: 'filter_box' }, + { name: "World's Population", viz: 'big_number' }, + { name: 'Growth Rate', viz: 'line' }, + { name: 'Rural Breakdown', viz: 'sunburst' }, + { name: "World's Pop Growth", viz: 'area' }, + { name: 'Life Expectancy VS Rural %', viz: 'bubble' }, + { name: 'Treemap', viz: 'treemap' }, + { name: 'Box plot', viz: 'box_plot' }, + ] as const; + export function interceptFiltering() { cy.intercept('GET', `/api/v1/dashboard/?q=*`).as('filtering'); } @@ -37,6 +50,10 @@ export function interceptPost() { cy.intercept('POST', `/api/v1/dashboard/`).as('post'); } +export function interceptLog() { + cy.intercept('/superset/log/?explode=events&dashboard_id=*').as('logs'); +} + export function setFilter(filter: string, option: string) { interceptFiltering(); @@ -45,3 +62,4 @@ export function setFilter(filter: string, option: string) { cy.wait('@filtering'); } + diff --git a/superset-frontend/cypress-base/cypress/utils/index.ts b/superset-frontend/cypress-base/cypress/utils/index.ts index 796f32a765..3bdbb0f122 100644 --- a/superset-frontend/cypress-base/cypress/utils/index.ts +++ b/superset-frontend/cypress-base/cypress/utils/index.ts @@ -16,8 +16,14 @@ * specific language governing permissions and limitations * under the License. */ +import { getChartAlias, Slice } from 'cypress/utils/vizPlugins'; + export * from './vizPlugins'; export { default as parsePostForm } from './parsePostForm'; +export interface ChartSpec { + name: string; + viz: string; + } export function setGridMode(type: 'card' | 'list') { cy.get(`[aria-label="${type}-view"]`).click(); @@ -29,4 +35,54 @@ export function toggleBulkSelect() { export function clearAllInputs() { cy.get('[aria-label="close-circle"]').click({ multiple: true, force: true }); -} \ No newline at end of file +} + + const toSlicelike = ($chart: JQuery<HTMLElement>): Slice => ({ + slice_id: parseInt($chart.attr('data-test-chart-id')!, 10), + form_data: { + viz_type: $chart.attr('data-test-viz-type')!, + }, + }); + + export function getChartAliasBySpec(chart: ChartSpec) { + return getChartGridComponent(chart).then($chart => + cy.wrap(getChartAlias(toSlicelike($chart))), + ); + } + + export function getChartAliasesBySpec(charts: readonly ChartSpec[]) { + const aliases: string[] = []; + charts.forEach(chart => + getChartAliasBySpec(chart).then(alias => { + aliases.push(alias); + }), + ); + // Wrapping the aliases is key. + // That way callers can chain off this function + // and actually get the list of aliases. + return cy.wrap(aliases); + } + +export function getChartGridComponent({ name, viz }: ChartSpec) { + return cy + .get(`[data-test-chart-name="${name}"]`) + .should('have.attr', 'data-test-viz-type', viz); + } + +export function waitForChartLoad(chart: ChartSpec) { + return getChartGridComponent(chart).then(gridComponent => { + const chartId = gridComponent.attr('data-test-chart-id'); + // the chart should load in under half a minute + return ( + cy + // this id only becomes visible when the chart is loaded + .get(`#chart-id-${chartId}`, { + timeout: 30000, + }) + .should('be.visible') + // return the chart grid component + .then(() => gridComponent) + ); + }); + } + diff --git a/superset-frontend/cypress-base/cypress/utils/urls.ts b/superset-frontend/cypress-base/cypress/utils/urls.ts index 124046b826..2f3cc4d56c 100644 --- a/superset-frontend/cypress-base/cypress/utils/urls.ts +++ b/superset-frontend/cypress-base/cypress/utils/urls.ts @@ -19,3 +19,4 @@ export const DASHBOARD_LIST = '/dashboard/list/'; export const CHART_LIST = '/chart/list/'; +export const WORLD_HEALTH_DASHBOARD = '/superset/dashboard/world_health/'; \ No newline at end of file
