You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by di...@apache.org on 2022/09/02 16:55:15 UTC
[superset] 02/05: Enhance dashboard load tests
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 <di...@gmail.com>
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