From 427a788c1d42a8f490a1b07d6c05716734d0e1f0 Mon Sep 17 00:00:00 2001
From: Max Frederiksen <maxfrederiksen@Maxs-MacBook-Air.local>
Date: Wed, 25 Dec 2024 14:11:08 +0100
Subject: [PATCH] Refactor Cypress related files
---
cypress.d.ts | 10 +++++++
cypress/support/commands.js | 5 ++++
cypress/support/component.jsx | 4 +--
src/api/UserProvider.spec.tsx | 30 ++++++-------------
src/components/IOC/IOCTable/IOCTable.spec.tsx | 2 +-
src/components/host/HostTable.spec.tsx | 2 +-
tsconfig.json | 10 +++++--
7 files changed, 36 insertions(+), 27 deletions(-)
create mode 100644 cypress.d.ts
diff --git a/cypress.d.ts b/cypress.d.ts
new file mode 100644
index 00000000..b568b6b9
--- /dev/null
+++ b/cypress.d.ts
@@ -0,0 +1,10 @@
+import { mount } from "cypress/react18";
+
+declare global {
+ namespace Cypress {
+ interface Chainable {
+ mount: typeof mount;
+ login(): Chainable<void>;
+ }
+ }
+}
diff --git a/cypress/support/commands.js b/cypress/support/commands.js
index 5c57c92d..16bc7789 100644
--- a/cypress/support/commands.js
+++ b/cypress/support/commands.js
@@ -26,8 +26,13 @@
// Import React Testing Library commands (select by a11y role etc)
import "@testing-library/cypress/add-commands";
+import { mount } from "cypress/react18";
// import custom auth commands
Cypress.Commands.add("login", () => {
cy.setCookie("ce-deploy-auth", "DEADBEEF");
});
+
+Cypress.Commands.add("mount", (component, options) => {
+ return mount(component, options);
+});
diff --git a/cypress/support/component.jsx b/cypress/support/component.jsx
index c9dbcc77..a39fd531 100644
--- a/cypress/support/component.jsx
+++ b/cypress/support/component.jsx
@@ -15,7 +15,6 @@
// Import commands.js using ES2015 syntax:
import "./commands";
-import { ReduxProvider } from "../../src/store/ReduxProvider";
// Alternatively you can use CommonJS syntax:
// require("./commands")
@@ -23,8 +22,9 @@ import { ReduxProvider } from "../../src/store/ReduxProvider";
import { mount } from "cypress/react";
import { interceptAPI } from "./interceptAPI";
import configure from "./configureWindowVars";
-Cypress.Commands.add("mount", (component, options = {}) => {
+import { ReduxProvider } from "../../src/store/ReduxProvider";
+Cypress.Commands.add("mount", (component, options = {}) => {
const wrappedComponent = <ReduxProvider>{component}</ReduxProvider>;
return mount(wrappedComponent, options);
});
diff --git a/src/api/UserProvider.spec.tsx b/src/api/UserProvider.spec.tsx
index 694323e4..2f0abdeb 100644
--- a/src/api/UserProvider.spec.tsx
+++ b/src/api/UserProvider.spec.tsx
@@ -1,27 +1,10 @@
import { useContext } from "react";
import { userContext } from "@ess-ics/ce-ui-common";
import { SnackbarProvider } from "notistack";
-import { DeployAPIProvider } from "./APIProvider";
import { UserProvider } from "./UserProvider";
-function AppHarness({ children }) {
- return (
- <SnackbarProvider
- preventDuplicate
- maxSnack="5"
- >
- <DeployAPIProvider>{children}</DeployAPIProvider>
- </SnackbarProvider>
- );
-}
-
-function mountIntoHarness(children) {
- cy.mount(<AppHarness>{children}</AppHarness>);
-}
-
function DisplayUserContextValue() {
const contextValue = useContext(userContext);
-
return <pre id="display">{JSON.stringify(contextValue, null, 2)}</pre>;
}
@@ -32,10 +15,15 @@ describe("UserProvider", () => {
});
it("provides the user", () => {
- mountIntoHarness(
- <UserProvider>
- <DisplayUserContextValue />
- </UserProvider>
+ cy.mount(
+ <SnackbarProvider
+ preventDuplicate
+ maxSnack={5}
+ >
+ <UserProvider>
+ <DisplayUserContextValue />
+ </UserProvider>
+ </SnackbarProvider>
);
cy.wait("@getUserRoles");
diff --git a/src/components/IOC/IOCTable/IOCTable.spec.tsx b/src/components/IOC/IOCTable/IOCTable.spec.tsx
index 22373956..2bc1b0c6 100644
--- a/src/components/IOC/IOCTable/IOCTable.spec.tsx
+++ b/src/components/IOC/IOCTable/IOCTable.spec.tsx
@@ -45,7 +45,7 @@ describe("IOCTable", () => {
.should(($el) => {
const text = $el.text().trim().toLowerCase();
const expected = firstRowData[index].trim().toLowerCase();
- cy.expect(text).to.equal(expected);
+ expect(text).to.equal(expected);
});
}
});
diff --git a/src/components/host/HostTable.spec.tsx b/src/components/host/HostTable.spec.tsx
index 5ad3da3d..d3b612fd 100644
--- a/src/components/host/HostTable.spec.tsx
+++ b/src/components/host/HostTable.spec.tsx
@@ -45,7 +45,7 @@ describe("HostTable", () => {
.should(($el) => {
const text = $el.text().trim().toLowerCase();
const expected = firstRowData[index].trim().toLowerCase();
- cy.expect(text).to.equal(expected);
+ expect(text).to.equal(expected);
});
}
});
diff --git a/tsconfig.json b/tsconfig.json
index 543a317d..d291f9f9 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -20,8 +20,14 @@
"noUnusedParameters": true,
"noFallthroughCasesInSwitch": true,
"allowSyntheticDefaultImports": true,
- "types": ["@types/react", "@types/react-dom", "vite/client"]
+ "types": [
+ "cypress",
+ "@testing-library/cypress",
+ "@types/react",
+ "@types/react-dom",
+ "vite/client"
+ ]
},
- "include": ["src"],
+ "include": ["src", "cypress.d.ts"],
"exclude": ["node_modules", "build"]
}
--
GitLab