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 24eab4284f490..498853164e5a8 100644 --- a/superset-frontend/cypress-base/cypress/integration/dashboard/dashboard.helper.ts +++ b/superset-frontend/cypress-base/cypress/integration/dashboard/dashboard.helper.ts @@ -20,6 +20,7 @@ import { dashboardView } from 'cypress/support/directories'; * 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/'; diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard/edit_properties.test.ts b/superset-frontend/cypress-base/cypress/integration/dashboard/edit_properties.test.ts index b3061cdb7d40a..f748a48ac60e2 100644 --- a/superset-frontend/cypress-base/cypress/integration/dashboard/edit_properties.test.ts +++ b/superset-frontend/cypress-base/cypress/integration/dashboard/edit_properties.test.ts @@ -20,7 +20,7 @@ // eslint-disable-next-line import/no-extraneous-dependencies import * as ace from 'brace'; import * as shortid from 'shortid'; -import { WORLD_HEALTH_DASHBOARD } from './dashboard.helper'; +import { USA_BIRTH_NAMES_DASHBOARD } from './dashboard.helper'; function selectColorScheme(color: string) { // open color scheme dropdown @@ -48,12 +48,11 @@ function assertMetadata(text: string) { expect(ace.edit(metadata).getValue()).to.match(regex); }); } - -function typeMetadata(text: string) { - cy.get('.ant-modal-body') - .find('#json_metadata') - .should('be.visible') - .type(text); +function clear(input: string) { + cy.get(input).type('{selectall}{backspace}'); +} +function type(input: string, text: string) { + cy.get(input).type(text, { parseSpecialCharSequences: false }); } function openAdvancedProperties() { @@ -79,8 +78,8 @@ function openDashboardEditProperties() { describe('Dashboard edit action', () => { beforeEach(() => { cy.login(); - cy.visit(WORLD_HEALTH_DASHBOARD); - cy.intercept(`/api/v1/dashboard/1`).as('dashboardGet'); + cy.visit(USA_BIRTH_NAMES_DASHBOARD); + cy.intercept(`/api/v1/dashboard/births`).as('dashboardGet'); cy.get('.dashboard-grid', { timeout: 50000 }) .should('be.visible') // wait for 50 secs to load dashboard .then(() => { @@ -119,40 +118,32 @@ describe('Dashboard edit action', () => { describe('the color picker is changed', () => { describe('the metadata has a color scheme', () => { describe('the advanced tab is open', () => { - // TODO test passes locally but not on ci - xit('should overwrite the color scheme', () => { + it('should overwrite the color scheme', () => { openAdvancedProperties(); - cy.wait('@dashboardGet').then(() => { - selectColorScheme('d3Category20b'); - assertMetadata('d3Category20b'); - }); + selectColorScheme('d3Category20b'); + assertMetadata('d3Category20b'); }); }); describe('the advanced tab is not open', () => { - // TODO test passes locally but not on ci - xit('should overwrite the color scheme', () => { + it('should overwrite the color scheme', () => { selectColorScheme('bnbColors'); openAdvancedProperties(); - cy.wait('@dashboardGet').then(() => { - assertMetadata('bnbColors'); - }); + assertMetadata('bnbColors'); }); }); }); }); describe('a valid colorScheme is entered', () => { - // TODO test passes locally but not on ci - xit('should save json metadata color change to dropdown', () => { + it('should save json metadata color change to dropdown', () => { // edit json metadata openAdvancedProperties().then(() => { - typeMetadata( - '{selectall}{backspace}{{}"color_scheme":"d3Category20"{}}', - ); + clear('#json_metadata'); + type('#json_metadata', '{"color_scheme":"d3Category20"}'); }); // save edit changes - cy.get('.modal-footer') - .contains('Save') + cy.get('.ant-modal-footer') + .contains('Apply') .click() .then(() => { // assert that modal edit window has closed @@ -163,7 +154,7 @@ describe('Dashboard edit action', () => { openAdvancedProperties().then(() => { assertMetadata('d3Category20'); }); - cy.get('.color-scheme-container').should( + cy.get('.ant-select-selection-item ul').should( 'have.attr', 'data-test', 'd3Category20', @@ -172,18 +163,16 @@ describe('Dashboard edit action', () => { }); }); describe('an invalid colorScheme is entered', () => { - // TODO test passes locally but not on ci - xit('should throw an error', () => { + it('should throw an error', () => { // edit json metadata openAdvancedProperties().then(() => { - typeMetadata( - '{selectall}{backspace}{{}"color_scheme":"THIS_DOES_NOT_WORK"{}}', - ); + clear('#json_metadata'); + type('#json_metadata', '{"color_scheme":"THIS_DOES_NOT_WORK"}'); }); // save edit changes - cy.get('.modal-footer') - .contains('Save') + cy.get('.ant-modal-footer') + .contains('Apply') .click() .then(() => { // assert that modal edit window has closed @@ -201,4 +190,74 @@ describe('Dashboard edit action', () => { }); }); }); + describe('the color scheme affects the chart colors', () => { + it('should change the chart colors', () => { + openAdvancedProperties().then(() => { + clear('#json_metadata'); + type( + '#json_metadata', + '{"color_scheme":"lyftColors", "label_colors": {}}', + ); + }); + + cy.get('.ant-modal-footer') + .contains('Apply') + .click() + .then(() => { + cy.get('.ant-modal-body').should('not.exist'); + // assert that the chart has changed colors + cy.get('.line .nv-legend-symbol') + .first() + .should('have.css', 'fill', 'rgb(117, 96, 170)'); + }); + }); + it('the label colors should take precedence over the scheme', () => { + openAdvancedProperties().then(() => { + clear('#json_metadata'); + type( + '#json_metadata', + '{"color_scheme":"lyftColors","label_colors":{"Amanda":"red"}}', + ); + }); + + cy.get('.ant-modal-footer') + .contains('Apply') + .click() + .then(() => { + cy.get('.ant-modal-body').should('not.exist'); + // assert that the chart has changed colors + cy.get('.line .nv-legend-symbol') + .first() + .should('have.css', 'fill', 'rgb(255, 0, 0)'); + }); + }); + it('the shared label colors and label colors are applied correctly', () => { + openAdvancedProperties().then(() => { + clear('#json_metadata'); + type( + '#json_metadata', + '{"color_scheme":"lyftColors","label_colors":{"Amanda":"red"}}', + ); + }); + + cy.get('.ant-modal-footer') + .contains('Apply') + .click() + .then(() => { + cy.get('.ant-modal-body').should('not.exist'); + // assert that the chart has changed colors + cy.get('.line .nv-legend-symbol') + .first() + .should('have.css', 'fill', 'rgb(255, 0, 0)'); // label: amanda + cy.get('.line .nv-legend-symbol') + .eq(11) + .should('have.css', 'fill', 'rgb(234, 11, 140)'); // label: jennifer + cy.get('.word_cloud') + .first() + .find('svg text') + .first() + .should('have.css', 'fill', 'rgb(234, 11, 140)'); // label: jennifer + }); + }); + }); }); 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 3c815a222ce1e..419346cf98ebb 100644 --- a/superset-frontend/cypress-base/cypress/integration/dashboard/save.test.js +++ b/superset-frontend/cypress-base/cypress/integration/dashboard/save.test.js @@ -25,11 +25,18 @@ import { } from './dashboard.helper'; function openDashboardEditProperties() { - cy.get('.header-with-actions [aria-label="Edit dashboard"]').click(); + // open dashboard properties edit modal + cy.get('.header-with-actions [aria-label="Edit dashboard"]') + .should('be.visible') + .click(); cy.get( '.header-with-actions .right-button-panel .ant-dropdown-trigger', - ).trigger('click', { force: true }); - cy.get('.dropdown-menu').contains('Edit properties').click(); + ).trigger('click', { + force: true, + }); + cy.get('[data-test=header-actions-menu]') + .contains('Edit properties') + .click({ force: true }); } describe('Dashboard save action', () => { @@ -98,8 +105,7 @@ describe('Dashboard save action', () => { .should('not.exist'); }); - // TODO: Fix broken test - xit('should save after edit', () => { + it('should save after edit', () => { cy.get('.dashboard-grid', { timeout: 50000 }) // wait for 50 secs to load dashboard .then(() => { const dashboardTitle = `Test dashboard [${shortid.generate()}]`; @@ -110,14 +116,13 @@ describe('Dashboard save action', () => { cy.get('.ant-modal-body') .contains('Color scheme') .parents('.ControlHeader') - .next('.Select') + .next('.ant-select') .click() - .then($colorSelect => { + .then(() => { // select a new color scheme - cy.wrap($colorSelect) - .find('.Select__option') + cy.get('.ant-modal-body') + .find('.ant-select-item-option-active') .first() - .next() .click(); }); @@ -130,14 +135,13 @@ describe('Dashboard save action', () => { }); // update title - cy.get('.ant-modal-body') - .contains('Title') - .siblings('input') - .type(`{selectall}{backspace}${dashboardTitle}`); + cy.get('[data-test="dashboard-title-input"]').type( + `{selectall}{backspace}${dashboardTitle}`, + ); // save edit changes cy.get('.ant-modal-footer') - .contains('Save') + .contains('Apply') .click() .then(() => { // assert that modal edit window has closed @@ -150,10 +154,9 @@ describe('Dashboard save action', () => { cy.contains('saved successfully').should('be.visible'); // assert title has been updated - cy.get('.editable-title [data-test="editable-title-input"]').should( - 'have.value', - dashboardTitle, - ); + cy.get( + '.header-with-actions .title-panel [data-test="editable-title"]', + ).should('have.text', dashboardTitle); }); }); }); diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/area.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/area.test.js index 59b8beabe38b9..eea3520398f4a 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/area.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/area.test.js @@ -103,4 +103,18 @@ describe('Visualization > Area', () => { }); cy.get('.nv-area').should('have.length', 2); }); + + it('should allow type to search color schemes and apply the scheme', () => { + cy.get('#controlSections-tab-display').click(); + cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); + cy.get('.Control[data-test="color_scheme"] input[type="search"]') + .focus() + .type('supersetColors{enter}'); + cy.get( + '.Control[data-test="color_scheme"] .ant-select-selection-item ul[data-test="supersetColors"]', + ).should('exist'); + cy.get('.area .nv-legend .nv-legend-symbol') + .first() + .should('have.css', 'fill', 'rgb(31, 168, 201)'); + }); }); diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/box_plot.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/box_plot.test.js index 6a4afba97a91f..43f644b92d332 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/box_plot.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/box_plot.test.js @@ -46,4 +46,15 @@ describe('Visualization > Box Plot', () => { verify(BOX_PLOT_FORM_DATA); cy.get('.chart-container .box_plot canvas').should('have.length', 1); }); + + it('should allow type to search color schemes', () => { + cy.get('#controlSections-tab-display').click(); + cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); + cy.get('.Control[data-test="color_scheme"] input[type="search"]') + .focus() + .type('supersetColors{enter}'); + cy.get( + '.Control[data-test="color_scheme"] .ant-select-selection-item ul[data-test="supersetColors"]', + ).should('exist'); + }); }); diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/bubble.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/bubble.test.js index 9c824e5d9ff40..28243f6862ed8 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/bubble.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/bubble.test.js @@ -107,4 +107,20 @@ describe('Visualization > Bubble', () => { ); }); }); + + it('should allow type to search color schemes and apply the scheme', () => { + cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); + cy.get('.Control[data-test="color_scheme"] input[type="search"]') + .focus() + .type('supersetColors{enter}'); + cy.get( + '.Control[data-test="color_scheme"] .ant-select-selection-item ul[data-test="supersetColors"]', + ).should('exist'); + cy.get('[data-test=run-query-button]').click(); + cy.get('.bubble .nv-legend .nv-legend-symbol').should( + 'have.css', + 'fill', + 'rgb(31, 168, 201)', + ); + }); }); diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/compare.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/compare.test.js index 35f56754a849f..d4334bbe94513 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/compare.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/compare.test.js @@ -86,4 +86,18 @@ describe('Visualization > Compare', () => { }); cy.get('.chart-container .nvd3 path.nv-line').should('have.length', 1); }); + + it('should allow type to search color schemes and apply the scheme', () => { + cy.get('#controlSections-tab-display').click(); + cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); + cy.get('.Control[data-test="color_scheme"] input[type="search"]') + .focus() + .type('supersetColors{enter}'); + cy.get( + '.Control[data-test="color_scheme"] .ant-select-selection-item ul[data-test="supersetColors"]', + ).should('exist'); + cy.get('.compare .nv-legend .nv-legend-symbol') + .first() + .should('have.css', 'fill', 'rgb(31, 168, 201)'); + }); }); diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/dist_bar.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/dist_bar.test.js index 6bd7c82f430b4..ecdab93ccfc3b 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/dist_bar.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/dist_bar.test.js @@ -77,4 +77,18 @@ describe('Visualization > Distribution bar chart', () => { cy.visitChartByParams(formData); cy.verifySliceSuccess({ waitAlias: '@getJson', chartSelector: 'svg' }); }); + + it('should allow type to search color schemes and apply the scheme', () => { + cy.get('#controlSections-tab-display').click(); + cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); + cy.get('.Control[data-test="color_scheme"] input[type="search"]') + .focus() + .type('bnbColors{enter}'); + cy.get( + '.Control[data-test="color_scheme"] .ant-select-selection-item ul[data-test="bnbColors"]', + ).should('exist'); + cy.get('.dist_bar .nv-legend .nv-legend-symbol') + .first() + .should('have.css', 'fill', 'rgb(255, 90, 95)'); + }); }); diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/dual_line.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/dual_line.test.js index 3a3eb334fb9fb..e570836d39154 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/dual_line.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/dual_line.test.js @@ -66,4 +66,18 @@ describe('Visualization > Dual Line', () => { }); cy.get('.chart-container svg path.nv-line').should('have.length', 2); }); + + it('should allow type to search color schemes and apply the scheme', () => { + cy.get('#controlSections-tab-display').click(); + cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); + cy.get('.Control[data-test="color_scheme"] input[type="search"]') + .focus() + .type('supersetColors{enter}'); + cy.get( + '.Control[data-test="color_scheme"] .ant-select-selection-item ul[data-test="supersetColors"]', + ).should('exist'); + cy.get('.dual_line .nv-legend .nv-legend-symbol') + .first() + .should('have.css', 'fill', 'rgb(31, 168, 201)'); + }); }); diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/gauge.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/gauge.test.js index c4735b7b8a652..0bb5cb48d5505 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/gauge.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/gauge.test.js @@ -60,4 +60,15 @@ describe('Visualization > Gauge', () => { }); cy.get('.chart-container .gauge_chart canvas').should('have.length', 1); }); + + it('should allow type to search color schemes', () => { + cy.get('#controlSections-tab-display').click(); + cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); + cy.get('.Control[data-test="color_scheme"] input[type="search"]') + .focus() + .type('bnbColors{enter}'); + cy.get( + '.Control[data-test="color_scheme"] .ant-select-selection-item ul[data-test="bnbColors"]', + ).should('exist'); + }); }); diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/graph.test.ts b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/graph.test.ts index c01d9c5099a15..b54ff10e76424 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/graph.test.ts +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/graph.test.ts @@ -77,4 +77,15 @@ describe('Visualization > Graph', () => { }); cy.get('.chart-container .graph_chart canvas').should('have.length', 1); }); + + it('should allow type to search color schemes', () => { + cy.get('#controlSections-tab-display').click(); + cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); + cy.get('.Control[data-test="color_scheme"] input[type="search"]') + .focus() + .type('bnbColors{enter}'); + cy.get( + '.Control[data-test="color_scheme"] .ant-select-selection-item ul[data-test="bnbColors"]', + ).should('exist'); + }); }); diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/histogram.test.ts b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/histogram.test.ts index ff6355319ae4a..ef1a2df2d500e 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/histogram.test.ts +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/histogram.test.ts @@ -84,4 +84,19 @@ describe('Visualization > Histogram', () => { }); cy.get('.chart-container svg .vx-bar').should('have.length', numBins); }); + + it('should allow type to search color schemes and apply the scheme', () => { + cy.get('#controlSections-tab-display').click(); + cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); + cy.get('.Control[data-test="color_scheme"] input[type="search"]') + .focus() + .type('supersetColors{enter}'); + cy.get( + '.Control[data-test="color_scheme"] .ant-select-selection-item ul[data-test="supersetColors"]', + ).should('exist'); + cy.get('.histogram .vx-legend .vx-legend-shape div') + .first() + .should('have.css', 'background') + .and('contains', 'rgb(31, 168, 201)'); + }); }); diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/line.test.ts b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/line.test.ts index 55ad6015c0d65..b20f69a2140ba 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/line.test.ts +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/line.test.ts @@ -75,7 +75,7 @@ describe('Visualization > Line', () => { cy.get('.ant-alert-warning').should('not.exist'); }); - it('should allow type to search color schemes', () => { + it('should allow type to search color schemes and apply the scheme', () => { cy.get('#controlSections-tab-display').click(); cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); cy.get('.Control[data-test="color_scheme"] input[type="search"]') @@ -84,6 +84,9 @@ describe('Visualization > Line', () => { cy.get( '.Control[data-test="color_scheme"] .ant-select-selection-item ul[data-test="bnbColors"]', ).should('exist'); + cy.get('.line .nv-legend .nv-legend-symbol') + .first() + .should('have.css', 'fill', 'rgb(255, 90, 95)'); }); it('should work with adhoc metric', () => { diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/pie.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/pie.test.js index 3b28128e68c00..0590d64fa956d 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/pie.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/pie.test.js @@ -68,4 +68,15 @@ describe('Visualization > Pie', () => { }); cy.get('.chart-container .pie canvas').should('have.length', 1); }); + + it('should allow type to search color schemes', () => { + cy.get('#controlSections-tab-display').click(); + cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); + cy.get('.Control[data-test="color_scheme"] input[type="search"]') + .focus() + .type('supersetColors{enter}'); + cy.get( + '.Control[data-test="color_scheme"] .ant-select-selection-item ul[data-test="supersetColors"]', + ).should('exist'); + }); }); diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/sankey.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/sankey.test.js index 747e8a06f25b6..b9f6ced3f20b8 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/sankey.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/sankey.test.js @@ -73,4 +73,15 @@ describe('Visualization > Sankey', () => { }); cy.get('.chart-container svg g.node rect').should('have.length', 6); }); + + it('should allow type to search color schemes', () => { + cy.get('#controlSections-tab-display').click(); + cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); + cy.get('.Control[data-test="color_scheme"] input[type="search"]') + .focus() + .type('bnbColors{enter}'); + cy.get( + '.Control[data-test="color_scheme"] .ant-select-selection-item ul[data-test="bnbColors"]', + ).should('exist'); + }); }); diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/sunburst.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/sunburst.test.js index e7ccacac03baa..5118fdfe231d2 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/sunburst.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/sunburst.test.js @@ -80,4 +80,15 @@ describe('Visualization > Sunburst', () => { }); cy.get('.chart-container svg g#arcs path').should('have.length', 3); }); + + it('should allow type to search color schemes', () => { + cy.get('#controlSections-tab-display').click(); + cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); + cy.get('.Control[data-test="color_scheme"] input[type="search"]') + .focus() + .type('supersetColors{enter}'); + cy.get( + '.Control[data-test="color_scheme"] .ant-select-selection-item ul[data-test="supersetColors"]', + ).should('exist'); + }); }); diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/treemap.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/treemap.test.js index 1be85e9e4cdfb..435e363cb5ce7 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/treemap.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/treemap.test.js @@ -80,4 +80,16 @@ describe('Visualization > Treemap', () => { }); cy.get(level1).should('have.length', 8); }); + + it('should allow type to search color schemes and apply the scheme', () => { + cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); + cy.get('.Control[data-test="color_scheme"] input[type="search"]') + .focus() + .type('supersetColors{enter}'); + cy.get( + '.Control[data-test="color_scheme"] .ant-select-selection-item ul[data-test="supersetColors"]', + ).should('exist'); + cy.get('[data-test=run-query-button]').click(); + cy.get('#rect-IND').should('have.css', 'fill', 'rgb(69, 78, 124)'); + }); }); diff --git a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/world_map.test.js b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/world_map.test.js index 0fab65519d8dd..8b733ee3ff9aa 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/visualizations/world_map.test.js +++ b/superset-frontend/cypress-base/cypress/integration/explore/visualizations/world_map.test.js @@ -80,4 +80,14 @@ describe('Visualization > World Map', () => { ).to.equal(0); }); }); + + it('should allow type to search color schemes', () => { + cy.get('.Control[data-test="linear_color_scheme"]').scrollIntoView(); + cy.get('.Control[data-test="linear_color_scheme"] input[type="search"]') + .focus() + .type('greens{enter}'); + cy.get( + '.Control[data-test="linear_color_scheme"] .ant-select-selection-item ul[data-test="greens"]', + ).should('exist'); + }); });