diff --git a/cypress.d.ts b/cypress.d.ts new file mode 100644 index 0000000000000000000000000000000000000000..4ab1d185af891a3d302b785869e6893ff1f946b1 --- /dev/null +++ b/cypress.d.ts @@ -0,0 +1,10 @@ +import { mount } from "cypress/react"; + +declare global { + namespace Cypress { + interface Chainable { + mount: typeof mount; + login(): Chainable<void>; + } + } +} diff --git a/src/components/common/Dialog/Dialog.cy.jsx b/src/components/common/Dialog/Dialog.cy.tsx similarity index 94% rename from src/components/common/Dialog/Dialog.cy.jsx rename to src/components/common/Dialog/Dialog.cy.tsx index 19c13a1f62e8e11c20682a0d76466bd43f45d349..49b9d612d60c35eb9c914d1f47ce3e8c7fbd2cd1 100644 --- a/src/components/common/Dialog/Dialog.cy.jsx +++ b/src/components/common/Dialog/Dialog.cy.tsx @@ -1,4 +1,5 @@ import { composeStories } from "@storybook/react"; +import { mount } from "cypress/react"; import * as stories from "../../../stories/common/Dialog/Dialog.stories"; const { BasicDialog, Confirmation, DangerActionDialog } = @@ -6,14 +7,14 @@ const { BasicDialog, Confirmation, DangerActionDialog } = describe("SimpleDialog", () => { it("should close on clicking close", () => { - cy.mount(<BasicDialog />); + mount(<BasicDialog />); cy.findByText(/some title/i).should("exist"); cy.findByRole("button", { name: /close/i }).click(); cy.findByText(/some title/i).should("not.exist"); }); it("should close on escape", () => { - cy.mount(<BasicDialog />); + mount(<BasicDialog />); cy.findByText(/some title/i) .should("exist") @@ -26,7 +27,7 @@ const closedText = "You closed the dialog!"; describe("ConfirmationDialog", () => { it("should close on clicking close icon", () => { - cy.mount(<Confirmation />); + mount(<Confirmation />); cy.findByText(/some title/i).should("exist"); cy.findByRole("button", { name: /close/i }).click(); @@ -34,7 +35,7 @@ describe("ConfirmationDialog", () => { cy.findByText(closedText).should("exist"); }); it("should close on escape", () => { - cy.mount(<Confirmation />); + mount(<Confirmation />); cy.findByText(/some title/i) .should("exist") @@ -43,7 +44,7 @@ describe("ConfirmationDialog", () => { cy.findByText(closedText).should("exist"); }); it("should close and when clicking cancel", () => { - cy.mount(<Confirmation />); + mount(<Confirmation />); cy.findByText(/some title/i).should("exist"); cy.findByRole("button", { name: /cancel/i }).click(); @@ -54,7 +55,7 @@ describe("ConfirmationDialog", () => { describe("DangerActionDialog", () => { const mountDangerActionDialog = () => { - cy.mount(<DangerActionDialog />); + mount(<DangerActionDialog />); cy.contains("Open Danger Action Dialog").click(); }; diff --git a/src/hooks/useTypingTimer.ts b/src/hooks/useTypingTimer.ts index 421e401d21268f9f4384dcfb38b535bb9b61550e..a39430647fd5af38d5949df0e46a22e4bcef2212 100644 --- a/src/hooks/useTypingTimer.ts +++ b/src/hooks/useTypingTimer.ts @@ -1,7 +1,8 @@ import { KeyboardEvent, useState } from "react"; export const useTypingTimer = ({ init = "", interval = 750 } = {}) => { - const [typingTimer, setTypingTimer] = useState<NodeJS.Timeout>(); + const [typingTimer, setTypingTimer] = + useState<ReturnType<typeof setTimeout>>(); const [value, setValue] = useState(init); const doneTypingInterval = interval; // ms diff --git a/tsconfig.json b/tsconfig.json index 7d887f1405288181631d0ed188bfe4d538e6fd3a..189f7c7abc7bf61077f8b75003af4f7bb29ede5f 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -12,13 +12,14 @@ "noEmit": true, "declaration": true, "jsx": "react-jsx", - "typeRoots": ["./dist/index.d.ts", "node_modules/@types"], + "typeRoots": ["./dist/index.d.ts", "node_modules/@types", "node_modules"], /* Linting */ "strict": true, "noUnusedLocals": true, "noUnusedParameters": true, "noFallthroughCasesInSwitch": true, - "allowSyntheticDefaultImports": true + "allowSyntheticDefaultImports": true, + "types": ["cypress", "@testing-library/cypress"] }, - "include": ["src"] + "include": ["src", "cypress.d.ts"] }