Skip to content
Snippets Groups Projects
Unverified Commit eb2335e0 authored by Nemanja Glumac's avatar Nemanja Glumac Committed by GitHub
Browse files

[E2E] Fix Percy flake `parameters-widget` (#28572) 

* Limit the number of results for better performance

* Set the viewport dimensions in the test config

This prevents window resizing and reduces or completely removes the flake,
which was Cypress complaining that the icon "pencil" is still animating when it
tries to click on it.

https://docs.cypress.io/guides/references/error-messages#cy-failed-because-the-element-is-currently-animating

* Fix test titles to match the assertion

* Remove suprefluous search for a string

* Use `editDashboard` helper
parent 6ec4b1d5
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
frontend/test/__support__/e2e/helpers/e2e-dashboard-helpers.js
+ 1
− 0
View file @ eb2335e0
......@@ -16,6 +16,7 @@ export function showDashboardCardActions(index = 0) {
export function editDashboard() {
cy.icon("pencil").click();
cy.findByText("You're editing this dashboard.");
}
export function saveDashboard() {
......
frontend/test/metabase-visual/dashboard/parameters-widget.cy.spec.js
+ 82
− 74
View file @ eb2335e0
import { restore, visitDashboard } from "__support__/e2e/helpers";
import {
restore,
visitDashboard,
editDashboard,
} from "__support__/e2e/helpers";
import { SAMPLE_DATABASE } from "__support__/e2e/cypress_sample_database";
const { PRODUCTS_ID } = SAMPLE_DATABASE;
const questionDetails = {
query: { "source-table": PRODUCTS_ID },
query: { "source-table": PRODUCTS_ID, limit: 2 },
};
const parameter = {
......@@ -48,7 +52,7 @@ describe(`visual tests > dashboard > parameters widget`, () => {
});
});
describe(`desktop`, () => {
describe("desktop", () => {
it("is sticky in view mode", () => {
cy.get("main")
.scrollTo(0, 264)
......@@ -63,8 +67,8 @@ describe(`visual tests > dashboard > parameters widget`, () => {
);
});
it("is sticky in edit mode", () => {
cy.icon("pencil").click();
it("is not sticky in edit mode", () => {
editDashboard();
cy.findByTestId("dashboard-parameters-and-cards")
.scrollTo(0, 464)
......@@ -80,41 +84,44 @@ describe(`visual tests > dashboard > parameters widget`, () => {
});
});
describe(`mobile`, () => {
it("is sticky in view mode", () => {
cy.viewport(MOBILE_WIDTH, 667);
cy.get("main")
.scrollTo(0, 264)
.then(() => {
cy.createPercySnapshot(null, { widths: [MOBILE_WIDTH] });
});
cy.findByTestId("dashboard-parameters-widget-container").should(
"have.css",
"position",
"fixed",
);
});
it("is sticky in edit mode", () => {
cy.viewport(MOBILE_WIDTH, 667);
describe(
"mobile",
{
viewportHeight: 667,
viewportWidth: MOBILE_WIDTH,
},
() => {
it("is sticky in view mode", () => {
cy.get("main")
.scrollTo(0, 264)
.then(() => {
cy.createPercySnapshot(null, { widths: [MOBILE_WIDTH] });
});
cy.findByTestId("dashboard-parameters-widget-container").should(
"have.css",
"position",
"fixed",
);
});
cy.icon("pencil").click();
it("is not sticky in edit mode", () => {
editDashboard();
cy.findByTestId("dashboard-parameters-and-cards")
.scrollTo(0, 464)
.then(() => {
cy.createPercySnapshot(null, { widths: [MOBILE_WIDTH] });
});
cy.findByTestId("dashboard-parameters-and-cards")
.scrollTo(0, 464)
.then(() => {
cy.createPercySnapshot(null, { widths: [MOBILE_WIDTH] });
});
cy.findByTestId("edit-dashboard-parameters-widget-container").should(
"not.have.css",
"position",
"fixed",
);
});
});
cy.findByTestId("edit-dashboard-parameters-widget-container").should(
"not.have.css",
"position",
"fixed",
);
});
},
);
});
describe(`${parametersLong.length} filters (non sticky on mobile)`, () => {
......@@ -144,7 +151,7 @@ describe(`visual tests > dashboard > parameters widget`, () => {
});
});
describe(`desktop`, () => {
describe("desktop", () => {
it("is sticky in view mode", () => {
cy.get("main")
.scrollTo(0, 264)
......@@ -159,10 +166,8 @@ describe(`visual tests > dashboard > parameters widget`, () => {
);
});
it("is sticky in edit mode", () => {
cy.findByText("test question");
cy.icon("pencil").click();
it("is not sticky in edit mode", () => {
editDashboard();
cy.findByTestId("dashboard-parameters-and-cards")
.scrollTo(0, 464)
......@@ -178,40 +183,43 @@ describe(`visual tests > dashboard > parameters widget`, () => {
});
});
describe(`mobile`, () => {
it("is not sticky in view mode", () => {
cy.viewport(MOBILE_WIDTH, 667);
cy.get("main")
.scrollTo(0, 264)
.then(() => {
cy.createPercySnapshot(null, { widths: [MOBILE_WIDTH] });
});
cy.findByTestId("dashboard-parameters-widget-container").should(
"not.have.css",
"position",
"fixed",
);
});
it("is not sticky in edit mode", () => {
cy.viewport(MOBILE_WIDTH, 667);
describe(
"mobile",
{
viewportHeight: 667,
viewportWidth: MOBILE_WIDTH,
},
() => {
it("is not sticky in view mode", () => {
cy.get("main")
.scrollTo(0, 264)
.then(() => {
cy.createPercySnapshot(null, { widths: [MOBILE_WIDTH] });
});
cy.findByTestId("dashboard-parameters-widget-container").should(
"not.have.css",
"position",
"fixed",
);
});
cy.icon("pencil").click();
it("is not sticky in edit mode", () => {
editDashboard();
cy.findByTestId("dashboard-parameters-and-cards")
.scrollTo(0, 464)
.then(() => {
cy.createPercySnapshot(null, { widths: [MOBILE_WIDTH] });
});
cy.findByTestId("dashboard-parameters-and-cards")
.scrollTo(0, 464)
.then(() => {
cy.createPercySnapshot(null, { widths: [MOBILE_WIDTH] });
});
cy.findByTestId("edit-dashboard-parameters-widget-container").should(
"not.have.css",
"position",
"fixed",
);
});
});
cy.findByTestId("edit-dashboard-parameters-widget-container").should(
"not.have.css",
"position",
"fixed",
);
});
},
);
});
});
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment