You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by di...@apache.org on 2022/09/30 14:06:08 UTC
[superset] 02/02: Add tests Tier1 and Tier2
This is an automated email from the ASF dual-hosted git repository.
diegopucci pushed a commit to branch chore/d2d-e2e-tests
in repository https://gitbox.apache.org/repos/asf/superset.git
commit afbd997d8810ec42fe1d375368e3c11b8a50cdeb
Author: geido <di...@gmail.com>
AuthorDate: Fri Sep 30 17:05:39 2022 +0300
Add tests Tier1 and Tier2
---
.../integration/dashboard/drilltodetail.test.ts | 608 +++++++++++++++++++--
1 file changed, 552 insertions(+), 56 deletions(-)
diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard/drilltodetail.test.ts b/superset-frontend/cypress-base/cypress/integration/dashboard/drilltodetail.test.ts
index d44f6a27e4..4d83f854f6 100644
--- a/superset-frontend/cypress-base/cypress/integration/dashboard/drilltodetail.test.ts
+++ b/superset-frontend/cypress-base/cypress/integration/dashboard/drilltodetail.test.ts
@@ -42,10 +42,13 @@ function openModalFromMenu(chartType: string) {
function openModalFromChartContext(targetMenuItem: string) {
interceptSamples();
+ cy.wait(500);
cy.get('.ant-dropdown')
.not('.ant-dropdown-hidden')
+ .first()
.find("[role='menu'] [role='menuitem']")
- .should('contain', targetMenuItem)
+ .contains(targetMenuItem)
+ .first()
.click();
cy.wait('@samples');
}
@@ -130,90 +133,322 @@ describe('Drill to detail modal', () => {
});
});
+ describe('Big number total', () => {
+ it('opens the modal with no filters', () => {
+ 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();
+
+ openModalFromChartContext('Drill to detail');
+
+ cy.getBySel('filter-val').should('not.exist');
+ });
+ });
+
+ describe('Big number with trendline', () => {
+ it('opens the modal with the correct data', () => {
+ interceptSamples();
+
+ // opens the modal by clicking on the number
+ cy.get("[data-test-viz-type='big_number'] .header-line")
+ .scrollIntoView()
+ .rightclick();
+
+ openModalFromChartContext('Drill to detail');
+
+ cy.getBySel('filter-val').should('not.exist');
+
+ closeModal();
+
+ // opens the modal by clicking on the trendline
+ cy.get("[data-test-viz-type='big_number'] canvas").then($canvas => {
+ cy.wrap($canvas).scrollIntoView().click(1, 18).rightclick(1, 18);
+
+ openModalFromChartContext('Drill to detail by 1965-01-01');
+
+ // checking the filter
+ cy.getBySel('filter-val').should('contain', '1965-01-01');
+ });
+ });
+ });
+
+ describe('Table', () => {
+ it('opens the modal with the correct filters', () => {
+ interceptSamples();
+
+ cy.get("[data-test-viz-type='table']")
+ .scrollIntoView()
+ .contains('boy')
+ .rightclick();
+
+ openModalFromChartContext('Drill to detail by boy');
+
+ cy.getBySel('filter-val').should('contain', 'boy');
+
+ closeModal();
+
+ cy.get("[data-test-viz-type='table']")
+ .scrollIntoView()
+ .contains('girl')
+ .rightclick();
+
+ openModalFromChartContext('Drill to detail by girl');
+
+ cy.getBySel('filter-val').should('contain', 'girl');
+ });
+ });
+
+ describe('Pivot Table V2', () => {
+ it('opens the modal with the correct filters', () => {
+ interceptSamples();
+
+ cy.get("[data-test-viz-type='pivot_table_v2']")
+ .scrollIntoView()
+ .find('[role="gridcell"]')
+ .first()
+ .rightclick();
+
+ openModalFromChartContext('Drill to detail by boy');
+
+ cy.getBySel('filter-val').should('contain', 'boy');
+ closeModal();
+
+ cy.get("[data-test-viz-type='pivot_table_v2']")
+ .scrollIntoView()
+ .find('[role="gridcell"]')
+ .first()
+ .rightclick();
+
+ openModalFromChartContext('Drill to detail by CA');
+
+ cy.getBySel('filter-val').should('contain', 'CA');
+ closeModal();
+
+ cy.get("[data-test-viz-type='pivot_table_v2']")
+ .scrollIntoView()
+ .find('[role="gridcell"]')
+ .eq(3)
+ .rightclick();
+
+ openModalFromChartContext('Drill to detail by girl');
+
+ cy.getBySel('filter-val').should('contain', 'girl');
+ closeModal();
+
+ cy.get("[data-test-viz-type='pivot_table_v2']")
+ .scrollIntoView()
+ .find('[role="gridcell"]')
+ .eq(3)
+ .rightclick();
+
+ openModalFromChartContext('Drill to detail by FL');
+
+ cy.getBySel('filter-val').should('contain', 'FL');
+ closeModal();
+
+ cy.get("[data-test-viz-type='pivot_table_v2']")
+ .scrollIntoView()
+ .find('[role="gridcell"]')
+ .eq(3)
+ .rightclick();
+
+ openModalFromChartContext('Drill to detail by all');
+
+ cy.getBySel('filter-val').first().should('contain', 'girl');
+ cy.getBySel('filter-val').eq(1).should('contain', 'FL');
+ });
+ });
+
+ describe('Time-Series Line Chart', () => {
+ it('opens the modal with the correct filters', () => {
+ interceptSamples();
+
+ cy.get("[data-test-viz-type='echarts_timeseries_line'] canvas").then(
+ $canvas => {
+ cy.wrap($canvas).scrollIntoView().click(70, 93).rightclick(70, 93);
+
+ openModalFromChartContext('Drill to detail by 1965');
+ cy.getBySel('filter-val').should('contain', '1965');
+ closeModal();
+
+ cy.wrap($canvas).scrollIntoView().click(70, 93).rightclick(70, 93);
+
+ openModalFromChartContext('Drill to detail by boy');
+ cy.getBySel('filter-val').should('contain', 'boy');
+ closeModal();
+
+ cy.wrap($canvas).scrollIntoView().click(70, 93).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()
+ .click(70, 145)
+ .rightclick(70, 145);
+ openModalFromChartContext('Drill to detail by girl');
+ cy.getBySel('filter-val').should('contain', 'girl');
+ closeModal();
+
+ cy.wrap($canvas)
+ .scrollIntoView()
+ .click(70, 145)
+ .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');
+ },
+ );
+ });
+ });
+
describe('Time-series Bar Chart V2', () => {
it('opens the modal with the correct filters', () => {
interceptSamples();
cy.get("[data-test-viz-type='echarts_timeseries_bar'] canvas").then(
$canvas => {
+ cy.wrap($canvas).scrollIntoView().rightclick(70, 100);
+
+ openModalFromChartContext('Drill to detail by 1965');
+ cy.getBySel('filter-val').should('contain', '1965');
+ closeModal();
+
+ cy.wrap($canvas).scrollIntoView().rightclick(70, 100);
+
+ openModalFromChartContext('Drill to detail by boy');
+ cy.getBySel('filter-val').should('contain', 'boy');
+ closeModal();
+
+ cy.wrap($canvas).scrollIntoView().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);
+
+ openModalFromChartContext('Drill to detail by girl');
+ cy.getBySel('filter-val').should('contain', 'girl');
+ closeModal();
+
cy.wrap($canvas)
.scrollIntoView()
- .rightclick(70, 100, { force: true });
- cy.get('.ant-dropdown')
- .not('.ant-dropdown-hidden')
- .find("[role='menu'] [role='menuitem']")
- .should('have.length', 3)
- .then($menuitems => {
- expect($menuitems).to.contain('Drill to detail by 1965');
- expect($menuitems).to.contain('Drill to detail by boy');
- expect($menuitems).to.contain('Drill to detail by all');
- })
- .eq(2)
- .click();
- cy.wait('@samples');
-
- cy.getBySel('filter-val').then($filters => {
- expect($filters).to.contain('1965');
- expect($filters).to.contain('boy');
- });
+ .click(70, 145)
+ .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');
},
);
});
});
- describe('Pie', () => {
+ describe('Time-Series Area Chart', () => {
it('opens the modal with the correct filters', () => {
interceptSamples();
- // opens the modal by clicking on the slice of the Pie chart
- cy.get("[data-test-viz-type='pie'] canvas").then($canvas => {
- const canvasWidth = $canvas.width() || 0;
- const canvasHeight = $canvas.height() || 0;
- const canvasCenterX = canvasWidth / 3;
- const canvasCenterY = canvasHeight / 2;
+ cy.get("[data-test-viz-type='echarts_area'] canvas").then($canvas => {
+ cy.wrap($canvas).scrollIntoView().click(70, 93).rightclick(70, 93);
- cy.wrap($canvas)
- .scrollIntoView()
- .rightclick(canvasCenterX, canvasCenterY, { force: true });
+ openModalFromChartContext('Drill to detail by 1965');
+ cy.getBySel('filter-val').should('contain', '1965');
+ closeModal();
- openModalFromChartContext('Drill to detail by girl');
+ cy.wrap($canvas).scrollIntoView().click(70, 93).rightclick(70, 93);
+
+ openModalFromChartContext('Drill to detail by boy');
+ cy.getBySel('filter-val').should('contain', 'boy');
+ closeModal();
- // checking the filtered and paginated data
+ cy.wrap($canvas).scrollIntoView().click(70, 93).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().click(70, 145).rightclick(70, 145);
+ openModalFromChartContext('Drill to detail by girl');
cy.getBySel('filter-val').should('contain', 'girl');
+ closeModal();
+
+ cy.wrap($canvas).scrollIntoView().click(70, 145).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');
});
});
});
- describe('Big number total', () => {
- it('opens the modal with no filters', () => {
+ describe('Time-Series Scatter Chart', () => {
+ it('opens the modal with the correct filters', () => {
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='echarts_timeseries_scatter'] canvas").then(
+ $canvas => {
+ cy.wrap($canvas).scrollIntoView().click(70, 93).rightclick(70, 93);
- openModalFromChartContext('Drill to detail');
+ openModalFromChartContext('Drill to detail by 1965');
+ cy.getBySel('filter-val').should('contain', '1965');
+ closeModal();
- cy.getBySel('filter-val').should('not.exist');
+ cy.wrap($canvas).scrollIntoView().click(70, 93).rightclick(70, 93);
+
+ openModalFromChartContext('Drill to detail by boy');
+ cy.getBySel('filter-val').should('contain', 'boy');
+ closeModal();
+
+ cy.wrap($canvas).scrollIntoView().click(70, 93).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()
+ .click(70, 145)
+ .rightclick(70, 145);
+ openModalFromChartContext('Drill to detail by girl');
+ cy.getBySel('filter-val').should('contain', 'girl');
+ closeModal();
+
+ cy.wrap($canvas)
+ .scrollIntoView()
+ .click(70, 145)
+ .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');
+ },
+ );
});
});
- describe('Big number with trendline', () => {
- it('opens the modal with the correct data', () => {
+ describe('Pie', () => {
+ it('opens the modal with the correct filters', () => {
interceptSamples();
- // opens the modal by clicking on the number
- cy.get("[data-test-viz-type='big_number'] .header-line")
- .scrollIntoView()
- .rightclick();
+ // 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);
- openModalFromChartContext('Drill to detail');
+ openModalFromChartContext('Drill to detail by girl');
+ cy.getBySel('filter-val').should('contain', 'girl');
+ closeModal();
- cy.getBySel('filter-val').should('not.exist');
+ cy.wrap($canvas).scrollIntoView().rightclick(230, 190);
- // TODO: test clicking on a trendline
- // Cypress is refusing to rightclick on the dot
+ openModalFromChartContext('Drill to detail by boy');
+ cy.getBySel('filter-val').should('contain', 'boy');
+ });
});
});
});
@@ -274,21 +509,282 @@ describe('Drill to detail modal', () => {
it('opens the modal with the correct filters', () => {
interceptSamples();
- // opens the modal by clicking on the box on the chart
cy.get("[data-test-viz-type='box_plot'] canvas").then($canvas => {
- const canvasWidth = $canvas.width() || 0;
- const canvasHeight = $canvas.height() || 0;
- const canvasCenterX = canvasWidth / 3;
- const canvasCenterY = (canvasHeight * 5) / 6;
+ cy.wrap($canvas)
+ .scrollIntoView()
+ .click(135, 275)
+ .rightclick(135, 275);
+
+ openModalFromChartContext('Drill to detail by boy');
+ cy.getBySel('filter-val').should('contain', 'boy');
+ closeModal();
cy.wrap($canvas)
.scrollIntoView()
- .rightclick(canvasCenterX, canvasCenterY, { force: true });
+ .click(270, 280)
+ .rightclick(270, 280);
+
+ openModalFromChartContext('Drill to detail by girl');
+ cy.getBySel('filter-val').should('contain', 'girl');
+ });
+ });
+ });
+
+ describe('Time-Series Generic Chart', () => {
+ it('opens the modal with the correct filters', () => {
+ interceptSamples();
+
+ cy.get("[data-test-viz-type='echarts_timeseries'] canvas").then(
+ $canvas => {
+ cy.wrap($canvas).scrollIntoView().click(70, 93).rightclick(70, 93);
+
+ openModalFromChartContext('Drill to detail by 1965');
+ cy.getBySel('filter-val').should('contain', '1965');
+ closeModal();
+
+ cy.wrap($canvas).scrollIntoView().click(70, 93).rightclick(70, 93);
+
+ openModalFromChartContext('Drill to detail by boy');
+ cy.getBySel('filter-val').should('contain', 'boy');
+ closeModal();
+
+ cy.wrap($canvas).scrollIntoView().click(70, 93).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()
+ .click(70, 145)
+ .rightclick(70, 145);
+ openModalFromChartContext('Drill to detail by girl');
+ cy.getBySel('filter-val').should('contain', 'girl');
+
+ closeModal();
+
+ cy.wrap($canvas)
+ .scrollIntoView()
+ .click(70, 145)
+ .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');
+ },
+ );
+ });
+ });
+
+ describe('Time-Series Smooth Chart', () => {
+ it('opens the modal with the correct filters', () => {
+ interceptSamples();
+
+ cy.get("[data-test-viz-type='echarts_timeseries_smooth'] canvas").then(
+ $canvas => {
+ cy.wrap($canvas).scrollIntoView().click(70, 93).rightclick(70, 93);
+
+ openModalFromChartContext('Drill to detail by 1965');
+ cy.getBySel('filter-val').should('contain', '1965');
+ closeModal();
+
+ cy.wrap($canvas).scrollIntoView().click(70, 93).rightclick(70, 93);
+
+ openModalFromChartContext('Drill to detail by boy');
+ cy.getBySel('filter-val').should('contain', 'boy');
+ closeModal();
+
+ cy.wrap($canvas).scrollIntoView().click(70, 93).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()
+ .click(70, 145)
+ .rightclick(70, 145);
+ openModalFromChartContext('Drill to detail by girl');
+ cy.getBySel('filter-val').should('contain', 'girl');
+
+ closeModal();
+
+ cy.wrap($canvas)
+ .scrollIntoView()
+ .click(70, 145)
+ .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');
+ },
+ );
+ });
+ });
+
+ describe('Time-Series Step Line Chart', () => {
+ it('opens the modal with the correct filters', () => {
+ interceptSamples();
+
+ cy.get("[data-test-viz-type='echarts_timeseries_step'] canvas").then(
+ $canvas => {
+ cy.wrap($canvas).scrollIntoView().click(70, 93).rightclick(70, 93);
+
+ openModalFromChartContext('Drill to detail by 1965');
+ cy.getBySel('filter-val').should('contain', '1965');
+ closeModal();
+
+ cy.wrap($canvas).scrollIntoView().click(70, 93).rightclick(70, 93);
+
+ openModalFromChartContext('Drill to detail by boy');
+ cy.getBySel('filter-val').should('contain', 'boy');
+ closeModal();
+
+ cy.wrap($canvas).scrollIntoView().click(70, 93).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()
+ .click(70, 145)
+ .rightclick(70, 145);
+ openModalFromChartContext('Drill to detail by girl');
+ cy.getBySel('filter-val').should('contain', 'girl');
+
+ closeModal();
+
+ cy.wrap($canvas)
+ .scrollIntoView()
+ .click(70, 145)
+ .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');
+ },
+ );
+ });
+ });
+
+ describe('Funnel Chart', () => {
+ it('opens the modal with the correct filters', () => {
+ interceptSamples();
+
+ cy.get("[data-test-viz-type='funnel'] canvas").then($canvas => {
+ cy.wrap($canvas).scrollIntoView().rightclick(170, 90);
openModalFromChartContext('Drill to detail by boy');
+ cy.getBySel('filter-val').should('contain', 'boy');
+ closeModal();
- // checking the filter
+ cy.wrap($canvas).scrollIntoView().rightclick(190, 250);
+
+ openModalFromChartContext('Drill to detail by girl');
+ cy.getBySel('filter-val').should('contain', 'girl');
+ });
+ });
+ });
+
+ describe('Gauge Chart', () => {
+ it('opens the modal with the correct filters', () => {
+ interceptSamples();
+
+ cy.get("[data-test-viz-type='gauge_chart'] canvas").then($canvas => {
+ cy.wrap($canvas).scrollIntoView().rightclick(135, 95);
+
+ openModalFromChartContext('Drill to detail by boy');
cy.getBySel('filter-val').should('contain', 'boy');
+ closeModal();
+
+ cy.wrap($canvas).scrollIntoView().rightclick(95, 135);
+
+ openModalFromChartContext('Drill to detail by girl');
+ cy.getBySel('filter-val').should('contain', 'girl');
+ });
+ });
+ });
+
+ describe('Mixed Chart', () => {
+ it('opens the modal with the correct filters', () => {
+ interceptSamples();
+
+ cy.get("[data-test-viz-type='mixed_timeseries'] canvas").then(
+ $canvas => {
+ cy.wrap($canvas).scrollIntoView().click(70, 93).rightclick(70, 93);
+
+ openModalFromChartContext('Drill to detail by 1965');
+ cy.getBySel('filter-val').should('contain', '1965');
+ closeModal();
+
+ cy.wrap($canvas).scrollIntoView().click(70, 93).rightclick(70, 93);
+
+ openModalFromChartContext('Drill to detail by boy');
+ cy.getBySel('filter-val').should('contain', 'boy');
+ closeModal();
+
+ cy.wrap($canvas).scrollIntoView().click(70, 93).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()
+ .click(70, 145)
+ .rightclick(70, 145);
+ openModalFromChartContext('Drill to detail by girl');
+ cy.getBySel('filter-val').should('contain', 'girl');
+ closeModal();
+
+ cy.wrap($canvas)
+ .scrollIntoView()
+ .click(70, 145)
+ .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');
+ },
+ );
+ });
+ });
+
+ describe('Radar Chart', () => {
+ it('opens the modal with the correct filters', () => {
+ interceptSamples();
+
+ cy.get("[data-test-viz-type='radar'] canvas").then($canvas => {
+ cy.wrap($canvas).scrollIntoView().rightclick(180, 45);
+
+ openModalFromChartContext('Drill to detail by boy');
+ cy.getBySel('filter-val').should('contain', 'boy');
+ closeModal();
+
+ cy.wrap($canvas).scrollIntoView().rightclick(180, 85);
+
+ openModalFromChartContext('Drill to detail by girl');
+ cy.getBySel('filter-val').should('contain', 'girl');
+ });
+ });
+ });
+
+ describe('Treemap V2', () => {
+ it('opens the modal with the correct filters', () => {
+ interceptSamples();
+
+ cy.get("[data-test-viz-type='treemap_v2'] canvas").then($canvas => {
+ cy.wrap($canvas).scrollIntoView().rightclick(100, 30);
+
+ openModalFromChartContext('Drill to detail by boy');
+ cy.getBySel('filter-val').should('contain', 'boy');
+ closeModal();
+
+ cy.wrap($canvas).scrollIntoView().rightclick(150, 250);
+
+ openModalFromChartContext('Drill to detail by girl');
+ cy.getBySel('filter-val').should('contain', 'girl');
});
});
});