QT/superset2
1
0
Fork 0
mirror of https://github.com/apache/superset.git synced 2026-04-20 00:24:38 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: color collision in dashboard with tabs (#24670)

Browse Source
This commit is contained in:
Lily Kuang
2023-07-14 12:13:49 -07:00
committed by GitHub
parent 65fb8e10ba
commit 0328dd2704
3 changed files with 30 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
superset-frontend/cypress-base/cypress/e2e/dashboard/editmode.test.ts
View File

@@ -422,17 +422,17 @@ describe('Dashboard edit', () => {
'[data-test-chart-name="Top 10 California Names Timeseries"] .line .nv-legend-symbol',
)
.first()
.should('have.css', 'fill', 'rgb(252, 199, 0)');
.should('have.css', 'fill', 'rgb(69, 78, 124)');
cy.get(
'[data-test-chart-name="Top 10 California Names Timeseries"] .line .nv-legend-symbol',
)
.eq(1)
.should('have.css', 'fill', 'rgb(143, 211, 228)');
.should('have.css', 'fill', 'rgb(224, 67, 85)');
cy.get(
'[data-test-chart-name="Top 10 California Names Timeseries"] .line .nv-legend-symbol',
)
.eq(2)
.should('have.css', 'fill', 'rgb(172, 225, 196)');
.should('have.css', 'fill', 'rgb(163, 143, 121)');
});
it('should show the same colors in Explore', () => {
@@ -463,7 +463,7 @@ describe('Dashboard edit', () => {
'[data-test-chart-name="Top 10 California Names Timeseries"] .line .nv-legend-symbol',
)
.eq(1)
.should('have.css', 'fill', 'rgb(51, 61, 71)');
.should('have.css', 'fill', 'rgb(172, 32, 119)');
openExplore('Top 10 California Names Timeseries');
@@ -474,7 +474,7 @@ describe('Dashboard edit', () => {
// label Christopher
cy.get('[data-test="chart-container"] .line .nv-legend-symbol')
.eq(1)
.should('have.css', 'fill', 'rgb(108, 131, 142)');
.should('have.css', 'fill', 'rgb(172, 32, 119)');
});
it('should change color scheme multiple times', () => {

13
superset-frontend/packages/superset-ui-core/src/color/CategoricalColorScale.ts
View File

@@ -78,15 +78,20 @@ class CategoricalColorScale extends ExtensibleFunction {
cleanedValue: string,
) {
// make sure we don't overwrite the origin colors
const updatedRange = [...this.originColors];
const updatedRange = new Set(this.originColors);
// remove the color option from shared color
sharedColorMap.forEach((value: string, key: string) => {
if (key !== cleanedValue) {
const index = updatedRange.indexOf(value);
updatedRange.splice(index, 1);
updatedRange.delete(value);
}
});
this.range(updatedRange.length > 0 ? updatedRange : this.originColors);
// remove the color option from forced colors
Object.entries(this.parentForcedColors).forEach(([key, value]) => {
if (key !== cleanedValue) {
updatedRange.delete(value);
}
});
this.range(updatedRange.size > 0 ? [...updatedRange] : this.originColors);
}
getColor(value?: string, sliceId?: number) {

16
superset-frontend/packages/superset-ui-core/test/color/CategoricalColorScale.test.ts
View File

@@ -273,5 +273,21 @@ describe('CategoricalColorScale', () => {
expect(scale.range()).toEqual(['blue', 'green', 'red']);
sharedLabelColor.clear();
});
it('should remove parentForcedColors from range', () => {
const parentForcedColors = { house: 'blue', cow: 'red' };
const scale = new CategoricalColorScale(
['blue', 'red', 'green'],
parentForcedColors,
);
const sharedLabelColor = getSharedLabelColor();
sharedLabelColor.clear();
const colorMap = sharedLabelColor.getColorMap();
scale.removeSharedLabelColorFromRange(colorMap, 'pig');
expect(scale.range()).toEqual(['green']);
scale.removeSharedLabelColorFromRange(colorMap, 'cow');
expect(scale.range()).toEqual(['red', 'green']);
sharedLabelColor.clear();
});
});
});