From 907fc8a713c1091adc6a4e3d7b536d4bddf70cc7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C4=90=E1=BB=97=20Tr=E1=BB=8Dng=20H=E1=BA=A3i?= <41283691+hainenber@users.noreply.github.com> Date: Tue, 20 Aug 2024 09:17:05 +0700 Subject: [PATCH] build(deps-dev): bump eslint-plugin-cypress from 2.11.2 to 3.4.0 in /superset-frontend + corresponding refactor (#29964) Signed-off-by: hainenber --- .../cypress/e2e/chart_list/list.test.ts | 21 +-- .../cypress/e2e/dashboard/drillby.test.ts | 57 ++++--- .../e2e/dashboard/drilltodetail.test.ts | 152 ++++++++++-------- .../cypress/e2e/dashboard/editmode.test.ts | 9 +- .../cypress/e2e/dashboard/tabs.test.ts | 11 +- .../cypress/e2e/dashboard/utils.ts | 28 ++-- .../cypress/e2e/dashboard_list/list.test.ts | 3 +- .../cypress/e2e/database/modal.test.ts | 12 +- .../cypress/e2e/explore/AdhocMetrics.test.ts | 10 +- .../e2e/explore/_skip.AdhocFilters.test.ts | 26 ++- .../e2e/explore/advanced_analytics.test.ts | 2 +- .../cypress/e2e/explore/control.test.ts | 94 +++++------ .../cypress/e2e/explore/link.test.ts | 8 +- .../e2e/explore/visualizations/area.test.js | 5 +- .../explore/visualizations/box_plot.test.js | 5 +- .../e2e/explore/visualizations/bubble.test.js | 30 ++-- .../explore/visualizations/compare.test.js | 5 +- .../explore/visualizations/dist_bar.test.js | 5 +- .../e2e/explore/visualizations/gauge.test.js | 5 +- .../e2e/explore/visualizations/graph.test.ts | 5 +- .../explore/visualizations/histogram.test.ts | 5 +- .../e2e/explore/visualizations/line.test.ts | 13 +- .../e2e/explore/visualizations/pie.test.js | 5 +- .../e2e/explore/visualizations/sankey.test.js | 5 +- .../explore/visualizations/sunburst.test.js | 5 +- .../e2e/explore/visualizations/table.test.ts | 3 +- .../explore/visualizations/world_map.test.js | 7 +- .../cypress/e2e/sqllab/query.test.ts | 39 +++-- .../cypress-base/cypress/utils/index.ts | 20 ++- .../cypress-base/package-lock.json | 64 ++++++-- superset-frontend/cypress-base/package.json | 2 +- superset-frontend/package-lock.json | 61 ++++++- superset-frontend/package.json | 2 +- 33 files changed, 404 insertions(+), 320 deletions(-) diff --git a/superset-frontend/cypress-base/cypress/e2e/chart_list/list.test.ts b/superset-frontend/cypress-base/cypress/e2e/chart_list/list.test.ts index 4e1dc1741..0b05a53d3 100644 --- a/superset-frontend/cypress-base/cypress/e2e/chart_list/list.test.ts +++ b/superset-frontend/cypress-base/cypress/e2e/chart_list/list.test.ts @@ -86,16 +86,12 @@ describe('Charts list', () => { saveChartToDashboard('3 - Sample dashboard'); visitChartList(); cy.getBySel('count-crosslinks').should('be.visible'); - cy.getBySel('crosslinks') - .first() - .trigger('mouseover') - .then(() => { - cy.get('.ant-tooltip') - .contains('3 - Sample dashboard') - .invoke('removeAttr', 'target') - .click(); - cy.wait('@get'); - }); + cy.getBySel('crosslinks').first().trigger('mouseover'); + cy.get('.ant-tooltip') + .contains('3 - Sample dashboard') + .invoke('removeAttr', 'target') + .click(); + cy.wait('@get'); }); }); @@ -293,9 +289,8 @@ describe('Charts list', () => { // edits in list-view setGridMode('list'); cy.getBySel('edit-alt').eq(1).click(); - cy.getBySel('properties-modal-name-input') - .clear() - .type('1 - Sample chart'); + cy.getBySel('properties-modal-name-input').clear(); + cy.getBySel('properties-modal-name-input').type('1 - Sample chart'); cy.get('button:contains("Save")').click(); cy.wait('@update'); cy.getBySel('table-row').eq(1).contains('1 - Sample chart'); diff --git a/superset-frontend/cypress-base/cypress/e2e/dashboard/drillby.test.ts b/superset-frontend/cypress-base/cypress/e2e/dashboard/drillby.test.ts index 4a2f43538..48f605332 100644 --- a/superset-frontend/cypress-base/cypress/e2e/dashboard/drillby.test.ts +++ b/superset-frontend/cypress-base/cypress/e2e/dashboard/drillby.test.ts @@ -43,11 +43,8 @@ const openTableContextMenu = ( cellContent: string, tableSelector = "[data-test-viz-type='table']", ) => { - cy.get(tableSelector) - .scrollIntoView() - .contains(cellContent) - .first() - .rightclick(); + cy.get(tableSelector).scrollIntoView(); + cy.get(tableSelector).contains(cellContent).first().rightclick(); }; const drillBy = (targetDrillByColumn: string, isLegacy = false) => { @@ -94,14 +91,16 @@ const testEchart = ( ) => { cy.get(`[data-test-viz-type='${vizType}'] canvas`).then($canvas => { // click 'boy' - cy.wrap($canvas) - .scrollIntoView() - .trigger( - 'mouseover', - drillClickCoordinates[0][0], - drillClickCoordinates[0][1], - ) - .rightclick(drillClickCoordinates[0][0], drillClickCoordinates[0][1]); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).trigger( + 'mouseover', + drillClickCoordinates[0][0], + drillClickCoordinates[0][1], + ); + cy.wrap($canvas).rightclick( + drillClickCoordinates[0][0], + drillClickCoordinates[0][1], + ); drillBy('state').then(intercepted => { verifyExpectedFormData(intercepted, { @@ -139,14 +138,16 @@ const testEchart = ( // further drill cy.get(`[data-test="drill-by-chart"] canvas`).then($canvas => { // click 'other' - cy.wrap($canvas) - .scrollIntoView() - .trigger( - 'mouseover', - drillClickCoordinates[1][0], - drillClickCoordinates[1][1], - ) - .rightclick(drillClickCoordinates[1][0], drillClickCoordinates[1][1]); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).trigger( + 'mouseover', + drillClickCoordinates[1][0], + drillClickCoordinates[1][1], + ); + cy.wrap($canvas).rightclick( + drillClickCoordinates[1][0], + drillClickCoordinates[1][1], + ); drillBy(furtherDrillDimension).then(intercepted => { verifyExpectedFormData(intercepted, { @@ -609,10 +610,9 @@ describe('Drill by modal', () => { it('Mixed Chart', () => { cy.get('[data-test-viz-type="mixed_timeseries"] canvas').then($canvas => { // click 'boy' - cy.wrap($canvas) - .scrollIntoView() - .trigger('mouseover', 70, 93) - .rightclick(70, 93); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).trigger('mouseover', 70, 93); + cy.wrap($canvas).rightclick(70, 93); drillBy('name').then(intercepted => { const { queries } = intercepted.request.body; @@ -644,10 +644,9 @@ describe('Drill by modal', () => { // further drill cy.get(`[data-test="drill-by-chart"] canvas`).then($canvas => { // click second query - cy.wrap($canvas) - .scrollIntoView() - .trigger('mouseover', 246, 114) - .rightclick(246, 114); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).trigger('mouseover', 246, 114); + cy.wrap($canvas).rightclick(246, 114); drillBy('ds').then(intercepted => { const { queries } = intercepted.request.body; diff --git a/superset-frontend/cypress-base/cypress/e2e/dashboard/drilltodetail.test.ts b/superset-frontend/cypress-base/cypress/e2e/dashboard/drilltodetail.test.ts index 6adb1c38b..c876dbc24 100644 --- a/superset-frontend/cypress-base/cypress/e2e/dashboard/drilltodetail.test.ts +++ b/superset-frontend/cypress-base/cypress/e2e/dashboard/drilltodetail.test.ts @@ -86,46 +86,41 @@ function testTimeChart(vizType: string) { interceptSamples(); cy.get(`[data-test-viz-type='${vizType}'] canvas`).then($canvas => { - cy.wrap($canvas) - .scrollIntoView() - .trigger('mousemove', 70, 93) - .rightclick(70, 93); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).trigger('mousemove', 70, 93); + cy.wrap($canvas).rightclick(70, 93); openModalFromChartContext('Drill to detail by 1965'); cy.getBySel('filter-val').should('contain', '1965'); closeModal(); - cy.wrap($canvas) - .scrollIntoView() - .trigger('mousemove', 70, 93) - .rightclick(70, 93); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).trigger('mousemove', 70, 93); + cy.wrap($canvas).rightclick(70, 93); openModalFromChartContext('Drill to detail by boy'); cy.getBySel('filter-val').should('contain', 'boy'); closeModal(); - cy.wrap($canvas) - .scrollIntoView() - .trigger('mousemove', 70, 93) - .rightclick(70, 93); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).trigger('mousemove', 70, 93); + cy.wrap($canvas).rightclick(70, 93); openModalFromChartContext('Drill to detail by all'); cy.getBySel('filter-val').first().should('contain', '1965'); cy.getBySel('filter-val').eq(1).should('contain', 'boy'); closeModal(); - cy.wrap($canvas) - .scrollIntoView() - .trigger('mousemove', 70, 145) - .rightclick(70, 145); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).trigger('mousemove', 70, 145); + cy.wrap($canvas).rightclick(70, 145); openModalFromChartContext('Drill to detail by girl'); cy.getBySel('filter-val').should('contain', 'girl'); closeModal(); - cy.wrap($canvas) - .scrollIntoView() - .trigger('mousemove', 70, 145) - .rightclick(70, 145); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).trigger('mousemove', 70, 145); + cy.wrap($canvas).rightclick(70, 145); openModalFromChartContext('Drill to detail by all'); cy.getBySel('filter-val').first().should('contain', '1965'); cy.getBySel('filter-val').eq(1).should('contain', 'girl'); @@ -206,9 +201,12 @@ describe('Drill to detail modal', () => { interceptSamples(); // opens the modal by clicking on the number on the chart - cy.get("[data-test-viz-type='big_number_total'] .header-line") - .scrollIntoView() - .rightclick(); + cy.get( + "[data-test-viz-type='big_number_total'] .header-line", + ).scrollIntoView(); + cy.get( + "[data-test-viz-type='big_number_total'] .header-line", + ).rightclick(); openModalFromChartContext('Drill to detail'); @@ -221,9 +219,10 @@ describe('Drill to detail modal', () => { interceptSamples(); // opens the modal by clicking on the number - cy.get("[data-test-viz-type='big_number'] .header-line") - .scrollIntoView() - .rightclick(); + cy.get( + "[data-test-viz-type='big_number'] .header-line", + ).scrollIntoView(); + cy.get("[data-test-viz-type='big_number'] .header-line").rightclick(); openModalFromChartContext('Drill to detail'); @@ -233,10 +232,9 @@ describe('Drill to detail modal', () => { // opens the modal by clicking on the trendline cy.get("[data-test-viz-type='big_number'] canvas").then($canvas => { - cy.wrap($canvas) - .scrollIntoView() - .trigger('mousemove', 1, 14) - .rightclick(1, 14); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).trigger('mousemove', 1, 14); + cy.wrap($canvas).rightclick(1, 14); openModalFromChartContext('Drill to detail by 1965'); @@ -254,10 +252,8 @@ describe('Drill to detail modal', () => { cy.get("[data-test-viz-type='table']").contains('boy').rightclick(); cy.wait(500); - cy.get("[data-test-viz-type='table']") - .contains('boy') - .scrollIntoView() - .rightclick(); + cy.get("[data-test-viz-type='table']").contains('boy').scrollIntoView(); + cy.get("[data-test-viz-type='table']").contains('boy').rightclick(); openModalFromChartContext('Drill to detail by boy'); @@ -268,10 +264,8 @@ describe('Drill to detail modal', () => { // focus on table first to trigger browser scroll cy.get("[data-test-viz-type='table']").contains('girl').rightclick(); cy.wait(500); - cy.get("[data-test-viz-type='table']") - .scrollIntoView() - .contains('girl') - .rightclick(); + cy.get("[data-test-viz-type='table']").scrollIntoView(); + cy.get("[data-test-viz-type='table']").contains('girl').rightclick(); openModalFromChartContext('Drill to detail by girl'); @@ -283,8 +277,8 @@ describe('Drill to detail modal', () => { it('opens the modal with the correct filters', () => { interceptSamples(); + cy.get("[data-test-viz-type='pivot_table_v2']").scrollIntoView(); cy.get("[data-test-viz-type='pivot_table_v2']") - .scrollIntoView() .find('[role="gridcell"]') .first() .rightclick(); @@ -294,8 +288,8 @@ describe('Drill to detail modal', () => { cy.getBySel('filter-val').should('contain', 'boy'); closeModal(); + cy.get("[data-test-viz-type='pivot_table_v2']").scrollIntoView(); cy.get("[data-test-viz-type='pivot_table_v2']") - .scrollIntoView() .find('[role="gridcell"]') .first() .rightclick(); @@ -305,8 +299,8 @@ describe('Drill to detail modal', () => { cy.getBySel('filter-val').should('contain', 'CA'); closeModal(); + cy.get("[data-test-viz-type='pivot_table_v2']").scrollIntoView(); cy.get("[data-test-viz-type='pivot_table_v2']") - .scrollIntoView() .find('[role="gridcell"]') .eq(3) .rightclick(); @@ -316,8 +310,8 @@ describe('Drill to detail modal', () => { cy.getBySel('filter-val').should('contain', 'girl'); closeModal(); + cy.get("[data-test-viz-type='pivot_table_v2']").scrollIntoView(); cy.get("[data-test-viz-type='pivot_table_v2']") - .scrollIntoView() .find('[role="gridcell"]') .eq(3) .rightclick(); @@ -327,8 +321,8 @@ describe('Drill to detail modal', () => { cy.getBySel('filter-val').should('contain', 'FL'); closeModal(); + cy.get("[data-test-viz-type='pivot_table_v2']").scrollIntoView(); cy.get("[data-test-viz-type='pivot_table_v2']") - .scrollIntoView() .find('[role="gridcell"]') .eq(3) .rightclick(); @@ -352,26 +346,30 @@ describe('Drill to detail modal', () => { cy.get("[data-test-viz-type='echarts_timeseries_bar'] canvas").then( $canvas => { - cy.wrap($canvas).scrollIntoView().rightclick(70, 100); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).rightclick(70, 100); openModalFromChartContext('Drill to detail by 1965'); cy.getBySel('filter-val').should('contain', '1965'); closeModal(); - cy.wrap($canvas).scrollIntoView().rightclick(70, 100); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).rightclick(70, 100); openModalFromChartContext('Drill to detail by boy'); cy.getBySel('filter-val').should('contain', 'boy'); closeModal(); - cy.wrap($canvas).scrollIntoView().rightclick(70, 100); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).rightclick(70, 100); openModalFromChartContext('Drill to detail by all'); cy.getBySel('filter-val').first().should('contain', '1965'); cy.getBySel('filter-val').eq(1).should('contain', 'boy'); closeModal(); - cy.wrap($canvas).scrollIntoView().rightclick(72, 200); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).rightclick(72, 200); openModalFromChartContext('Drill to detail by girl'); cy.getBySel('filter-val').should('contain', 'girl'); @@ -398,13 +396,15 @@ describe('Drill to detail modal', () => { // opens the modal by clicking on the slice of the Pie chart cy.get("[data-test-viz-type='pie'] canvas").then($canvas => { - cy.wrap($canvas).scrollIntoView().rightclick(130, 150); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).rightclick(130, 150); openModalFromChartContext('Drill to detail by girl'); cy.getBySel('filter-val').should('contain', 'girl'); closeModal(); - cy.wrap($canvas).scrollIntoView().rightclick(230, 190); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).rightclick(230, 190); openModalFromChartContext('Drill to detail by boy'); cy.getBySel('filter-val').should('contain', 'boy'); @@ -417,13 +417,15 @@ describe('Drill to detail modal', () => { interceptSamples(); cy.get("[data-test-viz-type='world_map'] svg").then($canvas => { - cy.wrap($canvas).scrollIntoView().rightclick(70, 150); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).rightclick(70, 150); openModalFromChartContext('Drill to detail by USA'); cy.getBySel('filter-val').should('contain', 'USA'); closeModal(); }); cy.get("[data-test-viz-type='world_map'] svg").then($canvas => { - cy.wrap($canvas).scrollIntoView().rightclick(200, 140); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).rightclick(200, 140); openModalFromChartContext('Drill to detail by SRB'); cy.getBySel('filter-val').should('contain', 'SRB'); }); @@ -435,7 +437,8 @@ describe('Drill to detail modal', () => { interceptSamples(); cy.get("[data-test-viz-type='dist_bar'] svg").then($canvas => { - cy.wrap($canvas).scrollIntoView().rightclick(70, 150); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).rightclick(70, 150); openModalFromChartContext('Drill to detail'); cy.getBySel('filter-val').should('not.exist'); }); @@ -461,9 +464,10 @@ describe('Drill to detail modal', () => { const canvasCenterX = canvasWidth / 3; const canvasCenterY = (canvasHeight * 5) / 6; - cy.wrap($canvas) - .scrollIntoView() - .rightclick(canvasCenterX, canvasCenterY, { force: true }); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).rightclick(canvasCenterX, canvasCenterY, { + force: true, + }); openModalFromChartContext('Drill to detail by boy'); @@ -497,19 +501,17 @@ describe('Drill to detail modal', () => { interceptSamples(); cy.get("[data-test-viz-type='box_plot'] canvas").then($canvas => { - cy.wrap($canvas) - .scrollIntoView() - .trigger('mousemove', 135, 275) - .rightclick(135, 275); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).trigger('mousemove', 135, 275); + cy.wrap($canvas).rightclick(135, 275); openModalFromChartContext('Drill to detail by boy'); cy.getBySel('filter-val').should('contain', 'boy'); closeModal(); - cy.wrap($canvas) - .scrollIntoView() - .trigger('mousemove', 270, 280) - .rightclick(270, 280); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).trigger('mousemove', 270, 280); + cy.wrap($canvas).rightclick(270, 280); openModalFromChartContext('Drill to detail by girl'); cy.getBySel('filter-val').should('contain', 'girl'); @@ -540,13 +542,15 @@ describe('Drill to detail modal', () => { interceptSamples(); cy.get("[data-test-viz-type='funnel'] canvas").then($canvas => { - cy.wrap($canvas).scrollIntoView().rightclick(170, 90); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).rightclick(170, 90); openModalFromChartContext('Drill to detail by boy'); cy.getBySel('filter-val').should('contain', 'boy'); closeModal(); - cy.wrap($canvas).scrollIntoView().rightclick(190, 250); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).rightclick(190, 250); openModalFromChartContext('Drill to detail by girl'); cy.getBySel('filter-val').should('contain', 'girl'); @@ -559,13 +563,15 @@ describe('Drill to detail modal', () => { interceptSamples(); cy.get("[data-test-viz-type='gauge_chart'] canvas").then($canvas => { - cy.wrap($canvas).scrollIntoView().rightclick(135, 95); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).rightclick(135, 95); openModalFromChartContext('Drill to detail by boy'); cy.getBySel('filter-val').should('contain', 'boy'); closeModal(); - cy.wrap($canvas).scrollIntoView().rightclick(95, 135); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).rightclick(95, 135); openModalFromChartContext('Drill to detail by girl'); cy.getBySel('filter-val').should('contain', 'girl'); @@ -584,13 +590,15 @@ describe('Drill to detail modal', () => { interceptSamples(); cy.get("[data-test-viz-type='radar'] canvas").then($canvas => { - cy.wrap($canvas).scrollIntoView().rightclick(180, 45); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).rightclick(180, 45); openModalFromChartContext('Drill to detail by boy'); cy.getBySel('filter-val').should('contain', 'boy'); closeModal(); - cy.wrap($canvas).scrollIntoView().rightclick(180, 85); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).rightclick(180, 85); openModalFromChartContext('Drill to detail by girl'); cy.getBySel('filter-val').should('contain', 'girl'); @@ -603,13 +611,15 @@ describe('Drill to detail modal', () => { interceptSamples(); cy.get("[data-test-viz-type='treemap_v2'] canvas").then($canvas => { - cy.wrap($canvas).scrollIntoView().rightclick(100, 30); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).rightclick(100, 30); openModalFromChartContext('Drill to detail by boy'); cy.getBySel('filter-val').should('contain', 'boy'); closeModal(); - cy.wrap($canvas).scrollIntoView().rightclick(150, 250); + cy.wrap($canvas).scrollIntoView(); + cy.wrap($canvas).rightclick(150, 250); openModalFromChartContext('Drill to detail by girl'); cy.getBySel('filter-val').should('contain', 'girl'); diff --git a/superset-frontend/cypress-base/cypress/e2e/dashboard/editmode.test.ts b/superset-frontend/cypress-base/cypress/e2e/dashboard/editmode.test.ts index 4f9863071..b7ea17f79 100644 --- a/superset-frontend/cypress-base/cypress/e2e/dashboard/editmode.test.ts +++ b/superset-frontend/cypress-base/cypress/e2e/dashboard/editmode.test.ts @@ -663,7 +663,8 @@ describe('Dashboard edit', () => { }); it('should edit the title', () => { - cy.getBySel('dashboard-title-input').clear().type('Edited title'); + cy.getBySel('dashboard-title-input').clear(); + cy.getBySel('dashboard-title-input').type('Edited title'); applyChanges(); cy.getBySel('editable-title-input').should('have.value', 'Edited title'); }); @@ -684,7 +685,8 @@ describe('Dashboard edit', () => { }); it('should edit the title inline', () => { - cy.getBySel('editable-title-input').clear().type('Edited title{enter}'); + cy.getBySel('editable-title-input').clear(); + cy.getBySel('editable-title-input').type('Edited title{enter}'); cy.getBySel('header-save-button').should('be.enabled'); }); @@ -747,7 +749,8 @@ describe('Dashboard edit', () => { 'Click here to learn more about [markdown formatting](https://bit.ly/1dQOfRK)', ); - cy.getBySel('dashboard-markdown-editor').click().type('Test resize'); + cy.getBySel('dashboard-markdown-editor').click(); + cy.getBySel('dashboard-markdown-editor').type('Test resize'); resize( '[data-test="dashboard-markdown-editor"] .resizable-container div.resizable-container-handle--bottom + div', diff --git a/superset-frontend/cypress-base/cypress/e2e/dashboard/tabs.test.ts b/superset-frontend/cypress-base/cypress/e2e/dashboard/tabs.test.ts index 208eb3575..39e937985 100644 --- a/superset-frontend/cypress-base/cypress/e2e/dashboard/tabs.test.ts +++ b/superset-frontend/cypress-base/cypress/e2e/dashboard/tabs.test.ts @@ -57,9 +57,9 @@ describe('Dashboard tabs', () => { it('should switch tabs', () => { topLevelTabs(); + cy.get('@top-level-tabs').first().click(); cy.get('@top-level-tabs') .first() - .click() .should('have.class', 'ant-tabs-tab-active'); cy.get('@top-level-tabs') .last() @@ -68,9 +68,9 @@ describe('Dashboard tabs', () => { cy.getBySel('grid-container').find('.box_plot').should('not.exist'); cy.getBySel('grid-container').find('.line').should('not.exist'); + cy.get('@top-level-tabs').last().click(); cy.get('@top-level-tabs') .last() - .click() .should('have.class', 'ant-tabs-tab-active'); cy.get('@top-level-tabs') .first() @@ -99,7 +99,8 @@ describe('Dashboard tabs', () => { getChartAliasBySpec(TREEMAP).then(treemapAlias => { // apply filter cy.get('.Select__control').first().should('be.visible').click(); - cy.get('.Select__control input[type=text]').first().focus().type('South'); + cy.get('.Select__control input[type=text]').first().focus(); + cy.focused().type('South'); cy.get('.Select__option').contains('South Asia').click(); cy.get('.filter button:not(:disabled)').contains('Apply').click(); @@ -166,18 +167,18 @@ describe('Dashboard tabs', () => { }); it('should update size when switch tab', () => { + cy.get('@top-level-tabs').last().click(); cy.get('@top-level-tabs') .last() - .click() .should('have.class', 'ant-tabs-tab-active'); expandFilterOnLeftPanel(); cy.wait(1000); + cy.get('@top-level-tabs').first().click(); cy.get('@top-level-tabs') .first() - .click() .should('have.class', 'ant-tabs-tab-active'); cy.wait(1000); diff --git a/superset-frontend/cypress-base/cypress/e2e/dashboard/utils.ts b/superset-frontend/cypress-base/cypress/e2e/dashboard/utils.ts index d892c0809..3909d7815 100644 --- a/superset-frontend/cypress-base/cypress/e2e/dashboard/utils.ts +++ b/superset-frontend/cypress-base/cypress/e2e/dashboard/utils.ts @@ -239,15 +239,11 @@ export function enterNativeFilterEditModal(waitForDataset = true) { * @summary helper for adding new filter ************************************************************************* */ export function clickOnAddFilterInModal() { + cy.get(nativeFilters.addFilterButton.button).first().click(); return cy - .get(nativeFilters.addFilterButton.button) - .first() - .click() - .then(() => { - cy.get(nativeFilters.addFilterButton.dropdownItem) - .contains('Filter') - .click({ force: true }); - }); + .get(nativeFilters.addFilterButton.dropdownItem) + .contains('Filter') + .click({ force: true }); } /** ************************************************************************ @@ -272,14 +268,22 @@ export function fillNativeFilterForm( cy.get(nativeFilters.modal.container) .find(nativeFilters.filtersPanel.filterName) .last() - .click({ scrollBehavior: false }) - .clear({ force: true }) + .click({ scrollBehavior: false }); + cy.get(nativeFilters.modal.container) + .find(nativeFilters.filtersPanel.filterName) + .last() + .clear({ force: true }); + cy.get(nativeFilters.modal.container) + .find(nativeFilters.filtersPanel.filterName) + .last() .type(name, { scrollBehavior: false, force: true }); if (dataset) { cy.get(nativeFilters.modal.container) .find(nativeFilters.filtersPanel.datasetName) .last() - .click({ force: true, scrollBehavior: false }) + .click({ force: true, scrollBehavior: false }); + cy.get(nativeFilters.modal.container) + .find(nativeFilters.filtersPanel.datasetName) .type(`${dataset}`, { scrollBehavior: false }); cy.get(nativeFilters.silentLoading).should('not.exist'); cy.get(`[label="${dataset}"]`).click({ multiple: true, force: true }); @@ -339,9 +343,9 @@ export function addParentFilterWithValue(index: number, value: string) { return cy .get(nativeFilters.filterConfigurationSections.displayedSection) .within(() => { + cy.get('input[aria-label="Limit type"]').eq(index).click({ force: true }); cy.get('input[aria-label="Limit type"]') .eq(index) - .click({ force: true }) .type(`${value}{enter}`, { delay: 30, force: true }); }); } diff --git a/superset-frontend/cypress-base/cypress/e2e/dashboard_list/list.test.ts b/superset-frontend/cypress-base/cypress/e2e/dashboard_list/list.test.ts index 917ca1045..1ee8b86bc 100644 --- a/superset-frontend/cypress-base/cypress/e2e/dashboard_list/list.test.ts +++ b/superset-frontend/cypress-base/cypress/e2e/dashboard_list/list.test.ts @@ -240,7 +240,8 @@ describe('Dashboards list', () => { // edits in list-view setGridMode('list'); cy.getBySel('edit-alt').eq(0).click(); - cy.getBySel('dashboard-title-input').clear().type('1 - Sample dashboard'); + cy.getBySel('dashboard-title-input').clear(); + cy.getBySel('dashboard-title-input').type('1 - Sample dashboard'); cy.get('button:contains("Save")').click(); cy.wait('@update'); cy.getBySel('table-row').eq(0).contains('1 - Sample dashboard'); diff --git a/superset-frontend/cypress-base/cypress/e2e/database/modal.test.ts b/superset-frontend/cypress-base/cypress/e2e/database/modal.test.ts index 3cc34cb64..87a0bb923 100644 --- a/superset-frontend/cypress-base/cypress/e2e/database/modal.test.ts +++ b/superset-frontend/cypress-base/cypress/e2e/database/modal.test.ts @@ -62,8 +62,10 @@ describe('Add database', () => { it('show error alerts on dynamic form for bad host', () => { // click postgres dynamic form cy.get('.preferred > :nth-child(1)').click(); - cy.get('input[name="host"]').focus().type('badhost', { force: true }); - cy.get('input[name="port"]').focus().type('5432', { force: true }); + cy.get('input[name="host"]').focus(); + cy.focused().type('badhost', { force: true }); + cy.get('input[name="port"]').focus(); + cy.focused().type('5432', { force: true }); cy.get('.ant-form-item-explain-error').contains( "The hostname provided can't be resolved", ); @@ -72,8 +74,10 @@ describe('Add database', () => { it('show error alerts on dynamic form for bad port', () => { // click postgres dynamic form cy.get('.preferred > :nth-child(1)').click(); - cy.get('input[name="host"]').focus().type('localhost', { force: true }); - cy.get('input[name="port"]').focus().type('123', { force: true }); + cy.get('input[name="host"]').focus(); + cy.focused().type('localhost', { force: true }); + cy.get('input[name="port"]').focus(); + cy.focused().type('123', { force: true }); cy.get('input[name="database"]').focus(); cy.get('.ant-form-item-explain-error').contains('The port is closed'); }); diff --git a/superset-frontend/cypress-base/cypress/e2e/explore/AdhocMetrics.test.ts b/superset-frontend/cypress-base/cypress/e2e/explore/AdhocMetrics.test.ts index b1c0fd56c..fe861c3be 100644 --- a/superset-frontend/cypress-base/cypress/e2e/explore/AdhocMetrics.test.ts +++ b/superset-frontend/cypress-base/cypress/e2e/explore/AdhocMetrics.test.ts @@ -41,12 +41,10 @@ describe('AdhocMetrics', () => { cy.get('[data-test="AdhocMetricEditTitle#trigger"]').click(); cy.get('[data-test="AdhocMetricEditTitle#input"]').type(metricName); - cy.get('input[aria-label="Select column"]') - .click() - .type('num_girls{enter}'); - cy.get('input[aria-label="Select aggregate options"]') - .click() - .type('sum{enter}'); + cy.get('input[aria-label="Select column"]').click(); + cy.get('input[aria-label="Select column"]').type('num_girls{enter}'); + cy.get('input[aria-label="Select aggregate options"]').click(); + cy.get('input[aria-label="Select aggregate options"]').type('sum{enter}'); cy.get('[data-test="AdhocMetricEdit#save"]').contains('Save').click(); diff --git a/superset-frontend/cypress-base/cypress/e2e/explore/_skip.AdhocFilters.test.ts b/superset-frontend/cypress-base/cypress/e2e/explore/_skip.AdhocFilters.test.ts index a4e9c8fe4..d8027d327 100644 --- a/superset-frontend/cypress-base/cypress/e2e/explore/_skip.AdhocFilters.test.ts +++ b/superset-frontend/cypress-base/cypress/e2e/explore/_skip.AdhocFilters.test.ts @@ -35,8 +35,10 @@ describe.skip('AdhocFilters', () => { }); cy.get('[data-test=adhoc_filters]').within(() => { - cy.get('.Select__control').scrollIntoView().click(); - cy.get('input[type=text]').focus().type('name{enter}'); + cy.get('.Select__control').scrollIntoView(); + cy.get('.Select__control').click(); + cy.get('input[type=text]').focus(); + cy.focused().type('name{enter}'); cy.get("div[role='button']").first().click(); }); @@ -54,9 +56,8 @@ describe.skip('AdhocFilters', () => { it('Set simple adhoc filter', () => { cy.get('[aria-label="Comparator option"] .Select__control').click(); - cy.get('[data-test=adhoc-filter-simple-value] input[type=text]') - .focus() - .type('Jack{enter}', { delay: 20 }); + cy.get('[data-test=adhoc-filter-simple-value] input[type=text]').focus(); + cy.focused().type('Jack{enter}', { delay: 20 }); cy.get('[data-test="adhoc-filter-edit-popover-save-button"]').click(); @@ -75,18 +76,15 @@ describe.skip('AdhocFilters', () => { const filterType = 'name'; const filterContent = "'Amy' OR name = 'Donald'"; - cy.get('[data-test=adhoc_filters] .Select__control') - .scrollIntoView() - .click(); + cy.get('[data-test=adhoc_filters] .Select__control').scrollIntoView(); + cy.get('[data-test=adhoc_filters] .Select__control').click(); // remove previous input - cy.get('[data-test=adhoc_filters] input[type=text]') - .focus() - .type('{backspace}'); + cy.get('[data-test=adhoc_filters] input[type=text]').focus(); + cy.focused().type('{backspace}'); - cy.get('[data-test=adhoc_filters] input[type=text]') - .focus() - .type(`${filterType}{enter}`); + cy.get('[data-test=adhoc_filters] input[type=text]').focus(); + cy.focused().type(`${filterType}{enter}`); cy.wait('@filterValues'); diff --git a/superset-frontend/cypress-base/cypress/e2e/explore/advanced_analytics.test.ts b/superset-frontend/cypress-base/cypress/e2e/explore/advanced_analytics.test.ts index 8e52aa6c5..f07704c7b 100644 --- a/superset-frontend/cypress-base/cypress/e2e/explore/advanced_analytics.test.ts +++ b/superset-frontend/cypress-base/cypress/e2e/explore/advanced_analytics.test.ts @@ -37,9 +37,9 @@ describe('Advanced analytics', () => { .find('input[type=search]') .type('28 days{enter}'); + cy.get('[data-test=time_compare]').find('input[type=search]').clear(); cy.get('[data-test=time_compare]') .find('input[type=search]') - .clear() .type('1 year{enter}'); cy.get('button[data-test="run-query-button"]').click(); diff --git a/superset-frontend/cypress-base/cypress/e2e/explore/control.test.ts b/superset-frontend/cypress-base/cypress/e2e/explore/control.test.ts index 2170ad6c9..ccdfcd451 100644 --- a/superset-frontend/cypress-base/cypress/e2e/explore/control.test.ts +++ b/superset-frontend/cypress-base/cypress/e2e/explore/control.test.ts @@ -51,9 +51,9 @@ describe('Datasource control', () => { '[data-test="table-content-rows"] [data-test="editable-title-input"]', ) .first() - .focus() - .clear() - .type(`${newMetricName}{enter}`); + .focus(); + cy.focused().clear(); + cy.focused().type(`${newMetricName}{enter}`); cy.get('[data-test="datasource-modal-save"]').click(); cy.get('.ant-modal-confirm-btns button').contains('OK').click(); @@ -101,9 +101,8 @@ describe('Color scheme control', () => { ); cy.get('.color-scheme-tooltip').contains('Superset Colors'); cy.get('.Control[data-test="color_scheme"]').scrollIntoView(); - cy.get('.Control[data-test="color_scheme"] input[type="search"]') - .focus() - .type('lyftColors{enter}'); + cy.get('.Control[data-test="color_scheme"] input[type="search"]').focus(); + cy.focused().type('lyftColors{enter}'); cy.get( '.Control[data-test="color_scheme"] .ant-select-selection-item [data-test="lyftColors"]', ).should('exist'); @@ -153,14 +152,11 @@ describe('Test datatable', () => { cy.intercept( 'datasource/samples?force=false&datasource_type=table&datasource_id=*', ).as('Samples'); - cy.contains('Samples') - .click() - .then(() => { - cy.wait('@Samples'); - cy.get('.ant-tabs-tab-active').contains('Samples'); - cy.get('[data-test="row-count-label"]').contains('1k rows'); - cy.get('.ant-empty-description').should('not.exist'); - }); + cy.contains('Samples').click(); + cy.wait('@Samples'); + cy.get('.ant-tabs-tab-active').contains('Samples'); + cy.get('[data-test="row-count-label"]').contains('1k rows'); + cy.get('.ant-empty-description').should('not.exist'); }); }); @@ -180,18 +176,15 @@ describe('Time range filter', () => { cy.visitChartByParams(formData); cy.verifySliceSuccess({ waitAlias: '@chartData' }); - cy.get('[data-test=time-range-trigger]') - .click() - .then(() => { - cy.get('.footer').find('button').its('length').should('eq', 2); - cy.get('.ant-popover-content').within(() => { - cy.get('input[value="100 years ago"]'); - cy.get('input[value="now"]'); - }); - cy.get('[data-test=cancel-button]').click(); - cy.wait(500); - cy.get('.ant-popover').should('not.exist'); - }); + cy.get('[data-test=time-range-trigger]').click(); + cy.get('.footer').find('button').its('length').should('eq', 2); + cy.get('.ant-popover-content').within(() => { + cy.get('input[value="100 years ago"]'); + cy.get('input[value="now"]'); + }); + cy.get('[data-test=cancel-button]').click(); + cy.wait(500); + cy.get('.ant-popover').should('not.exist'); }); it('Common time_range params', () => { @@ -205,13 +198,10 @@ describe('Time range filter', () => { cy.visitChartByParams(formData); cy.verifySliceSuccess({ waitAlias: '@chartData' }); - cy.get('[data-test=time-range-trigger]') - .click() - .then(() => { - cy.get('.ant-radio-group').children().its('length').should('eq', 5); - cy.get('.ant-radio-checked + span').contains('Last year'); - cy.get('[data-test=cancel-button]').click(); - }); + cy.get('[data-test=time-range-trigger]').click(); + cy.get('.ant-radio-group').children().its('length').should('eq', 5); + cy.get('.ant-radio-checked + span').contains('Last year'); + cy.get('[data-test=cancel-button]').click(); }); it('Previous time_range params', () => { @@ -225,13 +215,10 @@ describe('Time range filter', () => { cy.visitChartByParams(formData); cy.verifySliceSuccess({ waitAlias: '@chartData' }); - cy.get('[data-test=time-range-trigger]') - .click() - .then(() => { - cy.get('.ant-radio-group').children().its('length').should('eq', 3); - cy.get('.ant-radio-checked + span').contains('previous calendar month'); - cy.get('[data-test=cancel-button]').click(); - }); + cy.get('[data-test=time-range-trigger]').click(); + cy.get('.ant-radio-group').children().its('length').should('eq', 3); + cy.get('.ant-radio-checked + span').contains('previous calendar month'); + cy.get('[data-test=cancel-button]').click(); }); it('Custom time_range params', () => { @@ -245,16 +232,13 @@ describe('Time range filter', () => { cy.visitChartByParams(formData); cy.verifySliceSuccess({ waitAlias: '@chartData' }); - cy.get('[data-test=time-range-trigger]') - .click() - .then(() => { - cy.get('[data-test=custom-frame]').then(() => { - cy.get('.ant-input-number-input-wrap > input') - .invoke('attr', 'value') - .should('eq', '7'); - }); - cy.get('[data-test=cancel-button]').click(); - }); + cy.get('[data-test=time-range-trigger]').click(); + cy.get('[data-test=custom-frame]').then(() => { + cy.get('.ant-input-number-input-wrap > input') + .invoke('attr', 'value') + .should('eq', '7'); + }); + cy.get('[data-test=cancel-button]').click(); }); it('No filter time_range params', () => { @@ -268,11 +252,8 @@ describe('Time range filter', () => { cy.visitChartByParams(formData); cy.verifySliceSuccess({ waitAlias: '@chartData' }); - cy.get('[data-test=time-range-trigger]') - .click() - .then(() => { - cy.get('[data-test=no-filter]'); - }); + cy.get('[data-test=time-range-trigger]').click(); + cy.get('[data-test=no-filter]').should('exist'); cy.get('[data-test=cancel-button]').click(); }); }); @@ -288,7 +269,8 @@ describe('Groupby control', () => { .contains('Drop columns here or click') .click(); cy.get('[id="adhoc-metric-edit-tabs-tab-simple"]').click(); - cy.get('input[aria-label="Column"]').click().type('state{enter}'); + cy.get('input[aria-label="Column"]').click(); + cy.get('input[aria-label="Column"]').type('state{enter}'); cy.get('[data-test="ColumnEdit#save"]').contains('Save').click(); cy.get('button[data-test="run-query-button"]').click(); diff --git a/superset-frontend/cypress-base/cypress/e2e/explore/link.test.ts b/superset-frontend/cypress-base/cypress/e2e/explore/link.test.ts index c41451c51..f9c616ec8 100644 --- a/superset-frontend/cypress-base/cypress/e2e/explore/link.test.ts +++ b/superset-frontend/cypress-base/cypress/e2e/explore/link.test.ts @@ -117,7 +117,9 @@ describe('Test explore links', () => { cy.get('[data-test="query-save-button"]').click(); cy.get('[data-test="saveas-radio"]').check(); - cy.get('[data-test="new-chart-name"]').click().clear().type(newChartName); + cy.get('[data-test="new-chart-name"]').click(); + cy.get('[data-test="new-chart-name"]').clear(); + cy.get('[data-test="new-chart-name"]').type(newChartName); // Add a new option using the "CreatableSelect" feature cy.get('[data-test="save-chart-modal-select-dashboard-form"]') .find('input[aria-label="Select a dashboard"]') @@ -147,7 +149,9 @@ describe('Test explore links', () => { cy.get('[data-test="query-save-button"]').click(); cy.get('[data-test="save-overwrite-radio"]').check(); - cy.get('[data-test="new-chart-name"]').click().clear().type(newChartName); + cy.get('[data-test="new-chart-name"]').click(); + cy.get('[data-test="new-chart-name"]').clear(); + cy.get('[data-test="new-chart-name"]').type(newChartName); // This time around, typing the same dashboard name // will select the existing one cy.get('[data-test="save-chart-modal-select-dashboard-form"]') diff --git a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/area.test.js b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/area.test.js index c95127dd1..78981ed02 100644 --- a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/area.test.js +++ b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/area.test.js @@ -108,9 +108,8 @@ describe('Visualization > Area', () => { 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"] input[type="search"]').focus(); + cy.focused().type('supersetColors{enter}'); cy.get( '.Control[data-test="color_scheme"] .ant-select-selection-item [data-test="supersetColors"]', ).should('exist'); diff --git a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/box_plot.test.js b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/box_plot.test.js index 323dc5c24..1a8c1bca3 100644 --- a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/box_plot.test.js +++ b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/box_plot.test.js @@ -51,9 +51,8 @@ describe('Visualization > Box Plot', () => { 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"] input[type="search"]').focus(); + cy.focused().type('supersetColors{enter}'); cy.get( '.Control[data-test="color_scheme"] .ant-select-selection-item [data-test="supersetColors"]', ).should('exist'); diff --git a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/bubble.test.js b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/bubble.test.js index f3a0dcd2d..0d9915031 100644 --- a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/bubble.test.js +++ b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/bubble.test.js @@ -70,28 +70,26 @@ describe('Visualization > Bubble', () => { }, ], }); - cy.get('[data-test="chart-container"]') - .should('be.visible') - .within(() => { - cy.get('svg').find('.nv-point-clips circle').should('have.length', 8); - }) - .then(nodeList => { - // Check that all circles have same color. - const color = nodeList[0].getAttribute('fill'); - const circles = Array.prototype.slice.call(nodeList); - expect(circles.every(c => c.getAttribute('fill') === color)).to.equal( - true, - ); - }); + cy.get('[data-test="chart-container"]').should('be.visible'); + cy.get('[data-test="chart-container"]').within(() => { + cy.get('svg').find('.nv-point-clips circle').should('have.length', 8); + }); + cy.get('[data-test="chart-container"]').then(nodeList => { + // Check that all circles have same color. + const color = nodeList[0].getAttribute('fill'); + const circles = Array.prototype.slice.call(nodeList); + expect(circles.every(c => c.getAttribute('fill') === color)).to.equal( + true, + ); + }); }); it('should allow type to search color schemes and apply the scheme', () => { cy.visitChartByParams(BUBBLE_FORM_DATA); 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"] input[type="search"]').focus(); + cy.focused().type('supersetColors{enter}'); cy.get( '.Control[data-test="color_scheme"] .ant-select-selection-item [data-test="supersetColors"]', ).should('exist'); diff --git a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/compare.test.js b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/compare.test.js index 11ad6eb57..a844b3017 100644 --- a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/compare.test.js +++ b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/compare.test.js @@ -91,9 +91,8 @@ describe('Visualization > Compare', () => { 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"] input[type="search"]').focus(); + cy.focused().type('supersetColors{enter}'); cy.get( '.Control[data-test="color_scheme"] .ant-select-selection-item [data-test="supersetColors"]', ).should('exist'); diff --git a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/dist_bar.test.js b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/dist_bar.test.js index 8dcba5b75..e208b7892 100644 --- a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/dist_bar.test.js +++ b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/dist_bar.test.js @@ -81,9 +81,8 @@ describe('Visualization > Distribution bar chart', () => { 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"] input[type="search"]').focus(); + cy.focused().type('bnbColors{enter}'); cy.get( '.Control[data-test="color_scheme"] .ant-select-selection-item [data-test="bnbColors"]', ).should('exist'); diff --git a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/gauge.test.js b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/gauge.test.js index e704705c6..12c2d3522 100644 --- a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/gauge.test.js +++ b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/gauge.test.js @@ -66,9 +66,8 @@ describe('Visualization > Gauge', () => { 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"] input[type="search"]').focus(); + cy.focused().type('bnbColors{enter}'); cy.get( '.Control[data-test="color_scheme"] .ant-select-selection-item [data-test="bnbColors"]', ).should('exist'); diff --git a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/graph.test.ts b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/graph.test.ts index ff8eaa629..4f35bb4a2 100644 --- a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/graph.test.ts +++ b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/graph.test.ts @@ -82,9 +82,8 @@ describe('Visualization > Graph', () => { 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"] input[type="search"]').focus(); + cy.focused().type('bnbColors{enter}'); cy.get( '.Control[data-test="color_scheme"] .ant-select-selection-item [data-test="bnbColors"]', ).should('exist'); diff --git a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/histogram.test.ts b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/histogram.test.ts index ba197cf4c..7904bd970 100644 --- a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/histogram.test.ts +++ b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/histogram.test.ts @@ -89,9 +89,8 @@ describe('Visualization > Histogram', () => { 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"] input[type="search"]').focus(); + cy.focused().type('supersetColors{enter}'); cy.get( '.Control[data-test="color_scheme"] .ant-select-selection-item [data-test="supersetColors"]', ).should('exist'); diff --git a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/line.test.ts b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/line.test.ts index 8499db594..070a762e8 100644 --- a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/line.test.ts +++ b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/line.test.ts @@ -51,10 +51,10 @@ describe('Visualization > Line', () => { // Title edit for saved metrics is disabled - switch to Simple cy.get('[id="adhoc-metric-edit-tabs-tab-SIMPLE"]').click(); - cy.get('input[aria-label="Select column"]').click().type('num{enter}'); - cy.get('input[aria-label="Select aggregate options"]') - .click() - .type('sum{enter}'); + cy.get('input[aria-label="Select column"]').click(); + cy.get('input[aria-label="Select column"]').type('num{enter}'); + cy.get('input[aria-label="Select aggregate options"]').click(); + cy.get('input[aria-label="Select aggregate options"]').type('sum{enter}'); cy.get('[data-test="AdhocMetricEdit#save"]').contains('Save').click(); cy.get('[data-test="metrics-header"]').contains('Metrics'); @@ -77,9 +77,8 @@ describe('Visualization > Line', () => { 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"] input[type="search"]').focus(); + cy.focused().type('bnbColors{enter}'); cy.get( '.Control[data-test="color_scheme"] .ant-select-selection-item [data-test="bnbColors"]', ).should('exist'); diff --git a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/pie.test.js b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/pie.test.js index f853cf128..e92b691e1 100644 --- a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/pie.test.js +++ b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/pie.test.js @@ -73,9 +73,8 @@ describe('Visualization > Pie', () => { 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"] input[type="search"]').focus(); + cy.focused().type('supersetColors{enter}'); cy.get( '.Control[data-test="color_scheme"] .ant-select-selection-item [data-test="supersetColors"]', ).should('exist'); diff --git a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/sankey.test.js b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/sankey.test.js index e5139bee1..e5e6dc240 100644 --- a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/sankey.test.js +++ b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/sankey.test.js @@ -78,9 +78,8 @@ describe('Visualization > Sankey', () => { 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"] input[type="search"]').focus(); + cy.focused().type('bnbColors{enter}'); cy.get( '.Control[data-test="color_scheme"] .ant-select-selection-item [data-test="bnbColors"]', ).should('exist'); diff --git a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/sunburst.test.js b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/sunburst.test.js index 4d55d592c..76eea9fc1 100644 --- a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/sunburst.test.js +++ b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/sunburst.test.js @@ -88,9 +88,8 @@ describe('Visualization > Sunburst', () => { 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"] input[type="search"]').focus(); + cy.focused().type('supersetColors{enter}'); cy.get( '.Control[data-test="color_scheme"] .ant-select-selection-item [data-test="supersetColors"]', ).should('exist'); diff --git a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/table.test.ts b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/table.test.ts index 425e5e694..6d93cd47f 100644 --- a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/table.test.ts +++ b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/table.test.ts @@ -126,7 +126,8 @@ describe('Visualization > Table', () => { // should handle frontend sorting correctly cy.get('.chart-container th').contains('name').click(); cy.get('.chart-container td:nth-child(2):eq(0)').contains('Adam'); - cy.get('.chart-container th').contains('ds').click().click(); + cy.get('.chart-container th').contains('ds').click(); + cy.get('.chart-container th').contains('ds').click(); cy.get('.chart-container td:nth-child(1):eq(0)').contains('2008'); }); diff --git a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/world_map.test.js b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/world_map.test.js index f92fbf58e..73a54a8e2 100644 --- a/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/world_map.test.js +++ b/superset-frontend/cypress-base/cypress/e2e/explore/visualizations/world_map.test.js @@ -84,9 +84,10 @@ describe('Visualization > World Map', () => { verify(WORLD_MAP_FORM_DATA); 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"] input[type="search"]', + ).focus(); + cy.focused().type('greens{enter}'); cy.get( '.Control[data-test="linear_color_scheme"] .ant-select-selection-item [data-test="greens"]', ).should('exist'); diff --git a/superset-frontend/cypress-base/cypress/e2e/sqllab/query.test.ts b/superset-frontend/cypress-base/cypress/e2e/sqllab/query.test.ts index 0c0c03355..be758ed6d 100644 --- a/superset-frontend/cypress-base/cypress/e2e/sqllab/query.test.ts +++ b/superset-frontend/cypress-base/cypress/e2e/sqllab/query.test.ts @@ -39,14 +39,12 @@ describe('SqlLab query panel', () => { }).as('mockSQLResponse'); cy.get('.TableSelector .Select:eq(0)').click(); - cy.get('.TableSelector .Select:eq(0) input[type=text]') - .focus() - .type('{enter}'); + cy.get('.TableSelector .Select:eq(0) input[type=text]').focus(); + cy.focused().type('{enter}'); - cy.get('#brace-editor textarea') - .focus() - .clear() - .type(`{selectall}{backspace}SELECT 1`); + cy.get('#brace-editor textarea').focus(); + cy.focused().clear(); + cy.focused().type(`{selectall}{backspace}SELECT 1`); cy.get('#js-sql-toolbar button:eq(0)').eq(0).click(); @@ -92,11 +90,12 @@ describe('SqlLab query panel', () => { let initialResultsTable: HTMLElement | null = null; let savedQueryResultsTable = null; - cy.get('#brace-editor textarea') - .clear({ force: true }) - .type(`{selectall}{backspace}${query}`, { force: true }) - .focus() // focus => blur is required for updating the query that is to be saved - .blur(); + cy.get('#brace-editor textarea').clear({ force: true }); + cy.get('#brace-editor textarea').type(`{selectall}{backspace}${query}`, { + force: true, + }); + cy.get('#brace-editor textarea').focus(); // focus => blur is required for updating the query that is to be saved + cy.focused().blur(); // ctrl + r also runs query cy.get('#brace-editor textarea').type('{ctrl}r', { force: true }); @@ -113,11 +112,10 @@ describe('SqlLab query panel', () => { .click(); // Enter name + save into modal - cy.get('.modal-sm input') - .clear({ force: true }) - .type(`{selectall}{backspace}${savedQueryTitle}`, { - force: true, - }); + cy.get('.modal-sm input').clear({ force: true }); + cy.get('.modal-sm input').type(`{selectall}{backspace}${savedQueryTitle}`, { + force: true, + }); cy.get('.modal-sm .modal-body button') .eq(0) // save @@ -159,10 +157,9 @@ describe('SqlLab query panel', () => { const query = 'SELECT gender, name FROM birth_names'; - cy.get('.ace_text-input') - .focus() - .clear({ force: true }) - .type(`{selectall}{backspace}${query}`, { force: true }); + cy.get('.ace_text-input').focus(); + cy.focused().clear({ force: true }); + cy.focused().type(`{selectall}{backspace}${query}`, { force: true }); cy.get('.sql-toolbar button').contains('Run').click(); cy.wait('@queryFinished'); diff --git a/superset-frontend/cypress-base/cypress/utils/index.ts b/superset-frontend/cypress-base/cypress/utils/index.ts index 3ad7f7bb8..6b6f444b8 100644 --- a/superset-frontend/cypress-base/cypress/utils/index.ts +++ b/superset-frontend/cypress-base/cypress/utils/index.ts @@ -106,8 +106,12 @@ export function drag(selector: string, content: string | number | RegExp) { to(target: string | Cypress.Chainable) { cy.get('.dragdroppable') .contains(selector, content) - .trigger('mousedown', { which: 1, force: true }) - .trigger('dragstart', { dataTransfer, force: true }) + .trigger('mousedown', { which: 1, force: true }); + cy.get('.dragdroppable') + .contains(selector, content) + .trigger('dragstart', { dataTransfer, force: true }); + cy.get('.dragdroppable') + .contains(selector, content) .trigger('drag', { force: true }); (typeof target === 'string' ? cy.get(target) : target) @@ -122,10 +126,14 @@ export function drag(selector: string, content: string | number | RegExp) { export function resize(selector: string) { return { to(cordX: number, cordY: number) { - cy.get(selector) - .trigger('mousedown', { which: 1, force: true }) - .trigger('mousemove', { which: 1, cordX, cordY, force: true }) - .trigger('mouseup', { which: 1, force: true }); + cy.get(selector).trigger('mousedown', { which: 1, force: true }); + cy.get(selector).trigger('mousemove', { + which: 1, + cordX, + cordY, + force: true, + }); + cy.get(selector).trigger('mouseup', { which: 1, force: true }); }, }; } diff --git a/superset-frontend/cypress-base/package-lock.json b/superset-frontend/cypress-base/package-lock.json index e85cf8741..db07fcb3d 100644 --- a/superset-frontend/cypress-base/package-lock.json +++ b/superset-frontend/cypress-base/package-lock.json @@ -23,7 +23,7 @@ "devDependencies": { "@types/querystringify": "^2.0.0", "cypress": "^10.11.0", - "eslint-plugin-cypress": "^2.12.1" + "eslint-plugin-cypress": "^3.5.0" } }, "node_modules/@ampproject/remapping": { @@ -5377,15 +5377,42 @@ } }, "node_modules/eslint-plugin-cypress": { - "version": "2.12.1", - "resolved": "https://registry.npmjs.org/eslint-plugin-cypress/-/eslint-plugin-cypress-2.12.1.tgz", - "integrity": "sha512-c2W/uPADl5kospNDihgiLc7n87t5XhUbFDoTl6CfVkmG+kDAb5Ux10V9PoLPu9N+r7znpc+iQlcmAqT1A/89HA==", + "version": "3.5.0", + "resolved": "https://registry.npmjs.org/eslint-plugin-cypress/-/eslint-plugin-cypress-3.5.0.tgz", + "integrity": "sha512-JZQ6XnBTNI8h1B9M7wJSFzc48SYbh7VMMKaNTQOFa3BQlnmXPrVc4PKen8R+fpv6VleiPeej6VxloGb42zdRvw==", "dev": true, "dependencies": { - "globals": "^11.12.0" + "globals": "^13.20.0" }, "peerDependencies": { - "eslint": ">= 3.2.1" + "eslint": ">=7" + } + }, + "node_modules/eslint-plugin-cypress/node_modules/globals": { + "version": "13.24.0", + "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz", + "integrity": "sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==", + "dev": true, + "dependencies": { + "type-fest": "^0.20.2" + }, + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/eslint-plugin-cypress/node_modules/type-fest": { + "version": "0.20.2", + "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.20.2.tgz", + "integrity": "sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==", + "dev": true, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" } }, "node_modules/eslint-scope": { @@ -14656,12 +14683,29 @@ } }, "eslint-plugin-cypress": { - "version": "2.12.1", - "resolved": "https://registry.npmjs.org/eslint-plugin-cypress/-/eslint-plugin-cypress-2.12.1.tgz", - "integrity": "sha512-c2W/uPADl5kospNDihgiLc7n87t5XhUbFDoTl6CfVkmG+kDAb5Ux10V9PoLPu9N+r7znpc+iQlcmAqT1A/89HA==", + "version": "3.5.0", + "resolved": "https://registry.npmjs.org/eslint-plugin-cypress/-/eslint-plugin-cypress-3.5.0.tgz", + "integrity": "sha512-JZQ6XnBTNI8h1B9M7wJSFzc48SYbh7VMMKaNTQOFa3BQlnmXPrVc4PKen8R+fpv6VleiPeej6VxloGb42zdRvw==", "dev": true, "requires": { - "globals": "^11.12.0" + "globals": "^13.20.0" + }, + "dependencies": { + "globals": { + "version": "13.24.0", + "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz", + "integrity": "sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==", + "dev": true, + "requires": { + "type-fest": "^0.20.2" + } + }, + "type-fest": { + "version": "0.20.2", + "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.20.2.tgz", + "integrity": "sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==", + "dev": true + } } }, "eslint-scope": { diff --git a/superset-frontend/cypress-base/package.json b/superset-frontend/cypress-base/package.json index d98bff519..d2a01ec71 100644 --- a/superset-frontend/cypress-base/package.json +++ b/superset-frontend/cypress-base/package.json @@ -30,6 +30,6 @@ "devDependencies": { "@types/querystringify": "^2.0.0", "cypress": "^10.11.0", - "eslint-plugin-cypress": "^2.12.1" + "eslint-plugin-cypress": "^3.5.0" } } diff --git a/superset-frontend/package-lock.json b/superset-frontend/package-lock.json index 718e6b668..b83e5109d 100644 --- a/superset-frontend/package-lock.json +++ b/superset-frontend/package-lock.json @@ -228,7 +228,7 @@ "eslint-config-airbnb": "^19.0.4", "eslint-config-prettier": "^7.2.0", "eslint-import-resolver-typescript": "^3.6.1", - "eslint-plugin-cypress": "^2.11.2", + "eslint-plugin-cypress": "^3.5.0", "eslint-plugin-file-progress": "^1.4.0", "eslint-plugin-import": "^2.24.2", "eslint-plugin-jest": "^27.8.0", @@ -23168,14 +23168,42 @@ "license": "MIT" }, "node_modules/eslint-plugin-cypress": { - "version": "2.11.2", + "version": "3.5.0", + "resolved": "https://registry.npmjs.org/eslint-plugin-cypress/-/eslint-plugin-cypress-3.5.0.tgz", + "integrity": "sha512-JZQ6XnBTNI8h1B9M7wJSFzc48SYbh7VMMKaNTQOFa3BQlnmXPrVc4PKen8R+fpv6VleiPeej6VxloGb42zdRvw==", "dev": true, - "license": "MIT", "dependencies": { - "globals": "^11.12.0" + "globals": "^13.20.0" }, "peerDependencies": { - "eslint": ">= 3.2.1" + "eslint": ">=7" + } + }, + "node_modules/eslint-plugin-cypress/node_modules/globals": { + "version": "13.24.0", + "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz", + "integrity": "sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==", + "dev": true, + "dependencies": { + "type-fest": "^0.20.2" + }, + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/eslint-plugin-cypress/node_modules/type-fest": { + "version": "0.20.2", + "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.20.2.tgz", + "integrity": "sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==", + "dev": true, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" } }, "node_modules/eslint-plugin-file-progress": { @@ -74088,10 +74116,29 @@ } }, "eslint-plugin-cypress": { - "version": "2.11.2", + "version": "3.5.0", + "resolved": "https://registry.npmjs.org/eslint-plugin-cypress/-/eslint-plugin-cypress-3.5.0.tgz", + "integrity": "sha512-JZQ6XnBTNI8h1B9M7wJSFzc48SYbh7VMMKaNTQOFa3BQlnmXPrVc4PKen8R+fpv6VleiPeej6VxloGb42zdRvw==", "dev": true, "requires": { - "globals": "^11.12.0" + "globals": "^13.20.0" + }, + "dependencies": { + "globals": { + "version": "13.24.0", + "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz", + "integrity": "sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==", + "dev": true, + "requires": { + "type-fest": "^0.20.2" + } + }, + "type-fest": { + "version": "0.20.2", + "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.20.2.tgz", + "integrity": "sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==", + "dev": true + } } }, "eslint-plugin-file-progress": { diff --git a/superset-frontend/package.json b/superset-frontend/package.json index 20afe43bd..220a84dbf 100644 --- a/superset-frontend/package.json +++ b/superset-frontend/package.json @@ -294,7 +294,7 @@ "eslint-config-airbnb": "^19.0.4", "eslint-config-prettier": "^7.2.0", "eslint-import-resolver-typescript": "^3.6.1", - "eslint-plugin-cypress": "^2.11.2", + "eslint-plugin-cypress": "^3.5.0", "eslint-plugin-file-progress": "^1.4.0", "eslint-plugin-import": "^2.24.2", "eslint-plugin-jest": "^27.8.0",