Skip to content

Commit 0487ebc

Browse files
aldbraldbr
committed
refactor: make e2e tests more maintainable
1 parent a050d09 commit 0487ebc

14 files changed

+731
-659
lines changed

‎packages/diracx-web/cypress.config.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { defineConfig } from "cypress";
33
export default defineConfig({
44
e2e: {
55
specPattern: "test/e2e/**/*.cy.ts",
6-
supportFile: false,
6+
supportFile: "test/e2e/support/e2e.ts",
77
setupNodeEvents(_on, _config) {
88
// implement node event listeners here
99
},

‎packages/diracx-web/test/e2e/dashboard.cy.ts‎

Lines changed: 2 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,9 @@
11
/// <reference types="cypress" />
2+
/// <reference path="support/index.d.ts" />
23

34
describe("DashboardDrawer", { retries: { runMode: 5, openMode: 3 } }, () => {
45
beforeEach(() => {
5-
cy.session("login", () => {
6-
// Visit the page where the DashboardDrawer is rendered
7-
cy.visit("/");
8-
9-
//login
10-
cy.get('[data-testid="login-form-button"]').click();
11-
cy.get("#login").type("admin@example.com");
12-
cy.get("#password").type("password");
13-
14-
// Find the login button and click on it
15-
cy.get("button").click();
16-
// Grant access
17-
cy.get(":nth-child(1) > form > .dex-btn").click();
18-
cy.url().should("include", "/auth");
19-
});
6+
cy.login();
207
cy.window().then((win) => {
218
win.sessionStorage.setItem(
229
"savedDashboard",

‎packages/diracx-web/test/e2e/importExportState.cy.ts‎

Lines changed: 2 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,9 @@
11
/// <reference types="cypress" />
2+
/// <reference path="support/index.d.ts" />
23

34
describe("Export and import app state", () => {
45
beforeEach(() => {
5-
cy.session("login", () => {
6-
cy.visit("/");
7-
//login
8-
cy.get('[data-testid="login-form-button"]').click();
9-
cy.get("#login").type("admin@example.com");
10-
cy.get("#password").type("password");
11-
12-
// Find the login button and click on it
13-
cy.get("button").click();
14-
// Grant access
15-
cy.get(":nth-child(1) > form > .dex-btn").click();
16-
cy.url().should("include", "/auth");
17-
});
6+
cy.login();
187

198
cy.visit("/");
209

‎packages/diracx-web/test/e2e/jobMonitor.columns.cy.ts‎

Lines changed: 122 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,122 @@
1+
/// <reference types="cypress" />
2+
/// <reference path="support/index.d.ts" />
3+
4+
import {
5+
setupJobMonitorDashboard,
6+
ensureMinimumJobs,
7+
} from "./support/jobMonitorUtils";
8+
9+
describe("Job Monitor - Columns", () => {
10+
beforeEach(() => {
11+
cy.login();
12+
13+
cy.visit("/");
14+
setupJobMonitorDashboard();
15+
16+
cy.contains("Job Monitor").click();
17+
18+
ensureMinimumJobs(55);
19+
});
20+
21+
it("should hide/show columns", () => {
22+
// Make sure "VO" is not in the header and "Status" is
23+
cy.get("table thead tr th").should("not.contain", "VO");
24+
cy.get("table thead tr th").should("contain", "Status");
25+
26+
// Click on the visibility icon
27+
cy.get('[data-testid="column-visibility-button"]').click();
28+
cy.get('[data-testid="column-visibility-popover"]').should("be.visible");
29+
30+
// Hide the "Site" column and Show the "VO" column
31+
cy.get('[data-testid="column-visibility-popover"]')
32+
.contains("Site")
33+
.parent()
34+
.find('input[type="checkbox"]')
35+
.click();
36+
cy.get('[data-testid="column-visibility-popover"]')
37+
.contains("VO")
38+
.parent()
39+
.find('input[type="checkbox"]')
40+
.click();
41+
42+
// Close the popover by clicking outside
43+
cy.get("body").click(0, 0);
44+
cy.get('[data-testid="column-visibility-popover"]').should("not.exist");
45+
46+
// Wait for the table to re-render with updated columns
47+
cy.wait(1000);
48+
49+
// Verify "VO" is now present and "Site" is gone
50+
cy.get("table thead tr th").should("contain", "VO");
51+
cy.get("table thead tr th").should("not.contain", "Site");
52+
});
53+
54+
it("should resize a column", () => {
55+
cy.get("table thead tr th")
56+
.eq(2)
57+
.invoke("width")
58+
.then((initialWidth) => {
59+
// Convert the width to a number
60+
const initialWidthNum = Number(initialWidth);
61+
62+
// Resize the column
63+
cy.get(
64+
".MuiTableHead-root > .MuiTableRow-root > :nth-child(3) > .MuiBox-root",
65+
)
66+
.trigger("mousedown", { which: 1 }) // Start the drag
67+
.trigger("mousemove", { clientX: 200 }) // Move to the desired location
68+
.trigger("mouseup"); // Release to finish resizing
69+
70+
// Check if the column width has changed (it should be larger than the initial width)
71+
cy.get("table thead tr th")
72+
.eq(2)
73+
.invoke("width")
74+
.then((newWidth) => {
75+
// Convert the new width to a number and compare
76+
const newWidthNum = Number(newWidth);
77+
expect(initialWidthNum).to.be.greaterThan(newWidthNum);
78+
});
79+
});
80+
});
81+
82+
it("should sort column", () => {
83+
let firstValue: number;
84+
let firstValueSorted: number;
85+
let firstValueAgain: number;
86+
87+
// Get the first visible row value (e.g. 55)
88+
cy.get("table tbody tr")
89+
.first()
90+
.find("td")
91+
.eq(1)
92+
.invoke("text")
93+
.then((text) => {
94+
firstValue = parseInt(text.trim(), 10);
95+
});
96+
97+
cy.get('[data-testid="sort-JobID"]').click();
98+
99+
cy.get("table tbody tr")
100+
.first()
101+
.find("td")
102+
.eq(1)
103+
.invoke("text")
104+
.then((text) => {
105+
firstValueSorted = parseInt(text.trim(), 10);
106+
expect(firstValue).to.be.greaterThan(firstValueSorted);
107+
});
108+
109+
cy.get('[data-testid="sort-JobID"]').click();
110+
111+
cy.get("table tbody tr")
112+
.first()
113+
.find("td")
114+
.eq(1)
115+
.invoke("text")
116+
.then((text) => {
117+
firstValueAgain = parseInt(text.trim(), 10);
118+
expect(firstValueAgain).to.be.greaterThan(firstValueSorted);
119+
expect(firstValue).to.be.equal(firstValueAgain);
120+
});
121+
});
122+
});

0 commit comments

Comments
 (0)