migrated dialog test

cypress.d.ts

+import { mount } from "cypress/react";
+
+declare global {
+  namespace Cypress {
+    interface Chainable {
+      mount: typeof mount;
+      login(): Chainable<void>;
+    }
+  }
+}

src/components/common/Dialog/Dialog.cy.jsx → src/components/common/Dialog/Dialog.cy.tsx

 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();
   };
 

src/hooks/useTypingTimer.ts

 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
 

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"]
 }