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/28 13:37:38 UTC
[superset] branch chore/color-consistency-e2e updated: Enhance tests
This is an automated email from the ASF dual-hosted git repository.
diegopucci pushed a commit to branch chore/color-consistency-e2e
in repository https://gitbox.apache.org/repos/asf/superset.git
The following commit(s) were added to refs/heads/chore/color-consistency-e2e by this push:
new 1e9a8d83d7 Enhance tests
1e9a8d83d7 is described below
commit 1e9a8d83d714118da4550eca3c4616aa826047e3
Author: geido <di...@gmail.com>
AuthorDate: Wed Sep 28 16:36:54 2022 +0300
Enhance tests
---
.../cypress/integration/dashboard/editmode.test.ts | 183 ++++++++++++---------
.../cypress/integration/dashboard/utils.ts | 9 +
2 files changed, 118 insertions(+), 74 deletions(-)
diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard/editmode.test.ts b/superset-frontend/cypress-base/cypress/integration/dashboard/editmode.test.ts
index 13c6b53947..d93eea9950 100644
--- a/superset-frontend/cypress-base/cypress/integration/dashboard/editmode.test.ts
+++ b/superset-frontend/cypress-base/cypress/integration/dashboard/editmode.test.ts
@@ -19,7 +19,7 @@
import { SAMPLE_DASHBOARD_1, TABBED_DASHBOARD } from 'cypress/utils/urls';
import { drag, resize, waitForChartLoad } from 'cypress/utils';
import * as ace from 'brace';
-import { interceptGet, interceptUpdate } from './utils';
+import { interceptGet, interceptUpdate, openTab } from './utils';
import { interceptFiltering as interceptCharts } from '../explore/utils';
function editDashboard() {
@@ -158,6 +158,100 @@ describe('Dashboard edit', () => {
resetTabbedDashboard();
});
+ it('should respect chart color scheme when none is set for the dashboard', () => {
+ openProperties();
+ cy.get('[aria-label="Select color scheme"]').should('have.value', '');
+ applyChanges();
+ saveChanges();
+
+ // open nested tab
+ openTab(1, 1);
+ waitForChartLoad({
+ name: 'Top 10 California Names Timeseries',
+ viz: 'line',
+ });
+
+ // label Anthony
+ cy.get('.line .nv-legend-symbol')
+ .first()
+ .should('have.css', 'fill', 'rgb(31, 168, 201)');
+ });
+
+ it('should apply same color to same labels', () => {
+ openProperties();
+ selectColorScheme('lyftColors');
+ applyChanges();
+ saveChanges();
+
+ // open nested tab
+ openTab(1, 1);
+ waitForChartLoad({
+ name: 'Top 10 California Names Timeseries',
+ viz: 'line',
+ });
+
+ // label Anthony
+ cy.get('.line .nv-legend-symbol')
+ .first()
+ .should('have.css', 'fill', 'rgb(234, 11, 140)');
+
+ // open 2nd main tab
+ openTab(0, 1);
+ waitForChartLoad({ name: 'Trends', viz: 'line' });
+
+ // label Anthony
+ cy.get('.line .nv-legend-symbol')
+ .eq(2)
+ .should('have.css', 'fill', 'rgb(234, 11, 140)');
+ });
+
+ it('should change color scheme multiple times', () => {
+ openProperties();
+ selectColorScheme('lyftColors');
+ applyChanges();
+ saveChanges();
+
+ // open nested tab
+ openTab(1, 1);
+ waitForChartLoad({
+ name: 'Top 10 California Names Timeseries',
+ viz: 'line',
+ });
+
+ // label Anthony
+ cy.get('.line .nv-legend-symbol')
+ .first()
+ .should('have.css', 'fill', 'rgb(234, 11, 140)');
+
+ // open 2nd main tab
+ openTab(0, 1);
+ waitForChartLoad({ name: 'Trends', viz: 'line' });
+
+ // label Anthony
+ cy.get('.line .nv-legend-symbol')
+ .eq(2)
+ .should('have.css', 'fill', 'rgb(234, 11, 140)');
+
+ openProperties();
+ selectColorScheme('bnbColors');
+ applyChanges();
+ saveChanges();
+
+ // label Anthony
+ cy.get('.line .nv-legend-symbol')
+ .eq(2)
+ .should('have.css', 'fill', 'rgb(0, 122, 135)');
+
+ // open main tab and nested tab
+ openTab(0, 0);
+ openTab(1, 1);
+
+ // label Anthony
+ cy.get('.line .nv-legend-symbol')
+ .first()
+ .should('have.css', 'fill', 'rgb(0, 122, 135)');
+ });
+
it('should apply the color scheme across main tabs', () => {
openProperties();
selectColorScheme('lyftColors');
@@ -171,11 +265,7 @@ describe('Dashboard edit', () => {
);
// go to second tab
- cy.getBySel('dashboard-component-tabs')
- .eq(0)
- .find('[role="tab"]')
- .eq(1)
- .click();
+ openTab(0, 1);
waitForChartLoad({ name: 'Trends', viz: 'line' });
cy.get('.line .nv-legend-symbol')
@@ -197,11 +287,7 @@ describe('Dashboard edit', () => {
);
// go to second tab
- cy.getBySel('dashboard-component-tabs')
- .eq(0)
- .find('[role="tab"]')
- .eq(1)
- .click();
+ openTab(0, 1);
waitForChartLoad({ name: 'Trends', viz: 'line' });
cy.get('.line .nv-legend-symbol')
@@ -209,11 +295,7 @@ describe('Dashboard edit', () => {
.should('have.css', 'fill', 'rgb(255, 90, 95)');
// go back to first tab
- cy.getBySel('dashboard-component-tabs')
- .eq(0)
- .find('[role="tab"]')
- .eq(0)
- .click();
+ openTab(0, 0);
// change scheme now that charts are rendered across the main tabs
editDashboard();
@@ -229,11 +311,7 @@ describe('Dashboard edit', () => {
);
// go to second tab again
- cy.getBySel('dashboard-component-tabs')
- .eq(0)
- .find('[role="tab"]')
- .eq(1)
- .click();
+ openTab(0, 1);
cy.get('.line .nv-legend-symbol')
.first()
@@ -252,11 +330,7 @@ describe('Dashboard edit', () => {
);
// open nested tab
- cy.getBySel('dashboard-component-tabs')
- .eq(1)
- .find('[role="tab"]')
- .eq(1)
- .click();
+ openTab(1, 1);
waitForChartLoad({
name: 'Top 10 California Names Timeseries',
viz: 'line',
@@ -266,11 +340,7 @@ describe('Dashboard edit', () => {
.should('have.css', 'fill', 'rgb(234, 11, 140)');
// open another nested tab
- cy.getBySel('dashboard-component-tabs')
- .eq(2)
- .find('[role="tab"]')
- .eq(1)
- .click();
+ openTab(2, 1);
waitForChartLoad({ name: 'Growth Rate', viz: 'line' });
cy.get('.line .nv-legend-symbol')
.first()
@@ -288,11 +358,7 @@ describe('Dashboard edit', () => {
saveChanges();
// open nested tab
- cy.getBySel('dashboard-component-tabs')
- .eq(1)
- .find('[role="tab"]')
- .eq(1)
- .click();
+ openTab(1, 1);
waitForChartLoad({
name: 'Top 10 California Names Timeseries',
viz: 'line',
@@ -302,11 +368,7 @@ describe('Dashboard edit', () => {
.should('have.css', 'fill', 'rgb(255, 0, 0)');
// open another nested tab
- cy.getBySel('dashboard-component-tabs')
- .eq(2)
- .find('[role="tab"]')
- .eq(1)
- .click();
+ openTab(2, 1);
waitForChartLoad({ name: 'Growth Rate', viz: 'line' });
cy.get('.line .nv-legend-symbol')
.first()
@@ -315,34 +377,21 @@ describe('Dashboard edit', () => {
it('should apply a valid color scheme for rendered charts in nested tabs', () => {
// open the tab first time and let chart load
- cy.getBySel('dashboard-component-tabs')
- .eq(1)
- .find('[role="tab"]')
- .eq(1)
- .click();
+ openTab(1, 1);
waitForChartLoad({
name: 'Top 10 California Names Timeseries',
viz: 'line',
});
// go to previous tab
- cy.getBySel('dashboard-component-tabs')
- .eq(1)
- .find('[role="tab"]')
- .eq(0)
- .click();
-
+ openTab(1, 0);
openProperties();
selectColorScheme('lyftColors');
applyChanges();
saveChanges();
// re-open the tab
- cy.getBySel('dashboard-component-tabs')
- .eq(1)
- .find('[role="tab"]')
- .eq(1)
- .click();
+ openTab(1, 1);
cy.get('.line .nv-legend-symbol')
.first()
@@ -351,23 +400,14 @@ describe('Dashboard edit', () => {
it('label colors should take the precedence for rendered charts in nested tabs', () => {
// open the tab first time and let chart load
- cy.getBySel('dashboard-component-tabs')
- .eq(1)
- .find('[role="tab"]')
- .eq(1)
- .click();
+ openTab(1, 1);
waitForChartLoad({
name: 'Top 10 California Names Timeseries',
viz: 'line',
});
// go to previous tab
- cy.getBySel('dashboard-component-tabs')
- .eq(1)
- .find('[role="tab"]')
- .eq(0)
- .click();
-
+ openTab(1, 0);
openProperties();
openAdvancedProperties();
clearMetadata();
@@ -378,12 +418,7 @@ describe('Dashboard edit', () => {
saveChanges();
// re-open the tab
- cy.getBySel('dashboard-component-tabs')
- .eq(1)
- .find('[role="tab"]')
- .eq(1)
- .click();
-
+ openTab(1, 1);
cy.get('.line .nv-legend-symbol')
.first()
.should('have.css', 'fill', 'rgb(255, 0, 0)');
diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard/utils.ts b/superset-frontend/cypress-base/cypress/integration/dashboard/utils.ts
index f633cae9b2..a7b62189db 100644
--- a/superset-frontend/cypress-base/cypress/integration/dashboard/utils.ts
+++ b/superset-frontend/cypress-base/cypress/integration/dashboard/utils.ts
@@ -476,3 +476,12 @@ export function addCountryNameFilter() {
testItems.topTenChart.filterColumn,
);
}
+
+export function openTab(tabComponentIndex: number, tabIndex: number) {
+ return cy
+ .getBySel('dashboard-component-tabs')
+ .eq(tabComponentIndex)
+ .find('[role="tab"]')
+ .eq(tabIndex)
+ .click();
+}