E2E 테스트 추가 설정 #321

.eslintrc.json

@@ -18,6 +18,14 @@
     "next/core-web-vitals",
     "plugin:cypress/recommended"
   ],
+  "overrides": [
+    {
+      "files": ["cypress/**/*.ts", "cypress.config.ts"],
+      "parserOptions": {
+        "project": "./cypress/tsconfig.json"
+      }
+    }
+  ],
   "settings": {
     "import/resolver": {
       "typescript": {

.gitignore

@@ -7,6 +7,7 @@
 # testing
 /coverage
 cypress.env.json
+cypress/downloads
 
 # next.js
 /.next/

cypress.config.ts

@@ -4,6 +4,9 @@ import { fileURLToPath } from "url";
 import webpack from "@cypress/webpack-preprocessor";
 import { defineConfig } from "cypress";
 
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = dirname(__filename);
+
 export default defineConfig({
   e2e: {
     setupNodeEvents(on, config) {
@@ -12,12 +15,24 @@ export default defineConfig({
           resolve: {
             extensions: [".ts", ".tsx"],
             alias: {
-              cypress: path.resolve(
-                dirname(fileURLToPath(import.meta.url)),
-                "cypress"
-              ),
+              cypress: path.resolve(__dirname, "cypress"),
+              src: path.resolve(__dirname, "src"),
             },
           },
+          module: {
+            rules: [
+              {
+                test: /\.tsx?$/,
+                use: [
+                  {
+                    loader: "ts-loader",
+                    options: { transpileOnly: true },
+                  },
+                ],
+                exclude: /node_modules/,
+              },
+            ],
+          },
         },
       });
       on("file:preprocessor", options);

cypress/tsconfig.json

@@ -1,8 +1,15 @@
 {
   "compilerOptions": {
-    "target": "es5",
-    "lib": ["es5", "dom"],
-    "types": ["cypress", "node", "./support"]
+    "target": "esnext",
+    "module": "esnext",
+    "moduleResolution": "node",
+    "lib": ["esnext", "dom"],
+    "types": ["cypress", "node", "./support"],
+    "esModuleInterop": true,
+    "paths": {
+      "cypress/*": ["./cypress/*"],
+      "src/*": ["../src/*"]
+    }
   },
-  "include": ["**/*.ts"]
+  "include": ["./**/*.ts", "../cypress.config.ts"]
 }

package.json

@@ -55,6 +55,7 @@
     "@cypress/webpack-preprocessor": "^6.0.2",
     "@testing-library/jest-dom": "^6.4.6",
     "@testing-library/react": "^16.0.0",
+    "@types/cypress": "^1.1.3",
     "@types/jest": "^29.5.12",
     "@types/node": "^20",
     "@types/qrcode": "^1.5.5",
@@ -74,6 +75,7 @@
     "jest-environment-jsdom": "^29.7.0",
     "lint-staged": "^15.2.8",
     "ts-jest": "^29.1.5",
+    "ts-loader": "^9.5.1",
     "typescript": "^5"
   }
 }

tsconfig.json

@@ -18,8 +18,7 @@
       }
     ],
     "paths": {
-      "@/*": ["./src/*"],
-      "cypress/*": ["./cypress/*"]
+      "@/*": ["./src/*"]
     },
     "strictNullChecks": true
   },
@@ -35,9 +34,9 @@
   ],
   "exclude": [
     "node_modules",
+    "**/*.spec.ts",
     "./cypress.config.ts",
     "cypress",
-    "**/*.spec.ts",
     "**/*.cy.ts"
   ]
 }