mirror of
https://github.com/lordmathis/lemma.git
synced 2025-11-05 23:44:22 +00:00
Add tests for AuthContext, ModalContext and ThemeContext
This commit is contained in:
515
app/package-lock.json
generated
515
app/package-lock.json
generated
@@ -47,6 +47,7 @@
|
||||
"@typescript-eslint/eslint-plugin": "^8.32.1",
|
||||
"@typescript-eslint/parser": "^8.32.1",
|
||||
"@vitejs/plugin-react": "^4.3.4",
|
||||
"@vitest/coverage-v8": "^3.1.4",
|
||||
"eslint": "^9.27.0",
|
||||
"eslint-plugin-react": "^7.37.5",
|
||||
"eslint-plugin-react-hooks": "^5.2.0",
|
||||
@@ -396,6 +397,16 @@
|
||||
"node": ">=6.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@bcoe/v8-coverage": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/@bcoe/v8-coverage/-/v8-coverage-1.0.2.tgz",
|
||||
"integrity": "sha512-6zABk/ECA/QYSCQ1NGiVwwbQerUCZ+TQbp64Q3AgmfNvurHH0j8TtXa1qbShXA6qqkpAj4V5W8pP6mLe1mcMqA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=18"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/commands": {
|
||||
"version": "6.6.2",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/commands/-/commands-6.6.2.tgz",
|
||||
@@ -1465,6 +1476,34 @@
|
||||
"url": "https://github.com/sponsors/nzakas"
|
||||
}
|
||||
},
|
||||
"node_modules/@isaacs/cliui": {
|
||||
"version": "8.0.2",
|
||||
"resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
|
||||
"integrity": "sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==",
|
||||
"dev": true,
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"string-width": "^5.1.2",
|
||||
"string-width-cjs": "npm:string-width@^4.2.0",
|
||||
"strip-ansi": "^7.0.1",
|
||||
"strip-ansi-cjs": "npm:strip-ansi@^6.0.1",
|
||||
"wrap-ansi": "^8.1.0",
|
||||
"wrap-ansi-cjs": "npm:wrap-ansi@^7.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
}
|
||||
},
|
||||
"node_modules/@istanbuljs/schema": {
|
||||
"version": "0.1.3",
|
||||
"resolved": "https://registry.npmjs.org/@istanbuljs/schema/-/schema-0.1.3.tgz",
|
||||
"integrity": "sha512-ZXRY4jNvVgSVQ8DL3LTcakaAtXwTVUxE81hslsyD2AtoXW/wVob10HkOJ1X/pAlcI7D+2YoZKg5do8G/w6RYgA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/@jridgewell/gen-mapping": {
|
||||
"version": "0.3.5",
|
||||
"resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.5.tgz",
|
||||
@@ -1987,6 +2026,17 @@
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@pkgjs/parseargs": {
|
||||
"version": "0.11.0",
|
||||
"resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz",
|
||||
"integrity": "sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"engines": {
|
||||
"node": ">=14"
|
||||
}
|
||||
},
|
||||
"node_modules/@react-dnd/asap": {
|
||||
"version": "4.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@react-dnd/asap/-/asap-4.0.1.tgz",
|
||||
@@ -2861,6 +2911,39 @@
|
||||
"vite": "^4.2.0 || ^5.0.0 || ^6.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@vitest/coverage-v8": {
|
||||
"version": "3.1.4",
|
||||
"resolved": "https://registry.npmjs.org/@vitest/coverage-v8/-/coverage-v8-3.1.4.tgz",
|
||||
"integrity": "sha512-G4p6OtioySL+hPV7Y6JHlhpsODbJzt1ndwHAFkyk6vVjpK03PFsKnauZIzcd0PrK4zAbc5lc+jeZ+eNGiMA+iw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@ampproject/remapping": "^2.3.0",
|
||||
"@bcoe/v8-coverage": "^1.0.2",
|
||||
"debug": "^4.4.0",
|
||||
"istanbul-lib-coverage": "^3.2.2",
|
||||
"istanbul-lib-report": "^3.0.1",
|
||||
"istanbul-lib-source-maps": "^5.0.6",
|
||||
"istanbul-reports": "^3.1.7",
|
||||
"magic-string": "^0.30.17",
|
||||
"magicast": "^0.3.5",
|
||||
"std-env": "^3.9.0",
|
||||
"test-exclude": "^7.0.1",
|
||||
"tinyrainbow": "^2.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://opencollective.com/vitest"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@vitest/browser": "3.1.4",
|
||||
"vitest": "3.1.4"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"@vitest/browser": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/@vitest/expect": {
|
||||
"version": "3.1.4",
|
||||
"resolved": "https://registry.npmjs.org/@vitest/expect/-/expect-3.1.4.tgz",
|
||||
@@ -3039,7 +3122,6 @@
|
||||
"integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"engines": {
|
||||
"node": ">=8"
|
||||
}
|
||||
@@ -4035,6 +4117,13 @@
|
||||
"node": ">= 0.4"
|
||||
}
|
||||
},
|
||||
"node_modules/eastasianwidth": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz",
|
||||
"integrity": "sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/electron-to-chromium": {
|
||||
"version": "1.5.113",
|
||||
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.113.tgz",
|
||||
@@ -4042,6 +4131,13 @@
|
||||
"dev": true,
|
||||
"license": "ISC"
|
||||
},
|
||||
"node_modules/emoji-regex": {
|
||||
"version": "9.2.2",
|
||||
"resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-9.2.2.tgz",
|
||||
"integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/entities": {
|
||||
"version": "6.0.0",
|
||||
"resolved": "https://registry.npmjs.org/entities/-/entities-6.0.0.tgz",
|
||||
@@ -4775,6 +4871,23 @@
|
||||
"url": "https://github.com/sponsors/ljharb"
|
||||
}
|
||||
},
|
||||
"node_modules/foreground-child": {
|
||||
"version": "3.3.1",
|
||||
"resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.3.1.tgz",
|
||||
"integrity": "sha512-gIXjKqtFuWEgzFRJA9WCQeSJLZDjgJUOMCMzxtvFq/37KojM1BFGufqsCy0r4qSQmYLsZYMeyRqzIWOMup03sw==",
|
||||
"dev": true,
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"cross-spawn": "^7.0.6",
|
||||
"signal-exit": "^4.0.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=14"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/isaacs"
|
||||
}
|
||||
},
|
||||
"node_modules/form-data": {
|
||||
"version": "4.0.2",
|
||||
"resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.2.tgz",
|
||||
@@ -4927,6 +5040,27 @@
|
||||
"url": "https://github.com/sponsors/ljharb"
|
||||
}
|
||||
},
|
||||
"node_modules/glob": {
|
||||
"version": "10.4.5",
|
||||
"resolved": "https://registry.npmjs.org/glob/-/glob-10.4.5.tgz",
|
||||
"integrity": "sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==",
|
||||
"dev": true,
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"foreground-child": "^3.1.0",
|
||||
"jackspeak": "^3.1.2",
|
||||
"minimatch": "^9.0.4",
|
||||
"minipass": "^7.1.2",
|
||||
"package-json-from-dist": "^1.0.0",
|
||||
"path-scurry": "^1.11.1"
|
||||
},
|
||||
"bin": {
|
||||
"glob": "dist/esm/bin.mjs"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/isaacs"
|
||||
}
|
||||
},
|
||||
"node_modules/glob-parent": {
|
||||
"version": "5.1.2",
|
||||
"resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
|
||||
@@ -5370,6 +5504,13 @@
|
||||
"node": ">=18"
|
||||
}
|
||||
},
|
||||
"node_modules/html-escaper": {
|
||||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmjs.org/html-escaper/-/html-escaper-2.0.2.tgz",
|
||||
"integrity": "sha512-H2iMtd0I4Mt5eYiapRdIDjp+XzelXQ0tFE4JS7YFwFevXXMmOp9myNrUvCg0D6ws8iqkRPBfKHgbwig1SmlLfg==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/http-proxy-agent": {
|
||||
"version": "7.0.2",
|
||||
"resolved": "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-7.0.2.tgz",
|
||||
@@ -5687,6 +5828,16 @@
|
||||
"url": "https://github.com/sponsors/ljharb"
|
||||
}
|
||||
},
|
||||
"node_modules/is-fullwidth-code-point": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
|
||||
"integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/is-generator-function": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/is-generator-function/-/is-generator-function-1.1.0.tgz",
|
||||
@@ -5934,6 +6085,60 @@
|
||||
"dev": true,
|
||||
"license": "ISC"
|
||||
},
|
||||
"node_modules/istanbul-lib-coverage": {
|
||||
"version": "3.2.2",
|
||||
"resolved": "https://registry.npmjs.org/istanbul-lib-coverage/-/istanbul-lib-coverage-3.2.2.tgz",
|
||||
"integrity": "sha512-O8dpsF+r0WV/8MNRKfnmrtCWhuKjxrq2w+jpzBL5UZKTi2LeVWnWOmWRxFlesJONmc+wLAGvKQZEOanko0LFTg==",
|
||||
"dev": true,
|
||||
"license": "BSD-3-Clause",
|
||||
"engines": {
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/istanbul-lib-report": {
|
||||
"version": "3.0.1",
|
||||
"resolved": "https://registry.npmjs.org/istanbul-lib-report/-/istanbul-lib-report-3.0.1.tgz",
|
||||
"integrity": "sha512-GCfE1mtsHGOELCU8e/Z7YWzpmybrx/+dSTfLrvY8qRmaY6zXTKWn6WQIjaAFw069icm6GVMNkgu0NzI4iPZUNw==",
|
||||
"dev": true,
|
||||
"license": "BSD-3-Clause",
|
||||
"dependencies": {
|
||||
"istanbul-lib-coverage": "^3.0.0",
|
||||
"make-dir": "^4.0.0",
|
||||
"supports-color": "^7.1.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=10"
|
||||
}
|
||||
},
|
||||
"node_modules/istanbul-lib-source-maps": {
|
||||
"version": "5.0.6",
|
||||
"resolved": "https://registry.npmjs.org/istanbul-lib-source-maps/-/istanbul-lib-source-maps-5.0.6.tgz",
|
||||
"integrity": "sha512-yg2d+Em4KizZC5niWhQaIomgf5WlL4vOOjZ5xGCmF8SnPE/mDWWXgvRExdcpCgh9lLRRa1/fSYp2ymmbJ1pI+A==",
|
||||
"dev": true,
|
||||
"license": "BSD-3-Clause",
|
||||
"dependencies": {
|
||||
"@jridgewell/trace-mapping": "^0.3.23",
|
||||
"debug": "^4.1.1",
|
||||
"istanbul-lib-coverage": "^3.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=10"
|
||||
}
|
||||
},
|
||||
"node_modules/istanbul-reports": {
|
||||
"version": "3.1.7",
|
||||
"resolved": "https://registry.npmjs.org/istanbul-reports/-/istanbul-reports-3.1.7.tgz",
|
||||
"integrity": "sha512-BewmUXImeuRk2YY0PVbxgKAysvhRPUQE0h5QRM++nVWyubKGV0l8qQ5op8+B2DOmwSe63Jivj0BjkPQVf8fP5g==",
|
||||
"dev": true,
|
||||
"license": "BSD-3-Clause",
|
||||
"dependencies": {
|
||||
"html-escaper": "^2.0.0",
|
||||
"istanbul-lib-report": "^3.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/iterator.prototype": {
|
||||
"version": "1.1.5",
|
||||
"resolved": "https://registry.npmjs.org/iterator.prototype/-/iterator.prototype-1.1.5.tgz",
|
||||
@@ -5952,6 +6157,22 @@
|
||||
"node": ">= 0.4"
|
||||
}
|
||||
},
|
||||
"node_modules/jackspeak": {
|
||||
"version": "3.4.3",
|
||||
"resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-3.4.3.tgz",
|
||||
"integrity": "sha512-OGlZQpz2yfahA/Rd1Y8Cd9SIEsqvXkLVoSw/cgwhnhFMDbsQFeZYoJJ7bIZBS9BcamUW96asq/npPWugM+RQBw==",
|
||||
"dev": true,
|
||||
"license": "BlueOak-1.0.0",
|
||||
"dependencies": {
|
||||
"@isaacs/cliui": "^8.0.2"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/isaacs"
|
||||
},
|
||||
"optionalDependencies": {
|
||||
"@pkgjs/parseargs": "^0.11.0"
|
||||
}
|
||||
},
|
||||
"node_modules/js-tokens": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
|
||||
@@ -6226,6 +6447,47 @@
|
||||
"@jridgewell/sourcemap-codec": "^1.5.0"
|
||||
}
|
||||
},
|
||||
"node_modules/magicast": {
|
||||
"version": "0.3.5",
|
||||
"resolved": "https://registry.npmjs.org/magicast/-/magicast-0.3.5.tgz",
|
||||
"integrity": "sha512-L0WhttDl+2BOsybvEOLK7fW3UA0OQ0IQ2d6Zl2x/a6vVRs3bAY0ECOSHHeL5jD+SbOpOCUEi0y1DgHEn9Qn1AQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/parser": "^7.25.4",
|
||||
"@babel/types": "^7.25.4",
|
||||
"source-map-js": "^1.2.0"
|
||||
}
|
||||
},
|
||||
"node_modules/make-dir": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/make-dir/-/make-dir-4.0.0.tgz",
|
||||
"integrity": "sha512-hXdUTZYIVOt1Ex//jAQi+wTZZpUpwBj/0QsOzqegb3rGMMeJiSEu5xLHnYfBrRV4RH2+OCSOO95Is/7x1WJ4bw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"semver": "^7.5.3"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=10"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/make-dir/node_modules/semver": {
|
||||
"version": "7.7.2",
|
||||
"resolved": "https://registry.npmjs.org/semver/-/semver-7.7.2.tgz",
|
||||
"integrity": "sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==",
|
||||
"dev": true,
|
||||
"license": "ISC",
|
||||
"bin": {
|
||||
"semver": "bin/semver.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=10"
|
||||
}
|
||||
},
|
||||
"node_modules/math-intrinsics": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz",
|
||||
@@ -6968,6 +7230,16 @@
|
||||
"url": "https://github.com/sponsors/isaacs"
|
||||
}
|
||||
},
|
||||
"node_modules/minipass": {
|
||||
"version": "7.1.2",
|
||||
"resolved": "https://registry.npmjs.org/minipass/-/minipass-7.1.2.tgz",
|
||||
"integrity": "sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==",
|
||||
"dev": true,
|
||||
"license": "ISC",
|
||||
"engines": {
|
||||
"node": ">=16 || 14 >=14.17"
|
||||
}
|
||||
},
|
||||
"node_modules/mj-context-menu": {
|
||||
"version": "0.6.1",
|
||||
"resolved": "https://registry.npmjs.org/mj-context-menu/-/mj-context-menu-0.6.1.tgz",
|
||||
@@ -7214,6 +7486,13 @@
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/package-json-from-dist": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/package-json-from-dist/-/package-json-from-dist-1.0.1.tgz",
|
||||
"integrity": "sha512-UEZIS3/by4OC8vL3P2dTXRETpebLI2NiI5vIrjaD/5UtrkFX/tNbwjTSRAGC/+7CAo2pIcBaRgWmcBBHcsaCIw==",
|
||||
"dev": true,
|
||||
"license": "BlueOak-1.0.0"
|
||||
},
|
||||
"node_modules/parent-module": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",
|
||||
@@ -7292,6 +7571,30 @@
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/path-scurry": {
|
||||
"version": "1.11.1",
|
||||
"resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.11.1.tgz",
|
||||
"integrity": "sha512-Xa4Nw17FS9ApQFJ9umLiJS4orGjm7ZzwUrwamcGQuHSzDyth9boKDaycYdDcZDuqYATXw4HFXgaqWTctW/v1HA==",
|
||||
"dev": true,
|
||||
"license": "BlueOak-1.0.0",
|
||||
"dependencies": {
|
||||
"lru-cache": "^10.2.0",
|
||||
"minipass": "^5.0.0 || ^6.0.2 || ^7.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=16 || 14 >=14.18"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/isaacs"
|
||||
}
|
||||
},
|
||||
"node_modules/path-scurry/node_modules/lru-cache": {
|
||||
"version": "10.4.3",
|
||||
"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.4.3.tgz",
|
||||
"integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==",
|
||||
"dev": true,
|
||||
"license": "ISC"
|
||||
},
|
||||
"node_modules/pathe": {
|
||||
"version": "2.0.3",
|
||||
"resolved": "https://registry.npmjs.org/pathe/-/pathe-2.0.3.tgz",
|
||||
@@ -8695,6 +8998,19 @@
|
||||
"dev": true,
|
||||
"license": "ISC"
|
||||
},
|
||||
"node_modules/signal-exit": {
|
||||
"version": "4.1.0",
|
||||
"resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
|
||||
"integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
|
||||
"dev": true,
|
||||
"license": "ISC",
|
||||
"engines": {
|
||||
"node": ">=14"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/isaacs"
|
||||
}
|
||||
},
|
||||
"node_modules/source-map": {
|
||||
"version": "0.6.1",
|
||||
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
|
||||
@@ -8776,6 +9092,60 @@
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/string-width": {
|
||||
"version": "5.1.2",
|
||||
"resolved": "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz",
|
||||
"integrity": "sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"eastasianwidth": "^0.2.0",
|
||||
"emoji-regex": "^9.2.2",
|
||||
"strip-ansi": "^7.0.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/string-width-cjs": {
|
||||
"name": "string-width",
|
||||
"version": "4.2.3",
|
||||
"resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
|
||||
"integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"emoji-regex": "^8.0.0",
|
||||
"is-fullwidth-code-point": "^3.0.0",
|
||||
"strip-ansi": "^6.0.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/string-width-cjs/node_modules/emoji-regex": {
|
||||
"version": "8.0.0",
|
||||
"resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
|
||||
"integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/string-width-cjs/node_modules/strip-ansi": {
|
||||
"version": "6.0.1",
|
||||
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
|
||||
"integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"ansi-regex": "^5.0.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/string.prototype.matchall": {
|
||||
"version": "4.0.12",
|
||||
"resolved": "https://registry.npmjs.org/string.prototype.matchall/-/string.prototype.matchall-4.0.12.tgz",
|
||||
@@ -8888,6 +9258,49 @@
|
||||
"url": "https://github.com/sponsors/wooorm"
|
||||
}
|
||||
},
|
||||
"node_modules/strip-ansi": {
|
||||
"version": "7.1.0",
|
||||
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.0.tgz",
|
||||
"integrity": "sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"ansi-regex": "^6.0.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/chalk/strip-ansi?sponsor=1"
|
||||
}
|
||||
},
|
||||
"node_modules/strip-ansi-cjs": {
|
||||
"name": "strip-ansi",
|
||||
"version": "6.0.1",
|
||||
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
|
||||
"integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"ansi-regex": "^5.0.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/strip-ansi/node_modules/ansi-regex": {
|
||||
"version": "6.1.0",
|
||||
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.1.0.tgz",
|
||||
"integrity": "sha512-7HSX4QQb4CspciLpVFwyRe79O3xsIZDDLER21kERQ71oaPodF8jL725AgJMFAYbooIqolJoRLuM81SpeUkpkvA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/chalk/ansi-regex?sponsor=1"
|
||||
}
|
||||
},
|
||||
"node_modules/strip-indent": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-3.0.0.tgz",
|
||||
@@ -9012,6 +9425,21 @@
|
||||
"node": ">=10"
|
||||
}
|
||||
},
|
||||
"node_modules/test-exclude": {
|
||||
"version": "7.0.1",
|
||||
"resolved": "https://registry.npmjs.org/test-exclude/-/test-exclude-7.0.1.tgz",
|
||||
"integrity": "sha512-pFYqmTw68LXVjeWJMST4+borgQP2AyMNbg1BpZh9LbyhUeNkeaPF9gzfPGUAnSMV3qPYdWUwDIjjCLiSDOl7vg==",
|
||||
"dev": true,
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@istanbuljs/schema": "^0.1.2",
|
||||
"glob": "^10.4.1",
|
||||
"minimatch": "^9.0.4"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=18"
|
||||
}
|
||||
},
|
||||
"node_modules/tinybench": {
|
||||
"version": "2.9.0",
|
||||
"resolved": "https://registry.npmjs.org/tinybench/-/tinybench-2.9.0.tgz",
|
||||
@@ -10107,6 +10535,91 @@
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/wrap-ansi": {
|
||||
"version": "8.1.0",
|
||||
"resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-8.1.0.tgz",
|
||||
"integrity": "sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"ansi-styles": "^6.1.0",
|
||||
"string-width": "^5.0.1",
|
||||
"strip-ansi": "^7.0.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/chalk/wrap-ansi?sponsor=1"
|
||||
}
|
||||
},
|
||||
"node_modules/wrap-ansi-cjs": {
|
||||
"name": "wrap-ansi",
|
||||
"version": "7.0.0",
|
||||
"resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
|
||||
"integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"ansi-styles": "^4.0.0",
|
||||
"string-width": "^4.1.0",
|
||||
"strip-ansi": "^6.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=10"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/chalk/wrap-ansi?sponsor=1"
|
||||
}
|
||||
},
|
||||
"node_modules/wrap-ansi-cjs/node_modules/emoji-regex": {
|
||||
"version": "8.0.0",
|
||||
"resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
|
||||
"integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/wrap-ansi-cjs/node_modules/string-width": {
|
||||
"version": "4.2.3",
|
||||
"resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
|
||||
"integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"emoji-regex": "^8.0.0",
|
||||
"is-fullwidth-code-point": "^3.0.0",
|
||||
"strip-ansi": "^6.0.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/wrap-ansi-cjs/node_modules/strip-ansi": {
|
||||
"version": "6.0.1",
|
||||
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
|
||||
"integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"ansi-regex": "^5.0.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/wrap-ansi/node_modules/ansi-styles": {
|
||||
"version": "6.2.1",
|
||||
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.1.tgz",
|
||||
"integrity": "sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/chalk/ansi-styles?sponsor=1"
|
||||
}
|
||||
},
|
||||
"node_modules/ws": {
|
||||
"version": "8.18.0",
|
||||
"resolved": "https://registry.npmjs.org/ws/-/ws-8.18.0.tgz",
|
||||
|
||||
@@ -11,7 +11,8 @@
|
||||
"lint": "eslint . --ext .ts,.tsx",
|
||||
"lint:fix": "eslint . --ext .ts,.tsx --fix",
|
||||
"test": "vitest run",
|
||||
"test:watch": "vitest"
|
||||
"test:watch": "vitest",
|
||||
"coverage": "vitest run --coverage"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
@@ -66,6 +67,7 @@
|
||||
"@typescript-eslint/eslint-plugin": "^8.32.1",
|
||||
"@typescript-eslint/parser": "^8.32.1",
|
||||
"@vitejs/plugin-react": "^4.3.4",
|
||||
"@vitest/coverage-v8": "^3.1.4",
|
||||
"eslint": "^9.27.0",
|
||||
"eslint-plugin-react": "^7.37.5",
|
||||
"eslint-plugin-react-hooks": "^5.2.0",
|
||||
|
||||
825
app/src/contexts/AuthContext.test.tsx
Normal file
825
app/src/contexts/AuthContext.test.tsx
Normal file
@@ -0,0 +1,825 @@
|
||||
import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
|
||||
import { renderHook, act, waitFor } from '@testing-library/react';
|
||||
import React from 'react';
|
||||
import { AuthProvider, useAuth } from './AuthContext';
|
||||
import { UserRole, type User } from '@/types/models';
|
||||
|
||||
// Set up mocks before imports are used
|
||||
vi.mock('@/api/auth', () => {
|
||||
return {
|
||||
login: vi.fn(),
|
||||
logout: vi.fn(),
|
||||
refreshToken: vi.fn(),
|
||||
getCurrentUser: vi.fn(),
|
||||
};
|
||||
});
|
||||
|
||||
vi.mock('@mantine/notifications', () => {
|
||||
return {
|
||||
notifications: {
|
||||
show: vi.fn(),
|
||||
},
|
||||
};
|
||||
});
|
||||
|
||||
// Import the mocks after they've been defined
|
||||
import {
|
||||
login as mockLogin,
|
||||
logout as mockLogout,
|
||||
refreshToken as mockRefreshToken,
|
||||
getCurrentUser as mockGetCurrentUser,
|
||||
} from '@/api/auth';
|
||||
import { notifications } from '@mantine/notifications';
|
||||
|
||||
// Get reference to the mocked notifications.show function
|
||||
const mockNotificationsShow = notifications.show as unknown as ReturnType<
|
||||
typeof vi.fn
|
||||
>;
|
||||
|
||||
// Mock user data
|
||||
const mockUser: User = {
|
||||
id: 1,
|
||||
email: 'test@example.com',
|
||||
displayName: 'Test User',
|
||||
role: UserRole.Editor,
|
||||
createdAt: '2024-01-01T00:00:00Z',
|
||||
lastWorkspaceId: 1,
|
||||
};
|
||||
|
||||
// Helper wrapper component for testing
|
||||
const createWrapper = () => {
|
||||
const Wrapper = ({ children }: { children: React.ReactNode }) => (
|
||||
<AuthProvider>{children}</AuthProvider>
|
||||
);
|
||||
Wrapper.displayName = 'AuthProviderTestWrapper';
|
||||
return Wrapper;
|
||||
};
|
||||
|
||||
describe('AuthContext', () => {
|
||||
beforeEach(() => {
|
||||
vi.clearAllMocks();
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
vi.restoreAllMocks();
|
||||
});
|
||||
|
||||
describe('AuthProvider initialization', () => {
|
||||
it('initializes with null user and loading state', () => {
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockRejectedValue(
|
||||
new Error('Not authenticated')
|
||||
);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
expect(result.current.user).toBeNull();
|
||||
expect(result.current.loading).toBe(true);
|
||||
expect(result.current.initialized).toBe(false);
|
||||
});
|
||||
|
||||
it('provides all expected functions', () => {
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockRejectedValue(
|
||||
new Error('Not authenticated')
|
||||
);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
expect(typeof result.current.login).toBe('function');
|
||||
expect(typeof result.current.logout).toBe('function');
|
||||
expect(typeof result.current.refreshToken).toBe('function');
|
||||
expect(typeof result.current.refreshUser).toBe('function');
|
||||
});
|
||||
|
||||
it('loads current user on mount when authenticated', async () => {
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockResolvedValue(
|
||||
mockUser
|
||||
);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.initialized).toBe(true);
|
||||
});
|
||||
|
||||
expect(result.current.user).toEqual(mockUser);
|
||||
expect(result.current.loading).toBe(false);
|
||||
expect(mockGetCurrentUser).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
|
||||
it('handles initialization error gracefully', async () => {
|
||||
const consoleSpy = vi
|
||||
.spyOn(console, 'error')
|
||||
.mockImplementation(() => {});
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockRejectedValue(
|
||||
new Error('Network error')
|
||||
);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.initialized).toBe(true);
|
||||
});
|
||||
|
||||
expect(result.current.user).toBeNull();
|
||||
expect(result.current.loading).toBe(false);
|
||||
expect(consoleSpy).toHaveBeenCalledWith(
|
||||
'Failed to initialize auth:',
|
||||
expect.any(Error)
|
||||
);
|
||||
|
||||
consoleSpy.mockRestore();
|
||||
});
|
||||
});
|
||||
|
||||
describe('useAuth hook', () => {
|
||||
it('throws error when used outside AuthProvider', () => {
|
||||
const consoleSpy = vi
|
||||
.spyOn(console, 'error')
|
||||
.mockImplementation(() => {});
|
||||
|
||||
expect(() => {
|
||||
renderHook(() => useAuth());
|
||||
}).toThrow('useAuth must be used within an AuthProvider');
|
||||
|
||||
consoleSpy.mockRestore();
|
||||
});
|
||||
|
||||
it('returns auth context when used within provider', async () => {
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockRejectedValue(
|
||||
new Error('Not authenticated')
|
||||
);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.initialized).toBe(true);
|
||||
});
|
||||
|
||||
expect(result.current).toBeDefined();
|
||||
expect(typeof result.current).toBe('object');
|
||||
});
|
||||
|
||||
it('maintains function stability across re-renders', async () => {
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockRejectedValue(
|
||||
new Error('Not authenticated')
|
||||
);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result, rerender } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.initialized).toBe(true);
|
||||
});
|
||||
|
||||
const initialFunctions = {
|
||||
login: result.current.login,
|
||||
logout: result.current.logout,
|
||||
refreshToken: result.current.refreshToken,
|
||||
refreshUser: result.current.refreshUser,
|
||||
};
|
||||
|
||||
rerender();
|
||||
|
||||
expect(result.current.login).toBe(initialFunctions.login);
|
||||
expect(result.current.logout).toBe(initialFunctions.logout);
|
||||
expect(result.current.refreshToken).toBe(initialFunctions.refreshToken);
|
||||
expect(result.current.refreshUser).toBe(initialFunctions.refreshUser);
|
||||
});
|
||||
});
|
||||
|
||||
describe('login functionality', () => {
|
||||
beforeEach(() => {
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockRejectedValue(
|
||||
new Error('Not authenticated')
|
||||
);
|
||||
});
|
||||
|
||||
it('logs in user successfully', async () => {
|
||||
(mockLogin as ReturnType<typeof vi.fn>).mockResolvedValue(mockUser);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.initialized).toBe(true);
|
||||
});
|
||||
|
||||
let loginResult: boolean | undefined;
|
||||
await act(async () => {
|
||||
loginResult = await result.current.login(
|
||||
'test@example.com',
|
||||
'password123'
|
||||
);
|
||||
});
|
||||
|
||||
expect(loginResult).toBe(true);
|
||||
expect(result.current.user).toEqual(mockUser);
|
||||
expect(mockLogin).toHaveBeenCalledWith('test@example.com', 'password123');
|
||||
expect(mockNotificationsShow).toHaveBeenCalledWith({
|
||||
title: 'Success',
|
||||
message: 'Logged in successfully',
|
||||
color: 'green',
|
||||
});
|
||||
});
|
||||
|
||||
it('handles login failure with error message', async () => {
|
||||
const consoleSpy = vi
|
||||
.spyOn(console, 'error')
|
||||
.mockImplementation(() => {});
|
||||
(mockLogin as ReturnType<typeof vi.fn>).mockRejectedValue(
|
||||
new Error('Invalid credentials')
|
||||
);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.initialized).toBe(true);
|
||||
});
|
||||
|
||||
let loginResult: boolean | undefined;
|
||||
await act(async () => {
|
||||
loginResult = await result.current.login(
|
||||
'test@example.com',
|
||||
'wrongpassword'
|
||||
);
|
||||
});
|
||||
|
||||
expect(loginResult).toBe(false);
|
||||
expect(result.current.user).toBeNull();
|
||||
expect(consoleSpy).toHaveBeenCalledWith(
|
||||
'Login failed:',
|
||||
expect.any(Error)
|
||||
);
|
||||
expect(mockNotificationsShow).toHaveBeenCalledWith({
|
||||
title: 'Error',
|
||||
message: 'Invalid credentials',
|
||||
color: 'red',
|
||||
});
|
||||
|
||||
consoleSpy.mockRestore();
|
||||
});
|
||||
|
||||
it('handles login failure with generic message', async () => {
|
||||
const consoleSpy = vi
|
||||
.spyOn(console, 'error')
|
||||
.mockImplementation(() => {});
|
||||
(mockLogin as ReturnType<typeof vi.fn>).mockRejectedValue(
|
||||
'Network error'
|
||||
);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.initialized).toBe(true);
|
||||
});
|
||||
|
||||
let loginResult: boolean | undefined;
|
||||
await act(async () => {
|
||||
loginResult = await result.current.login(
|
||||
'test@example.com',
|
||||
'password123'
|
||||
);
|
||||
});
|
||||
|
||||
expect(loginResult).toBe(false);
|
||||
expect(mockNotificationsShow).toHaveBeenCalledWith({
|
||||
title: 'Error',
|
||||
message: 'Login failed',
|
||||
color: 'red',
|
||||
});
|
||||
|
||||
consoleSpy.mockRestore();
|
||||
});
|
||||
|
||||
it('handles multiple login attempts', async () => {
|
||||
(mockLogin as ReturnType<typeof vi.fn>)
|
||||
.mockRejectedValueOnce(new Error('First attempt failed'))
|
||||
.mockResolvedValueOnce(mockUser);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.initialized).toBe(true);
|
||||
});
|
||||
|
||||
// First attempt fails
|
||||
let firstResult: boolean | undefined;
|
||||
await act(async () => {
|
||||
firstResult = await result.current.login(
|
||||
'test@example.com',
|
||||
'wrongpassword'
|
||||
);
|
||||
});
|
||||
|
||||
expect(firstResult).toBe(false);
|
||||
expect(result.current.user).toBeNull();
|
||||
|
||||
// Second attempt succeeds
|
||||
let secondResult: boolean | undefined;
|
||||
await act(async () => {
|
||||
secondResult = await result.current.login(
|
||||
'test@example.com',
|
||||
'correctpassword'
|
||||
);
|
||||
});
|
||||
|
||||
expect(secondResult).toBe(true);
|
||||
expect(result.current.user).toEqual(mockUser);
|
||||
});
|
||||
});
|
||||
|
||||
describe('logout functionality', () => {
|
||||
it('logs out user successfully', async () => {
|
||||
// Start with authenticated user
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockResolvedValue(
|
||||
mockUser
|
||||
);
|
||||
(mockLogout as ReturnType<typeof vi.fn>).mockResolvedValue(undefined);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.user).toEqual(mockUser);
|
||||
});
|
||||
|
||||
await act(async () => {
|
||||
await result.current.logout();
|
||||
});
|
||||
|
||||
expect(result.current.user).toBeNull();
|
||||
expect(mockLogout).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
|
||||
it('clears user state even when logout API fails', async () => {
|
||||
const consoleSpy = vi
|
||||
.spyOn(console, 'error')
|
||||
.mockImplementation(() => {});
|
||||
// Start with authenticated user
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockResolvedValue(
|
||||
mockUser
|
||||
);
|
||||
(mockLogout as ReturnType<typeof vi.fn>).mockRejectedValue(
|
||||
new Error('Logout failed')
|
||||
);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.user).toEqual(mockUser);
|
||||
});
|
||||
|
||||
await act(async () => {
|
||||
await result.current.logout();
|
||||
});
|
||||
|
||||
expect(result.current.user).toBeNull();
|
||||
expect(consoleSpy).toHaveBeenCalledWith(
|
||||
'Logout failed:',
|
||||
expect.any(Error)
|
||||
);
|
||||
|
||||
consoleSpy.mockRestore();
|
||||
});
|
||||
|
||||
it('handles logout when user is already null', async () => {
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockRejectedValue(
|
||||
new Error('Not authenticated')
|
||||
);
|
||||
(mockLogout as ReturnType<typeof vi.fn>).mockResolvedValue(undefined);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.initialized).toBe(true);
|
||||
});
|
||||
|
||||
await act(async () => {
|
||||
await result.current.logout();
|
||||
});
|
||||
|
||||
expect(result.current.user).toBeNull();
|
||||
expect(mockLogout).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
});
|
||||
|
||||
describe('refreshToken functionality', () => {
|
||||
it('refreshes token successfully', async () => {
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockRejectedValue(
|
||||
new Error('Not authenticated')
|
||||
);
|
||||
(mockRefreshToken as ReturnType<typeof vi.fn>).mockResolvedValue(true);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.initialized).toBe(true);
|
||||
});
|
||||
|
||||
let refreshResult: boolean | undefined;
|
||||
await act(async () => {
|
||||
refreshResult = await result.current.refreshToken();
|
||||
});
|
||||
|
||||
expect(refreshResult).toBe(true);
|
||||
expect(mockRefreshToken).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
|
||||
it('handles token refresh failure and logs out user', async () => {
|
||||
const consoleSpy = vi
|
||||
.spyOn(console, 'error')
|
||||
.mockImplementation(() => {});
|
||||
// Start with authenticated user
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockResolvedValue(
|
||||
mockUser
|
||||
);
|
||||
(mockRefreshToken as ReturnType<typeof vi.fn>).mockResolvedValue(false);
|
||||
(mockLogout as ReturnType<typeof vi.fn>).mockResolvedValue(undefined);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.user).toEqual(mockUser);
|
||||
});
|
||||
|
||||
let refreshResult: boolean | undefined;
|
||||
await act(async () => {
|
||||
refreshResult = await result.current.refreshToken();
|
||||
});
|
||||
|
||||
expect(refreshResult).toBe(false);
|
||||
expect(result.current.user).toBeNull();
|
||||
expect(mockLogout).toHaveBeenCalledTimes(1);
|
||||
|
||||
consoleSpy.mockRestore();
|
||||
});
|
||||
|
||||
it('handles token refresh API error and logs out user', async () => {
|
||||
const consoleSpy = vi
|
||||
.spyOn(console, 'error')
|
||||
.mockImplementation(() => {});
|
||||
// Start with authenticated user
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockResolvedValue(
|
||||
mockUser
|
||||
);
|
||||
(mockRefreshToken as ReturnType<typeof vi.fn>).mockRejectedValue(
|
||||
new Error('Refresh failed')
|
||||
);
|
||||
(mockLogout as ReturnType<typeof vi.fn>).mockResolvedValue(undefined);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.user).toEqual(mockUser);
|
||||
});
|
||||
|
||||
let refreshResult: boolean | undefined;
|
||||
await act(async () => {
|
||||
refreshResult = await result.current.refreshToken();
|
||||
});
|
||||
|
||||
expect(refreshResult).toBe(false);
|
||||
expect(result.current.user).toBeNull();
|
||||
expect(consoleSpy).toHaveBeenCalledWith(
|
||||
'Token refresh failed:',
|
||||
expect.any(Error)
|
||||
);
|
||||
expect(mockLogout).toHaveBeenCalledTimes(1);
|
||||
|
||||
consoleSpy.mockRestore();
|
||||
});
|
||||
});
|
||||
|
||||
describe('refreshUser functionality', () => {
|
||||
it('refreshes user data successfully', async () => {
|
||||
// Start with authenticated user
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockResolvedValue(
|
||||
mockUser
|
||||
);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.user).toEqual(mockUser);
|
||||
});
|
||||
|
||||
// Mock updated user data
|
||||
const updatedUser = { ...mockUser, displayName: 'Updated User' };
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockResolvedValue(
|
||||
updatedUser
|
||||
);
|
||||
|
||||
await act(async () => {
|
||||
await result.current.refreshUser();
|
||||
});
|
||||
|
||||
expect(result.current.user).toEqual(updatedUser);
|
||||
expect(mockGetCurrentUser).toHaveBeenCalledTimes(2); // Once on init, once on refresh
|
||||
});
|
||||
|
||||
it('handles user refresh failure', async () => {
|
||||
const consoleSpy = vi
|
||||
.spyOn(console, 'error')
|
||||
.mockImplementation(() => {});
|
||||
// Start with authenticated user
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockResolvedValue(
|
||||
mockUser
|
||||
);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.user).toEqual(mockUser);
|
||||
});
|
||||
|
||||
// Mock refresh failure
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockRejectedValue(
|
||||
new Error('Refresh user failed')
|
||||
);
|
||||
|
||||
await act(async () => {
|
||||
await result.current.refreshUser();
|
||||
});
|
||||
|
||||
// User should remain the same after failed refresh
|
||||
expect(result.current.user).toEqual(mockUser);
|
||||
expect(consoleSpy).toHaveBeenCalledWith(
|
||||
'Failed to refresh user data:',
|
||||
expect.any(Error)
|
||||
);
|
||||
|
||||
consoleSpy.mockRestore();
|
||||
});
|
||||
});
|
||||
|
||||
describe('authentication state transitions', () => {
|
||||
it('transitions from unauthenticated to authenticated', async () => {
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockRejectedValue(
|
||||
new Error('Not authenticated')
|
||||
);
|
||||
(mockLogin as ReturnType<typeof vi.fn>).mockResolvedValue(mockUser);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.initialized).toBe(true);
|
||||
});
|
||||
|
||||
expect(result.current.user).toBeNull();
|
||||
|
||||
await act(async () => {
|
||||
await result.current.login('test@example.com', 'password123');
|
||||
});
|
||||
|
||||
expect(result.current.user).toEqual(mockUser);
|
||||
});
|
||||
|
||||
it('transitions from authenticated to unauthenticated', async () => {
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockResolvedValue(
|
||||
mockUser
|
||||
);
|
||||
(mockLogout as ReturnType<typeof vi.fn>).mockResolvedValue(undefined);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.user).toEqual(mockUser);
|
||||
});
|
||||
|
||||
await act(async () => {
|
||||
await result.current.logout();
|
||||
});
|
||||
|
||||
expect(result.current.user).toBeNull();
|
||||
});
|
||||
|
||||
it('handles user data updates while authenticated', async () => {
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockResolvedValue(
|
||||
mockUser
|
||||
);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.user).toEqual(mockUser);
|
||||
});
|
||||
|
||||
// Simulate user profile update
|
||||
const updatedUser = { ...mockUser, displayName: 'Updated Name' };
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockResolvedValue(
|
||||
updatedUser
|
||||
);
|
||||
|
||||
await act(async () => {
|
||||
await result.current.refreshUser();
|
||||
});
|
||||
|
||||
expect(result.current.user).toEqual(updatedUser);
|
||||
});
|
||||
});
|
||||
|
||||
describe('context value structure', () => {
|
||||
it('provides expected context interface', async () => {
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockRejectedValue(
|
||||
new Error('Not authenticated')
|
||||
);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.initialized).toBe(true);
|
||||
});
|
||||
|
||||
// Check boolean and object values
|
||||
expect(result.current.user).toBeNull();
|
||||
expect(result.current.loading).toBe(false);
|
||||
expect(result.current.initialized).toBe(true);
|
||||
|
||||
// Check function types
|
||||
expect(typeof result.current.login).toBe('function');
|
||||
expect(typeof result.current.logout).toBe('function');
|
||||
expect(typeof result.current.refreshToken).toBe('function');
|
||||
expect(typeof result.current.refreshUser).toBe('function');
|
||||
});
|
||||
|
||||
it('provides correct context when authenticated', async () => {
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockResolvedValue(
|
||||
mockUser
|
||||
);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.initialized).toBe(true);
|
||||
});
|
||||
|
||||
// Check boolean and object values
|
||||
expect(result.current.user).toEqual(mockUser);
|
||||
expect(result.current.loading).toBe(false);
|
||||
expect(result.current.initialized).toBe(true);
|
||||
|
||||
// Check function types
|
||||
expect(typeof result.current.login).toBe('function');
|
||||
expect(typeof result.current.logout).toBe('function');
|
||||
expect(typeof result.current.refreshToken).toBe('function');
|
||||
expect(typeof result.current.refreshUser).toBe('function');
|
||||
});
|
||||
});
|
||||
|
||||
describe('loading states', () => {
|
||||
it('shows loading during initialization', () => {
|
||||
let resolveGetCurrentUser: (value: User) => void;
|
||||
const pendingPromise = new Promise<User>((resolve) => {
|
||||
resolveGetCurrentUser = resolve;
|
||||
});
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockReturnValue(
|
||||
pendingPromise
|
||||
);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
expect(result.current.loading).toBe(true);
|
||||
expect(result.current.initialized).toBe(false);
|
||||
|
||||
act(() => {
|
||||
resolveGetCurrentUser!(mockUser);
|
||||
});
|
||||
});
|
||||
|
||||
it('clears loading after initialization completes', async () => {
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockResolvedValue(
|
||||
mockUser
|
||||
);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.loading).toBe(false);
|
||||
expect(result.current.initialized).toBe(true);
|
||||
});
|
||||
});
|
||||
|
||||
it('clears loading after initialization fails', async () => {
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockRejectedValue(
|
||||
new Error('Init failed')
|
||||
);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.loading).toBe(false);
|
||||
expect(result.current.initialized).toBe(true);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('error handling', () => {
|
||||
it('handles network errors during login', async () => {
|
||||
const consoleSpy = vi
|
||||
.spyOn(console, 'error')
|
||||
.mockImplementation(() => {});
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockRejectedValue(
|
||||
new Error('Not authenticated')
|
||||
);
|
||||
(mockLogin as ReturnType<typeof vi.fn>).mockRejectedValue(
|
||||
new Error('Network unavailable')
|
||||
);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.initialized).toBe(true);
|
||||
});
|
||||
|
||||
await act(async () => {
|
||||
const success = await result.current.login(
|
||||
'test@example.com',
|
||||
'password123'
|
||||
);
|
||||
expect(success).toBe(false);
|
||||
});
|
||||
|
||||
expect(mockNotificationsShow).toHaveBeenCalledWith({
|
||||
title: 'Error',
|
||||
message: 'Network unavailable',
|
||||
color: 'red',
|
||||
});
|
||||
|
||||
consoleSpy.mockRestore();
|
||||
});
|
||||
|
||||
it('handles invalid user data during initialization', async () => {
|
||||
const consoleSpy = vi
|
||||
.spyOn(console, 'error')
|
||||
.mockImplementation(() => {});
|
||||
// Use a more precise type for testing
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockResolvedValue({
|
||||
invalid: 'user',
|
||||
} as unknown as User);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.initialized).toBe(true);
|
||||
});
|
||||
|
||||
expect(result.current.user).toEqual({ invalid: 'user' });
|
||||
|
||||
consoleSpy.mockRestore();
|
||||
});
|
||||
});
|
||||
|
||||
describe('concurrent operations', () => {
|
||||
it('handles concurrent login attempts', async () => {
|
||||
(mockGetCurrentUser as ReturnType<typeof vi.fn>).mockRejectedValue(
|
||||
new Error('Not authenticated')
|
||||
);
|
||||
(mockLogin as ReturnType<typeof vi.fn>).mockResolvedValue(mockUser);
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useAuth(), { wrapper });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.initialized).toBe(true);
|
||||
});
|
||||
|
||||
// Make concurrent login calls
|
||||
const [result1, result2] = await act(async () => {
|
||||
return Promise.all([
|
||||
result.current.login('test@example.com', 'password123'),
|
||||
result.current.login('test@example.com', 'password123'),
|
||||
]);
|
||||
});
|
||||
|
||||
expect(result1).toBe(true);
|
||||
expect(result2).toBe(true);
|
||||
expect(result.current.user).toEqual(mockUser);
|
||||
expect(mockLogin).toHaveBeenCalledTimes(2);
|
||||
});
|
||||
});
|
||||
});
|
||||
658
app/src/contexts/ModalContext.test.tsx
Normal file
658
app/src/contexts/ModalContext.test.tsx
Normal file
@@ -0,0 +1,658 @@
|
||||
import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
|
||||
import { renderHook, act } from '@testing-library/react';
|
||||
import React from 'react';
|
||||
import { ModalProvider, useModalContext } from './ModalContext';
|
||||
|
||||
// Helper wrapper component for testing
|
||||
const createWrapper = () => {
|
||||
const Wrapper = ({ children }: { children: React.ReactNode }) => (
|
||||
<ModalProvider>{children}</ModalProvider>
|
||||
);
|
||||
Wrapper.displayName = 'ModalProviderTestWrapper';
|
||||
return Wrapper;
|
||||
};
|
||||
|
||||
describe('ModalContext', () => {
|
||||
beforeEach(() => {
|
||||
vi.clearAllMocks();
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
vi.restoreAllMocks();
|
||||
});
|
||||
|
||||
describe('ModalProvider', () => {
|
||||
it('provides modal context with initial false values', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
expect(result.current.newFileModalVisible).toBe(false);
|
||||
expect(result.current.deleteFileModalVisible).toBe(false);
|
||||
expect(result.current.commitMessageModalVisible).toBe(false);
|
||||
expect(result.current.settingsModalVisible).toBe(false);
|
||||
expect(result.current.switchWorkspaceModalVisible).toBe(false);
|
||||
expect(result.current.createWorkspaceModalVisible).toBe(false);
|
||||
});
|
||||
|
||||
it('provides all setter functions', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
expect(typeof result.current.setNewFileModalVisible).toBe('function');
|
||||
expect(typeof result.current.setDeleteFileModalVisible).toBe('function');
|
||||
expect(typeof result.current.setCommitMessageModalVisible).toBe(
|
||||
'function'
|
||||
);
|
||||
expect(typeof result.current.setSettingsModalVisible).toBe('function');
|
||||
expect(typeof result.current.setSwitchWorkspaceModalVisible).toBe(
|
||||
'function'
|
||||
);
|
||||
expect(typeof result.current.setCreateWorkspaceModalVisible).toBe(
|
||||
'function'
|
||||
);
|
||||
});
|
||||
|
||||
it('provides complete context interface', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
const expectedKeys = [
|
||||
'newFileModalVisible',
|
||||
'setNewFileModalVisible',
|
||||
'deleteFileModalVisible',
|
||||
'setDeleteFileModalVisible',
|
||||
'commitMessageModalVisible',
|
||||
'setCommitMessageModalVisible',
|
||||
'settingsModalVisible',
|
||||
'setSettingsModalVisible',
|
||||
'switchWorkspaceModalVisible',
|
||||
'setSwitchWorkspaceModalVisible',
|
||||
'createWorkspaceModalVisible',
|
||||
'setCreateWorkspaceModalVisible',
|
||||
];
|
||||
|
||||
expectedKeys.forEach((key) => {
|
||||
expect(key in result.current).toBe(true);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('useModalContext hook', () => {
|
||||
it('throws error when used outside ModalProvider', () => {
|
||||
// Suppress console.error for this test since we expect an error
|
||||
const consoleSpy = vi
|
||||
.spyOn(console, 'error')
|
||||
.mockImplementation(() => {});
|
||||
|
||||
expect(() => {
|
||||
renderHook(() => useModalContext());
|
||||
}).toThrow('useModalContext must be used within a ModalProvider');
|
||||
|
||||
consoleSpy.mockRestore();
|
||||
});
|
||||
|
||||
it('returns modal context when used within provider', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
expect(result.current).toBeDefined();
|
||||
expect(typeof result.current).toBe('object');
|
||||
});
|
||||
|
||||
it('maintains function stability across re-renders', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result, rerender } = renderHook(() => useModalContext(), {
|
||||
wrapper,
|
||||
});
|
||||
|
||||
const initialSetters = {
|
||||
setNewFileModalVisible: result.current.setNewFileModalVisible,
|
||||
setDeleteFileModalVisible: result.current.setDeleteFileModalVisible,
|
||||
setCommitMessageModalVisible:
|
||||
result.current.setCommitMessageModalVisible,
|
||||
setSettingsModalVisible: result.current.setSettingsModalVisible,
|
||||
setSwitchWorkspaceModalVisible:
|
||||
result.current.setSwitchWorkspaceModalVisible,
|
||||
setCreateWorkspaceModalVisible:
|
||||
result.current.setCreateWorkspaceModalVisible,
|
||||
};
|
||||
|
||||
rerender();
|
||||
|
||||
expect(result.current.setNewFileModalVisible).toBe(
|
||||
initialSetters.setNewFileModalVisible
|
||||
);
|
||||
expect(result.current.setDeleteFileModalVisible).toBe(
|
||||
initialSetters.setDeleteFileModalVisible
|
||||
);
|
||||
expect(result.current.setCommitMessageModalVisible).toBe(
|
||||
initialSetters.setCommitMessageModalVisible
|
||||
);
|
||||
expect(result.current.setSettingsModalVisible).toBe(
|
||||
initialSetters.setSettingsModalVisible
|
||||
);
|
||||
expect(result.current.setSwitchWorkspaceModalVisible).toBe(
|
||||
initialSetters.setSwitchWorkspaceModalVisible
|
||||
);
|
||||
expect(result.current.setCreateWorkspaceModalVisible).toBe(
|
||||
initialSetters.setCreateWorkspaceModalVisible
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
describe('modal state management', () => {
|
||||
describe('newFileModalVisible', () => {
|
||||
it('can be set to true', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
act(() => {
|
||||
result.current.setNewFileModalVisible(true);
|
||||
});
|
||||
|
||||
expect(result.current.newFileModalVisible).toBe(true);
|
||||
});
|
||||
|
||||
it('can be toggled back to false', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
act(() => {
|
||||
result.current.setNewFileModalVisible(true);
|
||||
});
|
||||
|
||||
act(() => {
|
||||
result.current.setNewFileModalVisible(false);
|
||||
});
|
||||
|
||||
expect(result.current.newFileModalVisible).toBe(false);
|
||||
});
|
||||
|
||||
it('can be toggled multiple times', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
act(() => {
|
||||
result.current.setNewFileModalVisible(true);
|
||||
});
|
||||
expect(result.current.newFileModalVisible).toBe(true);
|
||||
|
||||
act(() => {
|
||||
result.current.setNewFileModalVisible(false);
|
||||
});
|
||||
expect(result.current.newFileModalVisible).toBe(false);
|
||||
|
||||
act(() => {
|
||||
result.current.setNewFileModalVisible(true);
|
||||
});
|
||||
expect(result.current.newFileModalVisible).toBe(true);
|
||||
});
|
||||
});
|
||||
|
||||
describe('deleteFileModalVisible', () => {
|
||||
it('can be set to true', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
act(() => {
|
||||
result.current.setDeleteFileModalVisible(true);
|
||||
});
|
||||
|
||||
expect(result.current.deleteFileModalVisible).toBe(true);
|
||||
});
|
||||
|
||||
it('can be toggled back to false', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
act(() => {
|
||||
result.current.setDeleteFileModalVisible(true);
|
||||
});
|
||||
|
||||
act(() => {
|
||||
result.current.setDeleteFileModalVisible(false);
|
||||
});
|
||||
|
||||
expect(result.current.deleteFileModalVisible).toBe(false);
|
||||
});
|
||||
});
|
||||
|
||||
describe('commitMessageModalVisible', () => {
|
||||
it('can be set to true', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
act(() => {
|
||||
result.current.setCommitMessageModalVisible(true);
|
||||
});
|
||||
|
||||
expect(result.current.commitMessageModalVisible).toBe(true);
|
||||
});
|
||||
|
||||
it('can be toggled back to false', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
act(() => {
|
||||
result.current.setCommitMessageModalVisible(true);
|
||||
});
|
||||
|
||||
act(() => {
|
||||
result.current.setCommitMessageModalVisible(false);
|
||||
});
|
||||
|
||||
expect(result.current.commitMessageModalVisible).toBe(false);
|
||||
});
|
||||
});
|
||||
|
||||
describe('settingsModalVisible', () => {
|
||||
it('can be set to true', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
act(() => {
|
||||
result.current.setSettingsModalVisible(true);
|
||||
});
|
||||
|
||||
expect(result.current.settingsModalVisible).toBe(true);
|
||||
});
|
||||
|
||||
it('can be toggled back to false', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
act(() => {
|
||||
result.current.setSettingsModalVisible(true);
|
||||
});
|
||||
|
||||
act(() => {
|
||||
result.current.setSettingsModalVisible(false);
|
||||
});
|
||||
|
||||
expect(result.current.settingsModalVisible).toBe(false);
|
||||
});
|
||||
});
|
||||
|
||||
describe('switchWorkspaceModalVisible', () => {
|
||||
it('can be set to true', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
act(() => {
|
||||
result.current.setSwitchWorkspaceModalVisible(true);
|
||||
});
|
||||
|
||||
expect(result.current.switchWorkspaceModalVisible).toBe(true);
|
||||
});
|
||||
|
||||
it('can be toggled back to false', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
act(() => {
|
||||
result.current.setSwitchWorkspaceModalVisible(true);
|
||||
});
|
||||
|
||||
act(() => {
|
||||
result.current.setSwitchWorkspaceModalVisible(false);
|
||||
});
|
||||
|
||||
expect(result.current.switchWorkspaceModalVisible).toBe(false);
|
||||
});
|
||||
});
|
||||
|
||||
describe('createWorkspaceModalVisible', () => {
|
||||
it('can be set to true', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
act(() => {
|
||||
result.current.setCreateWorkspaceModalVisible(true);
|
||||
});
|
||||
|
||||
expect(result.current.createWorkspaceModalVisible).toBe(true);
|
||||
});
|
||||
|
||||
it('can be toggled back to false', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
act(() => {
|
||||
result.current.setCreateWorkspaceModalVisible(true);
|
||||
});
|
||||
|
||||
act(() => {
|
||||
result.current.setCreateWorkspaceModalVisible(false);
|
||||
});
|
||||
|
||||
expect(result.current.createWorkspaceModalVisible).toBe(false);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('independent modal state', () => {
|
||||
it('each modal state is independent', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
// Set multiple modals to true
|
||||
act(() => {
|
||||
result.current.setNewFileModalVisible(true);
|
||||
result.current.setDeleteFileModalVisible(true);
|
||||
result.current.setSettingsModalVisible(true);
|
||||
});
|
||||
|
||||
expect(result.current.newFileModalVisible).toBe(true);
|
||||
expect(result.current.deleteFileModalVisible).toBe(true);
|
||||
expect(result.current.settingsModalVisible).toBe(true);
|
||||
expect(result.current.commitMessageModalVisible).toBe(false);
|
||||
expect(result.current.switchWorkspaceModalVisible).toBe(false);
|
||||
expect(result.current.createWorkspaceModalVisible).toBe(false);
|
||||
});
|
||||
|
||||
it('setting one modal does not affect others', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
// Set all modals to true first
|
||||
act(() => {
|
||||
result.current.setNewFileModalVisible(true);
|
||||
result.current.setDeleteFileModalVisible(true);
|
||||
result.current.setCommitMessageModalVisible(true);
|
||||
result.current.setSettingsModalVisible(true);
|
||||
result.current.setSwitchWorkspaceModalVisible(true);
|
||||
result.current.setCreateWorkspaceModalVisible(true);
|
||||
});
|
||||
|
||||
// Toggle one modal off
|
||||
act(() => {
|
||||
result.current.setNewFileModalVisible(false);
|
||||
});
|
||||
|
||||
expect(result.current.newFileModalVisible).toBe(false);
|
||||
expect(result.current.deleteFileModalVisible).toBe(true);
|
||||
expect(result.current.commitMessageModalVisible).toBe(true);
|
||||
expect(result.current.settingsModalVisible).toBe(true);
|
||||
expect(result.current.switchWorkspaceModalVisible).toBe(true);
|
||||
expect(result.current.createWorkspaceModalVisible).toBe(true);
|
||||
});
|
||||
});
|
||||
|
||||
describe('useState setter function behavior', () => {
|
||||
it('handles function updater pattern', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
// Test function updater for toggling
|
||||
act(() => {
|
||||
result.current.setNewFileModalVisible((prev) => !prev);
|
||||
});
|
||||
|
||||
expect(result.current.newFileModalVisible).toBe(true);
|
||||
|
||||
act(() => {
|
||||
result.current.setNewFileModalVisible((prev) => !prev);
|
||||
});
|
||||
|
||||
expect(result.current.newFileModalVisible).toBe(false);
|
||||
});
|
||||
|
||||
it('handles conditional updates with function updater', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
// Set to true first
|
||||
act(() => {
|
||||
result.current.setSettingsModalVisible(true);
|
||||
});
|
||||
|
||||
// Use function updater with condition
|
||||
act(() => {
|
||||
result.current.setSettingsModalVisible((prev) => (prev ? false : true));
|
||||
});
|
||||
|
||||
expect(result.current.settingsModalVisible).toBe(false);
|
||||
});
|
||||
|
||||
it('supports multiple rapid state updates', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
act(() => {
|
||||
result.current.setNewFileModalVisible(true);
|
||||
result.current.setNewFileModalVisible(false);
|
||||
result.current.setNewFileModalVisible(true);
|
||||
});
|
||||
|
||||
expect(result.current.newFileModalVisible).toBe(true);
|
||||
});
|
||||
});
|
||||
|
||||
describe('provider nesting', () => {
|
||||
it('inner provider creates independent context', () => {
|
||||
const OuterWrapper = ({ children }: { children: React.ReactNode }) => (
|
||||
<ModalProvider>{children}</ModalProvider>
|
||||
);
|
||||
|
||||
const InnerWrapper = ({ children }: { children: React.ReactNode }) => (
|
||||
<OuterWrapper>
|
||||
<ModalProvider>{children}</ModalProvider>
|
||||
</OuterWrapper>
|
||||
);
|
||||
|
||||
const { result } = renderHook(() => useModalContext(), {
|
||||
wrapper: InnerWrapper,
|
||||
});
|
||||
|
||||
// Should work with nested providers (inner context takes precedence)
|
||||
expect(result.current.newFileModalVisible).toBe(false);
|
||||
|
||||
act(() => {
|
||||
result.current.setNewFileModalVisible(true);
|
||||
});
|
||||
|
||||
expect(result.current.newFileModalVisible).toBe(true);
|
||||
});
|
||||
});
|
||||
|
||||
describe('context value structure', () => {
|
||||
it('provides expected context interface', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
const expectedBooleanValues = {
|
||||
newFileModalVisible: false,
|
||||
deleteFileModalVisible: false,
|
||||
commitMessageModalVisible: false,
|
||||
settingsModalVisible: false,
|
||||
switchWorkspaceModalVisible: false,
|
||||
createWorkspaceModalVisible: false,
|
||||
};
|
||||
|
||||
// Check the boolean values
|
||||
Object.entries(expectedBooleanValues).forEach(([key, value]) => {
|
||||
expect(result.current[key as keyof typeof result.current]).toBe(value);
|
||||
});
|
||||
|
||||
// Check the setter functions exist
|
||||
expect(typeof result.current.setNewFileModalVisible).toBe('function');
|
||||
expect(typeof result.current.setDeleteFileModalVisible).toBe('function');
|
||||
expect(typeof result.current.setCommitMessageModalVisible).toBe(
|
||||
'function'
|
||||
);
|
||||
expect(typeof result.current.setSettingsModalVisible).toBe('function');
|
||||
expect(typeof result.current.setSwitchWorkspaceModalVisible).toBe(
|
||||
'function'
|
||||
);
|
||||
expect(typeof result.current.setCreateWorkspaceModalVisible).toBe(
|
||||
'function'
|
||||
);
|
||||
});
|
||||
|
||||
it('all boolean values have correct types', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
expect(typeof result.current.newFileModalVisible).toBe('boolean');
|
||||
expect(typeof result.current.deleteFileModalVisible).toBe('boolean');
|
||||
expect(typeof result.current.commitMessageModalVisible).toBe('boolean');
|
||||
expect(typeof result.current.settingsModalVisible).toBe('boolean');
|
||||
expect(typeof result.current.switchWorkspaceModalVisible).toBe('boolean');
|
||||
expect(typeof result.current.createWorkspaceModalVisible).toBe('boolean');
|
||||
});
|
||||
|
||||
it('all setter functions have correct types', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
expect(typeof result.current.setNewFileModalVisible).toBe('function');
|
||||
expect(typeof result.current.setDeleteFileModalVisible).toBe('function');
|
||||
expect(typeof result.current.setCommitMessageModalVisible).toBe(
|
||||
'function'
|
||||
);
|
||||
expect(typeof result.current.setSettingsModalVisible).toBe('function');
|
||||
expect(typeof result.current.setSwitchWorkspaceModalVisible).toBe(
|
||||
'function'
|
||||
);
|
||||
expect(typeof result.current.setCreateWorkspaceModalVisible).toBe(
|
||||
'function'
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
describe('performance considerations', () => {
|
||||
it('does not cause unnecessary re-renders', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result, rerender } = renderHook(() => useModalContext(), {
|
||||
wrapper,
|
||||
});
|
||||
|
||||
const initialContext = result.current;
|
||||
|
||||
// Re-render without changing anything
|
||||
rerender();
|
||||
|
||||
// All function references should be stable
|
||||
expect(result.current.setNewFileModalVisible).toBe(
|
||||
initialContext.setNewFileModalVisible
|
||||
);
|
||||
expect(result.current.setDeleteFileModalVisible).toBe(
|
||||
initialContext.setDeleteFileModalVisible
|
||||
);
|
||||
expect(result.current.setCommitMessageModalVisible).toBe(
|
||||
initialContext.setCommitMessageModalVisible
|
||||
);
|
||||
expect(result.current.setSettingsModalVisible).toBe(
|
||||
initialContext.setSettingsModalVisible
|
||||
);
|
||||
expect(result.current.setSwitchWorkspaceModalVisible).toBe(
|
||||
initialContext.setSwitchWorkspaceModalVisible
|
||||
);
|
||||
expect(result.current.setCreateWorkspaceModalVisible).toBe(
|
||||
initialContext.setCreateWorkspaceModalVisible
|
||||
);
|
||||
});
|
||||
|
||||
it('maintains setter function stability after state changes', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
const initialSetters = {
|
||||
setNewFileModalVisible: result.current.setNewFileModalVisible,
|
||||
setDeleteFileModalVisible: result.current.setDeleteFileModalVisible,
|
||||
};
|
||||
|
||||
// Change some state
|
||||
act(() => {
|
||||
result.current.setNewFileModalVisible(true);
|
||||
result.current.setDeleteFileModalVisible(true);
|
||||
});
|
||||
|
||||
// Function references should still be the same
|
||||
expect(result.current.setNewFileModalVisible).toBe(
|
||||
initialSetters.setNewFileModalVisible
|
||||
);
|
||||
expect(result.current.setDeleteFileModalVisible).toBe(
|
||||
initialSetters.setDeleteFileModalVisible
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
describe('real-world usage patterns', () => {
|
||||
it('supports common modal workflow patterns', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
// Typical workflow: open modal, perform action, close modal
|
||||
act(() => {
|
||||
result.current.setNewFileModalVisible(true);
|
||||
});
|
||||
|
||||
expect(result.current.newFileModalVisible).toBe(true);
|
||||
|
||||
// User performs action (file creation), then modal closes
|
||||
act(() => {
|
||||
result.current.setNewFileModalVisible(false);
|
||||
});
|
||||
|
||||
expect(result.current.newFileModalVisible).toBe(false);
|
||||
});
|
||||
|
||||
it('supports opening multiple modals in sequence', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
// Open new file modal
|
||||
act(() => {
|
||||
result.current.setNewFileModalVisible(true);
|
||||
});
|
||||
|
||||
// Close new file modal, open settings
|
||||
act(() => {
|
||||
result.current.setNewFileModalVisible(false);
|
||||
result.current.setSettingsModalVisible(true);
|
||||
});
|
||||
|
||||
expect(result.current.newFileModalVisible).toBe(false);
|
||||
expect(result.current.settingsModalVisible).toBe(true);
|
||||
|
||||
// Close settings, open workspace creation
|
||||
act(() => {
|
||||
result.current.setSettingsModalVisible(false);
|
||||
result.current.setCreateWorkspaceModalVisible(true);
|
||||
});
|
||||
|
||||
expect(result.current.settingsModalVisible).toBe(false);
|
||||
expect(result.current.createWorkspaceModalVisible).toBe(true);
|
||||
});
|
||||
|
||||
it('supports modal state reset pattern', () => {
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useModalContext(), { wrapper });
|
||||
|
||||
// Open multiple modals
|
||||
act(() => {
|
||||
result.current.setNewFileModalVisible(true);
|
||||
result.current.setSettingsModalVisible(true);
|
||||
result.current.setDeleteFileModalVisible(true);
|
||||
});
|
||||
|
||||
// Reset all to false (like on route change or logout)
|
||||
act(() => {
|
||||
result.current.setNewFileModalVisible(false);
|
||||
result.current.setSettingsModalVisible(false);
|
||||
result.current.setDeleteFileModalVisible(false);
|
||||
result.current.setCommitMessageModalVisible(false);
|
||||
result.current.setSwitchWorkspaceModalVisible(false);
|
||||
result.current.setCreateWorkspaceModalVisible(false);
|
||||
});
|
||||
|
||||
expect(result.current.newFileModalVisible).toBe(false);
|
||||
expect(result.current.settingsModalVisible).toBe(false);
|
||||
expect(result.current.deleteFileModalVisible).toBe(false);
|
||||
expect(result.current.commitMessageModalVisible).toBe(false);
|
||||
expect(result.current.switchWorkspaceModalVisible).toBe(false);
|
||||
expect(result.current.createWorkspaceModalVisible).toBe(false);
|
||||
});
|
||||
});
|
||||
});
|
||||
401
app/src/contexts/ThemeContext.test.tsx
Normal file
401
app/src/contexts/ThemeContext.test.tsx
Normal file
@@ -0,0 +1,401 @@
|
||||
import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
|
||||
import { renderHook, act } from '@testing-library/react';
|
||||
import React from 'react';
|
||||
import { ThemeProvider, useTheme } from './ThemeContext';
|
||||
import type { MantineColorScheme } from '@mantine/core';
|
||||
|
||||
// Mock Mantine's color scheme hook
|
||||
const mockSetColorScheme = vi.fn();
|
||||
const mockUseMantineColorScheme = vi.fn();
|
||||
|
||||
vi.mock('@mantine/core', () => ({
|
||||
useMantineColorScheme: (): {
|
||||
colorScheme: MantineColorScheme | undefined;
|
||||
setColorScheme?: (scheme: MantineColorScheme) => void;
|
||||
} =>
|
||||
mockUseMantineColorScheme() as {
|
||||
colorScheme: MantineColorScheme | undefined;
|
||||
setColorScheme?: (scheme: MantineColorScheme) => void;
|
||||
},
|
||||
}));
|
||||
|
||||
// Helper wrapper component for testing
|
||||
const createWrapper = (initialColorScheme: MantineColorScheme = 'light') => {
|
||||
mockUseMantineColorScheme.mockReturnValue({
|
||||
colorScheme: initialColorScheme,
|
||||
setColorScheme: mockSetColorScheme,
|
||||
});
|
||||
|
||||
const Wrapper = ({ children }: { children: React.ReactNode }) => (
|
||||
<ThemeProvider>{children}</ThemeProvider>
|
||||
);
|
||||
Wrapper.displayName = 'ThemeProviderTestWrapper';
|
||||
return Wrapper;
|
||||
};
|
||||
|
||||
describe('ThemeContext', () => {
|
||||
beforeEach(() => {
|
||||
vi.clearAllMocks();
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
vi.restoreAllMocks();
|
||||
});
|
||||
|
||||
describe('ThemeProvider', () => {
|
||||
it('provides theme context with light scheme by default', () => {
|
||||
const wrapper = createWrapper('light');
|
||||
const { result } = renderHook(() => useTheme(), { wrapper });
|
||||
|
||||
expect(result.current.colorScheme).toBe('light');
|
||||
expect(typeof result.current.updateColorScheme).toBe('function');
|
||||
});
|
||||
|
||||
it('provides theme context with dark scheme', () => {
|
||||
const wrapper = createWrapper('dark');
|
||||
const { result } = renderHook(() => useTheme(), { wrapper });
|
||||
|
||||
expect(result.current.colorScheme).toBe('dark');
|
||||
expect(typeof result.current.updateColorScheme).toBe('function');
|
||||
});
|
||||
|
||||
it('provides theme context with auto scheme', () => {
|
||||
const wrapper = createWrapper('auto');
|
||||
const { result } = renderHook(() => useTheme(), { wrapper });
|
||||
|
||||
expect(result.current.colorScheme).toBe('auto');
|
||||
expect(typeof result.current.updateColorScheme).toBe('function');
|
||||
});
|
||||
|
||||
it('calls useMantineColorScheme hook', () => {
|
||||
const wrapper = createWrapper('light');
|
||||
renderHook(() => useTheme(), { wrapper });
|
||||
|
||||
expect(mockUseMantineColorScheme).toHaveBeenCalled();
|
||||
});
|
||||
});
|
||||
|
||||
describe('useTheme hook', () => {
|
||||
it('throws error when used outside ThemeProvider', () => {
|
||||
// Suppress console.error for this test since we expect an error
|
||||
const consoleSpy = vi
|
||||
.spyOn(console, 'error')
|
||||
.mockImplementation(() => {});
|
||||
|
||||
expect(() => {
|
||||
renderHook(() => useTheme());
|
||||
}).toThrow('useTheme must be used within a ThemeProvider');
|
||||
|
||||
consoleSpy.mockRestore();
|
||||
});
|
||||
|
||||
it('returns current color scheme from Mantine', () => {
|
||||
const wrapper = createWrapper('dark');
|
||||
const { result } = renderHook(() => useTheme(), { wrapper });
|
||||
|
||||
expect(result.current.colorScheme).toBe('dark');
|
||||
});
|
||||
|
||||
it('provides updateColorScheme function', () => {
|
||||
const wrapper = createWrapper('light');
|
||||
const { result } = renderHook(() => useTheme(), { wrapper });
|
||||
|
||||
expect(typeof result.current.updateColorScheme).toBe('function');
|
||||
});
|
||||
|
||||
it('maintains function stability across re-renders', () => {
|
||||
const wrapper = createWrapper('light');
|
||||
const { result, rerender } = renderHook(() => useTheme(), { wrapper });
|
||||
|
||||
const initialUpdateFunction = result.current.updateColorScheme;
|
||||
|
||||
rerender();
|
||||
|
||||
expect(result.current.updateColorScheme).toBe(initialUpdateFunction);
|
||||
});
|
||||
});
|
||||
|
||||
describe('updateColorScheme functionality', () => {
|
||||
it('calls setColorScheme when updateColorScheme is invoked', () => {
|
||||
const wrapper = createWrapper('light');
|
||||
const { result } = renderHook(() => useTheme(), { wrapper });
|
||||
|
||||
act(() => {
|
||||
result.current.updateColorScheme('dark');
|
||||
});
|
||||
|
||||
expect(mockSetColorScheme).toHaveBeenCalledWith('dark');
|
||||
});
|
||||
|
||||
it('handles switching from light to dark', () => {
|
||||
const wrapper = createWrapper('light');
|
||||
const { result } = renderHook(() => useTheme(), { wrapper });
|
||||
|
||||
act(() => {
|
||||
result.current.updateColorScheme('dark');
|
||||
});
|
||||
|
||||
expect(mockSetColorScheme).toHaveBeenCalledWith('dark');
|
||||
expect(mockSetColorScheme).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
|
||||
it('handles switching from dark to light', () => {
|
||||
const wrapper = createWrapper('dark');
|
||||
const { result } = renderHook(() => useTheme(), { wrapper });
|
||||
|
||||
act(() => {
|
||||
result.current.updateColorScheme('light');
|
||||
});
|
||||
|
||||
expect(mockSetColorScheme).toHaveBeenCalledWith('light');
|
||||
expect(mockSetColorScheme).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
|
||||
it('handles switching to auto scheme', () => {
|
||||
const wrapper = createWrapper('light');
|
||||
const { result } = renderHook(() => useTheme(), { wrapper });
|
||||
|
||||
act(() => {
|
||||
result.current.updateColorScheme('auto');
|
||||
});
|
||||
|
||||
expect(mockSetColorScheme).toHaveBeenCalledWith('auto');
|
||||
});
|
||||
|
||||
it('handles multiple color scheme changes', () => {
|
||||
const wrapper = createWrapper('light');
|
||||
const { result } = renderHook(() => useTheme(), { wrapper });
|
||||
|
||||
act(() => {
|
||||
result.current.updateColorScheme('dark');
|
||||
});
|
||||
|
||||
act(() => {
|
||||
result.current.updateColorScheme('auto');
|
||||
});
|
||||
|
||||
act(() => {
|
||||
result.current.updateColorScheme('light');
|
||||
});
|
||||
|
||||
expect(mockSetColorScheme).toHaveBeenCalledTimes(3);
|
||||
expect(mockSetColorScheme).toHaveBeenNthCalledWith(1, 'dark');
|
||||
expect(mockSetColorScheme).toHaveBeenNthCalledWith(2, 'auto');
|
||||
expect(mockSetColorScheme).toHaveBeenNthCalledWith(3, 'light');
|
||||
});
|
||||
|
||||
it('calls setColorScheme immediately without batching', () => {
|
||||
const wrapper = createWrapper('light');
|
||||
const { result } = renderHook(() => useTheme(), { wrapper });
|
||||
|
||||
// Multiple synchronous calls
|
||||
act(() => {
|
||||
result.current.updateColorScheme('dark');
|
||||
result.current.updateColorScheme('auto');
|
||||
result.current.updateColorScheme('light');
|
||||
});
|
||||
|
||||
expect(mockSetColorScheme).toHaveBeenCalledTimes(3);
|
||||
});
|
||||
});
|
||||
|
||||
describe('color scheme reactivity', () => {
|
||||
it('reflects color scheme changes from Mantine', () => {
|
||||
// Start with light
|
||||
mockUseMantineColorScheme.mockReturnValue({
|
||||
colorScheme: 'light',
|
||||
setColorScheme: mockSetColorScheme,
|
||||
});
|
||||
|
||||
const wrapper = createWrapper('light');
|
||||
const { result, rerender } = renderHook(() => useTheme(), { wrapper });
|
||||
|
||||
expect(result.current.colorScheme).toBe('light');
|
||||
|
||||
// Simulate Mantine color scheme change
|
||||
mockUseMantineColorScheme.mockReturnValue({
|
||||
colorScheme: 'dark',
|
||||
setColorScheme: mockSetColorScheme,
|
||||
});
|
||||
|
||||
rerender();
|
||||
|
||||
expect(result.current.colorScheme).toBe('dark');
|
||||
});
|
||||
|
||||
it('maintains function reference when color scheme changes', () => {
|
||||
mockUseMantineColorScheme.mockReturnValue({
|
||||
colorScheme: 'light',
|
||||
setColorScheme: mockSetColorScheme,
|
||||
});
|
||||
|
||||
const wrapper = createWrapper('light');
|
||||
const { result, rerender } = renderHook(() => useTheme(), { wrapper });
|
||||
|
||||
const initialUpdateFunction = result.current.updateColorScheme;
|
||||
|
||||
// Change color scheme
|
||||
mockUseMantineColorScheme.mockReturnValue({
|
||||
colorScheme: 'dark',
|
||||
setColorScheme: mockSetColorScheme,
|
||||
});
|
||||
|
||||
rerender();
|
||||
|
||||
expect(result.current.updateColorScheme).toBe(initialUpdateFunction);
|
||||
});
|
||||
});
|
||||
|
||||
describe('context value structure', () => {
|
||||
it('provides expected context interface', () => {
|
||||
const wrapper = createWrapper('light');
|
||||
const { result } = renderHook(() => useTheme(), { wrapper });
|
||||
|
||||
expect(result.current).toEqual({
|
||||
colorScheme: 'light',
|
||||
updateColorScheme: expect.any(Function) as unknown,
|
||||
});
|
||||
});
|
||||
|
||||
it('context value has correct types', () => {
|
||||
const wrapper = createWrapper('dark');
|
||||
const { result } = renderHook(() => useTheme(), { wrapper });
|
||||
|
||||
expect(typeof result.current.colorScheme).toBe('string');
|
||||
expect(typeof result.current.updateColorScheme).toBe('function');
|
||||
});
|
||||
});
|
||||
|
||||
describe('provider nesting', () => {
|
||||
it('works with nested providers (inner provider takes precedence)', () => {
|
||||
mockUseMantineColorScheme.mockReturnValue({
|
||||
colorScheme: 'dark',
|
||||
setColorScheme: mockSetColorScheme,
|
||||
});
|
||||
|
||||
const NestedWrapper = ({ children }: { children: React.ReactNode }) => (
|
||||
<ThemeProvider>
|
||||
<ThemeProvider>{children}</ThemeProvider>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
const { result } = renderHook(() => useTheme(), {
|
||||
wrapper: NestedWrapper,
|
||||
});
|
||||
|
||||
expect(result.current.colorScheme).toBe('dark');
|
||||
expect(typeof result.current.updateColorScheme).toBe('function');
|
||||
});
|
||||
});
|
||||
|
||||
describe('edge cases', () => {
|
||||
it('handles undefined color scheme gracefully by falling back to light theme', () => {
|
||||
mockUseMantineColorScheme.mockReturnValue({
|
||||
colorScheme: undefined,
|
||||
setColorScheme: mockSetColorScheme,
|
||||
});
|
||||
|
||||
const wrapper = createWrapper();
|
||||
const { result } = renderHook(() => useTheme(), { wrapper });
|
||||
|
||||
// Should fallback to 'light' theme rather than being undefined
|
||||
expect(result.current.colorScheme).toBe('light');
|
||||
expect(typeof result.current.updateColorScheme).toBe('function');
|
||||
});
|
||||
|
||||
it('handles missing setColorScheme function', () => {
|
||||
mockUseMantineColorScheme.mockReturnValue({
|
||||
colorScheme: 'light',
|
||||
setColorScheme: undefined,
|
||||
});
|
||||
|
||||
const wrapper = createWrapper();
|
||||
|
||||
// Should not throw during render
|
||||
expect(() => {
|
||||
renderHook(() => useTheme(), { wrapper });
|
||||
}).not.toThrow();
|
||||
});
|
||||
|
||||
it('handles updateColorScheme with same color scheme', () => {
|
||||
const wrapper = createWrapper('light');
|
||||
const { result } = renderHook(() => useTheme(), { wrapper });
|
||||
|
||||
act(() => {
|
||||
result.current.updateColorScheme('light'); // Same as current
|
||||
});
|
||||
|
||||
expect(mockSetColorScheme).toHaveBeenCalledWith('light');
|
||||
});
|
||||
});
|
||||
|
||||
describe('integration with Mantine', () => {
|
||||
it('properly integrates with useMantineColorScheme', () => {
|
||||
const mockMantineHook = {
|
||||
colorScheme: 'dark' as MantineColorScheme,
|
||||
setColorScheme: mockSetColorScheme,
|
||||
};
|
||||
|
||||
mockUseMantineColorScheme.mockReturnValue(mockMantineHook);
|
||||
|
||||
const wrapper = createWrapper('dark');
|
||||
const { result } = renderHook(() => useTheme(), { wrapper });
|
||||
|
||||
expect(result.current.colorScheme).toBe('dark');
|
||||
|
||||
act(() => {
|
||||
result.current.updateColorScheme('light');
|
||||
});
|
||||
|
||||
expect(mockSetColorScheme).toHaveBeenCalledWith('light');
|
||||
});
|
||||
|
||||
it('reflects all Mantine color scheme options', () => {
|
||||
const colorSchemes: MantineColorScheme[] = ['light', 'dark', 'auto'];
|
||||
|
||||
colorSchemes.forEach((scheme) => {
|
||||
mockUseMantineColorScheme.mockReturnValue({
|
||||
colorScheme: scheme,
|
||||
setColorScheme: mockSetColorScheme,
|
||||
});
|
||||
|
||||
const wrapper = createWrapper(scheme);
|
||||
const { result } = renderHook(() => useTheme(), { wrapper });
|
||||
|
||||
expect(result.current.colorScheme).toBe(scheme);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('performance', () => {
|
||||
it('does not cause unnecessary re-renders', () => {
|
||||
const wrapper = createWrapper('light');
|
||||
const { result, rerender } = renderHook(() => useTheme(), { wrapper });
|
||||
|
||||
const initialResult = result.current;
|
||||
|
||||
// Re-render without changing anything
|
||||
rerender();
|
||||
|
||||
// Function reference should be stable
|
||||
expect(result.current.updateColorScheme).toBe(
|
||||
initialResult.updateColorScheme
|
||||
);
|
||||
});
|
||||
|
||||
it('useCallback optimization works correctly', () => {
|
||||
const wrapper = createWrapper('light');
|
||||
const { result } = renderHook(() => useTheme(), { wrapper });
|
||||
|
||||
const updateFunction1 = result.current.updateColorScheme;
|
||||
|
||||
// Trigger a re-render by calling updateColorScheme
|
||||
act(() => {
|
||||
result.current.updateColorScheme('dark');
|
||||
});
|
||||
|
||||
// Function should still be the same reference due to useCallback
|
||||
expect(result.current.updateColorScheme).toBe(updateFunction1);
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -22,13 +22,16 @@ export const ThemeProvider: React.FC<ThemeProviderProps> = ({ children }) => {
|
||||
|
||||
const updateColorScheme = useCallback(
|
||||
(newTheme: MantineColorScheme): void => {
|
||||
setColorScheme(newTheme);
|
||||
if (setColorScheme) {
|
||||
setColorScheme(newTheme);
|
||||
}
|
||||
},
|
||||
[setColorScheme]
|
||||
);
|
||||
|
||||
// Ensure colorScheme is never undefined by falling back to light theme
|
||||
const value: ThemeContextType = {
|
||||
colorScheme,
|
||||
colorScheme: colorScheme || 'light',
|
||||
updateColorScheme,
|
||||
};
|
||||
|
||||
|
||||
Reference in New Issue
Block a user