fix: vitest frontend test now pass and sort input

.prettierignore

@@ -0,0 +1,56 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# husky log
+husky-logs/*
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+/test-results
+
+# next.js
+/.next/
+/out/
+next-env.d.ts
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.pnpm-debug.log*
+
+# local env files
+.env*.local
+.env
+
+*.tsbuildinfo
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
+
+build.tar.gz
+
+.eslintcache
+.stylelintcache
+
+# database
+/prisma/db.sqlite
+/prisma/db.sqlite-journal
+
+/playwright-report
+pnpm-lock.yaml

__mocks__/next-auth/react.ts

@@ -0,0 +1,9 @@
+const mockSession = {
+  expires: new Date(Date.now() + 2 * 86400).toISOString(),
+  user: { username: "admin" },
+};
+
+export * from "next-auth/react";
+export const useSession = vi.fn(() => {
+  return { data: mockSession, status: "authenticated" };
+});

e2e/about.spec.ts

@@ -1,4 +1,4 @@
-import { test, expect } from "@playwright/test";
+import { expect, test } from "@playwright/test";
 
 test("should navigate to the about page", async ({ page }) => {
   // Start from the index page (the baseURL is set via the webServer in the playwright.config.ts)

package.json

@@ -18,6 +18,7 @@
     "test:e2e": "playwright test",
     "codegen:e2e": "pnpm run dev & playwright codegen",
     "test:watch": "vitest",
+    "test:ui": "vitest --ui",
     "test": "vitest run",
     "clean": "rimraf .next",
     "semantic-release": "semantic-release",
@@ -70,6 +71,7 @@
   "devDependencies": {
     "@commitlint/cli": "^17.4.3",
     "@commitlint/config-conventional": "^17.4.3",
+    "@ianvs/prettier-plugin-sort-imports": "^3.7.1",
     "@next/env": "^13.1.6",
     "@playwright/test": "^1.30.0",
     "@semantic-release/changelog": "^6.0.2",
@@ -87,6 +89,7 @@
     "@storybook/testing-library": "^0.0.13",
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^13.4.0",
+    "@types/micromatch": "^4.0.2",
     "@types/testing-library__jest-dom": "^5.14.5",
     "@typescript-eslint/eslint-plugin": "^5.52.0",
     "@typescript-eslint/parser": "^5.52.0",
@@ -95,6 +98,7 @@
     "autoprefixer": "^10.4.13",
     "concurrently": "^7.6.0",
     "cross-env": "^7.0.3",
+    "cross-fetch": "^3.1.5",
     "css-loader": "^6.7.3",
     "eslint": "8.32.0",
     "eslint-config-next": "13.1.4",
@@ -105,7 +109,7 @@
     "jsdom": "^21.1.0",
     "lint-staged": "^13.1.2",
     "micromatch": "^4.0.5",
-    "msw": "^1.0.1",
+    "msw": "^0.49.3",
     "msw-trpc": "^1.2.0",
     "postcss": "^8.4.21",
     "postcss-loader": "^7.0.2",

playwright.config.ts

@@ -1,4 +1,6 @@
-import { PlaywrightTestConfig, devices } from "@playwright/test";
+import type { PlaywrightTestConfig } from "@playwright/test";
+
+import { devices } from "@playwright/test";
 import path from "path";
 
 // Use process.env.PORT by default and fallback to port 3000