diff --git a/package-lock.json b/package-lock.json
index d88b6e3..643d16e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -27,6 +27,9 @@
"devDependencies": {
"@faker-js/faker": "^8.4.1",
"@firebase/rules-unit-testing": "^3.0.2",
+ "@testing-library/jest-dom": "^6.4.2",
+ "@testing-library/react": "^15.0.5",
+ "@testing-library/user-event": "^14.5.2",
"@types/lodash": "^4.17.0",
"@types/react": "^18.2.66",
"@types/react-dom": "^18.2.22",
@@ -38,10 +41,11 @@
"eslint-plugin-react-hooks": "^4.6.0",
"eslint-plugin-react-refresh": "^0.4.6",
"firebase-admin": "^12.1.0",
+ "jsdom": "^24.0.0",
"ts-node": "^10.9.2",
"typescript": "^5.2.2",
"vite": "^5.2.0",
- "vitest": "^1.5.1"
+ "vitest": "^1.5.2"
}
},
"node_modules/@aashutoshrathi/word-wrap": {
@@ -53,6 +57,12 @@
"node": ">=0.10.0"
}
},
+ "node_modules/@adobe/css-tools": {
+ "version": "4.3.3",
+ "resolved": "https://registry.npmjs.org/@adobe/css-tools/-/css-tools-4.3.3.tgz",
+ "integrity": "sha512-rE0Pygv0sEZ4vBWHlAgJLGDU7Pm8xoO6p3wsEceb7GYAjScrOHpEo8KK/eVkAcnSM+slAEtXjA2JpdjLp4fJQQ==",
+ "dev": true
+ },
"node_modules/@ampproject/remapping": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.3.0.tgz",
@@ -2336,6 +2346,158 @@
"@swc/counter": "^0.1.3"
}
},
+ "node_modules/@testing-library/dom": {
+ "version": "10.1.0",
+ "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-10.1.0.tgz",
+ "integrity": "sha512-wdsYKy5zupPyLCW2Je5DLHSxSfbIp6h80WoHOQc+RPtmPGA52O9x5MJEkv92Sjonpq+poOAtUKhh1kBGAXBrNA==",
+ "dev": true,
+ "dependencies": {
+ "@babel/code-frame": "^7.10.4",
+ "@babel/runtime": "^7.12.5",
+ "@types/aria-query": "^5.0.1",
+ "aria-query": "5.3.0",
+ "chalk": "^4.1.0",
+ "dom-accessibility-api": "^0.5.9",
+ "lz-string": "^1.5.0",
+ "pretty-format": "^27.0.2"
+ },
+ "engines": {
+ "node": ">=18"
+ }
+ },
+ "node_modules/@testing-library/dom/node_modules/ansi-styles": {
+ "version": "5.2.0",
+ "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
+ "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
+ "dev": true,
+ "engines": {
+ "node": ">=10"
+ },
+ "funding": {
+ "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+ }
+ },
+ "node_modules/@testing-library/dom/node_modules/dom-accessibility-api": {
+ "version": "0.5.16",
+ "resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.5.16.tgz",
+ "integrity": "sha512-X7BJ2yElsnOJ30pZF4uIIDfBEVgF4XEBxL9Bxhy6dnrm5hkzqmsWHGTiHqRiITNhMyFLyAiWndIJP7Z1NTteDg==",
+ "dev": true
+ },
+ "node_modules/@testing-library/dom/node_modules/pretty-format": {
+ "version": "27.5.1",
+ "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-27.5.1.tgz",
+ "integrity": "sha512-Qb1gy5OrP5+zDf2Bvnzdl3jsTf1qXVMazbvCoKhtKqVs4/YK4ozX4gKQJJVyNe+cajNPn0KoC0MC3FUmaHWEmQ==",
+ "dev": true,
+ "dependencies": {
+ "ansi-regex": "^5.0.1",
+ "ansi-styles": "^5.0.0",
+ "react-is": "^17.0.1"
+ },
+ "engines": {
+ "node": "^10.13.0 || ^12.13.0 || ^14.15.0 || >=15.0.0"
+ }
+ },
+ "node_modules/@testing-library/dom/node_modules/react-is": {
+ "version": "17.0.2",
+ "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
+ "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==",
+ "dev": true
+ },
+ "node_modules/@testing-library/jest-dom": {
+ "version": "6.4.2",
+ "resolved": "https://registry.npmjs.org/@testing-library/jest-dom/-/jest-dom-6.4.2.tgz",
+ "integrity": "sha512-CzqH0AFymEMG48CpzXFriYYkOjk6ZGPCLMhW9e9jg3KMCn5OfJecF8GtGW7yGfR/IgCe3SX8BSwjdzI6BBbZLw==",
+ "dev": true,
+ "dependencies": {
+ "@adobe/css-tools": "^4.3.2",
+ "@babel/runtime": "^7.9.2",
+ "aria-query": "^5.0.0",
+ "chalk": "^3.0.0",
+ "css.escape": "^1.5.1",
+ "dom-accessibility-api": "^0.6.3",
+ "lodash": "^4.17.15",
+ "redent": "^3.0.0"
+ },
+ "engines": {
+ "node": ">=14",
+ "npm": ">=6",
+ "yarn": ">=1"
+ },
+ "peerDependencies": {
+ "@jest/globals": ">= 28",
+ "@types/bun": "latest",
+ "@types/jest": ">= 28",
+ "jest": ">= 28",
+ "vitest": ">= 0.32"
+ },
+ "peerDependenciesMeta": {
+ "@jest/globals": {
+ "optional": true
+ },
+ "@types/bun": {
+ "optional": true
+ },
+ "@types/jest": {
+ "optional": true
+ },
+ "jest": {
+ "optional": true
+ },
+ "vitest": {
+ "optional": true
+ }
+ }
+ },
+ "node_modules/@testing-library/jest-dom/node_modules/chalk": {
+ "version": "3.0.0",
+ "resolved": "https://registry.npmjs.org/chalk/-/chalk-3.0.0.tgz",
+ "integrity": "sha512-4D3B6Wf41KOYRFdszmDqMCGq5VV/uMAB273JILmO+3jAlh8X4qDtdtgCR3fxtbLEMzSx22QdhnDcJvu2u1fVwg==",
+ "dev": true,
+ "dependencies": {
+ "ansi-styles": "^4.1.0",
+ "supports-color": "^7.1.0"
+ },
+ "engines": {
+ "node": ">=8"
+ }
+ },
+ "node_modules/@testing-library/react": {
+ "version": "15.0.6",
+ "resolved": "https://registry.npmjs.org/@testing-library/react/-/react-15.0.6.tgz",
+ "integrity": "sha512-UlbazRtEpQClFOiYp+1BapMT+xyqWMnE+hh9tn5DQ6gmlE7AIZWcGpzZukmDZuFk3By01oiqOf8lRedLS4k6xQ==",
+ "dev": true,
+ "dependencies": {
+ "@babel/runtime": "^7.12.5",
+ "@testing-library/dom": "^10.0.0",
+ "@types/react-dom": "^18.0.0"
+ },
+ "engines": {
+ "node": ">=18"
+ },
+ "peerDependencies": {
+ "@types/react": "^18.0.0",
+ "react": "^18.0.0",
+ "react-dom": "^18.0.0"
+ },
+ "peerDependenciesMeta": {
+ "@types/react": {
+ "optional": true
+ }
+ }
+ },
+ "node_modules/@testing-library/user-event": {
+ "version": "14.5.2",
+ "resolved": "https://registry.npmjs.org/@testing-library/user-event/-/user-event-14.5.2.tgz",
+ "integrity": "sha512-YAh82Wh4TIrxYLmfGcixwD18oIjyC1pFQC2Y01F2lzV2HTMiYrI0nze0FD0ocB//CKS/7jIUgae+adPqxK5yCQ==",
+ "dev": true,
+ "engines": {
+ "node": ">=12",
+ "npm": ">=6"
+ },
+ "peerDependencies": {
+ "@testing-library/dom": ">=7.21.4"
+ }
+ },
"node_modules/@tootallnate/once": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/@tootallnate/once/-/once-2.0.0.tgz",
@@ -2370,6 +2532,12 @@
"integrity": "sha512-vxhUy4J8lyeyinH7Azl1pdd43GJhZH/tP2weN8TntQblOY+A0XbT8DJk1/oCPuOOyg/Ja757rG0CgHcWC8OfMA==",
"dev": true
},
+ "node_modules/@types/aria-query": {
+ "version": "5.0.4",
+ "resolved": "https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.4.tgz",
+ "integrity": "sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw==",
+ "dev": true
+ },
"node_modules/@types/body-parser": {
"version": "1.19.5",
"resolved": "https://registry.npmjs.org/@types/body-parser/-/body-parser-1.19.5.tgz",
@@ -3061,7 +3229,6 @@
"resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.1.tgz",
"integrity": "sha512-H0TSyFNDMomMNJQBn8wFV5YC/2eJ+VXECwOadZJT554xP6cODZHPX3H9QMQECxvrgiSOP1pHjy1sMWQVYJOUOA==",
"dev": true,
- "optional": true,
"dependencies": {
"debug": "^4.3.4"
},
@@ -3131,6 +3298,15 @@
"integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==",
"dev": true
},
+ "node_modules/aria-query": {
+ "version": "5.3.0",
+ "resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.3.0.tgz",
+ "integrity": "sha512-b0P0sZPKtyu8HkeRAfCq0IfURZK+SuwMjY1UXGBU27wpAiTwQAIlq56IbIO+ytk/JjS1fMR14ee5WBBfKi5J6A==",
+ "dev": true,
+ "dependencies": {
+ "dequal": "^2.0.3"
+ }
+ },
"node_modules/array-union": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz",
@@ -3577,6 +3753,24 @@
"node": ">=8.0.0"
}
},
+ "node_modules/css.escape": {
+ "version": "1.5.1",
+ "resolved": "https://registry.npmjs.org/css.escape/-/css.escape-1.5.1.tgz",
+ "integrity": "sha512-YUifsXXuknHlUsmlgyY0PKzgPOr7/FjCePfHNt0jxm83wHZi44VDMQ7/fGNkjY3/jV1MC+1CmZbaHzugyeRtpg==",
+ "dev": true
+ },
+ "node_modules/cssstyle": {
+ "version": "4.0.1",
+ "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-4.0.1.tgz",
+ "integrity": "sha512-8ZYiJ3A/3OkDd093CBT/0UKDWry7ak4BdPTFP2+QEP7cmhouyq/Up709ASSj2cK02BbZiMgk7kYjZNS4QP5qrQ==",
+ "dev": true,
+ "dependencies": {
+ "rrweb-cssom": "^0.6.0"
+ },
+ "engines": {
+ "node": ">=18"
+ }
+ },
"node_modules/csstype": {
"version": "3.1.3",
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
@@ -3692,6 +3886,53 @@
"node": ">=12"
}
},
+ "node_modules/data-urls": {
+ "version": "5.0.0",
+ "resolved": "https://registry.npmjs.org/data-urls/-/data-urls-5.0.0.tgz",
+ "integrity": "sha512-ZYP5VBHshaDAiVZxjbRVcFJpc+4xGgT0bK3vzy1HLN8jTO975HEbuYzZJcHoQEY5K1a0z8YayJkyVETa08eNTg==",
+ "dev": true,
+ "dependencies": {
+ "whatwg-mimetype": "^4.0.0",
+ "whatwg-url": "^14.0.0"
+ },
+ "engines": {
+ "node": ">=18"
+ }
+ },
+ "node_modules/data-urls/node_modules/tr46": {
+ "version": "5.0.0",
+ "resolved": "https://registry.npmjs.org/tr46/-/tr46-5.0.0.tgz",
+ "integrity": "sha512-tk2G5R2KRwBd+ZN0zaEXpmzdKyOYksXwywulIX95MBODjSzMIuQnQ3m8JxgbhnL1LeVo7lqQKsYa1O3Htl7K5g==",
+ "dev": true,
+ "dependencies": {
+ "punycode": "^2.3.1"
+ },
+ "engines": {
+ "node": ">=18"
+ }
+ },
+ "node_modules/data-urls/node_modules/webidl-conversions": {
+ "version": "7.0.0",
+ "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-7.0.0.tgz",
+ "integrity": "sha512-VwddBukDzu71offAQR975unBIGqfKZpM+8ZX6ySk8nYhVoo5CYaZyzt3YBvYtRtO+aoGlqxPg/B87NGVZ/fu6g==",
+ "dev": true,
+ "engines": {
+ "node": ">=12"
+ }
+ },
+ "node_modules/data-urls/node_modules/whatwg-url": {
+ "version": "14.0.0",
+ "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-14.0.0.tgz",
+ "integrity": "sha512-1lfMEm2IEr7RIV+f4lUNPOqfFL+pO+Xw3fJSqmjX9AbXcXcYOkCe1P6+9VBZB6n94af16NfZf+sSk0JCBZC9aw==",
+ "dev": true,
+ "dependencies": {
+ "tr46": "^5.0.0",
+ "webidl-conversions": "^7.0.0"
+ },
+ "engines": {
+ "node": ">=18"
+ }
+ },
"node_modules/debug": {
"version": "4.3.4",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
@@ -3709,6 +3950,12 @@
}
}
},
+ "node_modules/decimal.js": {
+ "version": "10.4.3",
+ "resolved": "https://registry.npmjs.org/decimal.js/-/decimal.js-10.4.3.tgz",
+ "integrity": "sha512-VBBaLc1MgL5XpzgIP7ny5Z6Nx3UrRkIViUkPUdtl9aya5amy3De1gsUUSB1g3+3sExYNjCAsAznmukyxCb1GRA==",
+ "dev": true
+ },
"node_modules/decimal.js-light": {
"version": "2.5.1",
"resolved": "https://registry.npmjs.org/decimal.js-light/-/decimal.js-light-2.5.1.tgz",
@@ -3824,6 +4071,12 @@
"node": ">=6.0.0"
}
},
+ "node_modules/dom-accessibility-api": {
+ "version": "0.6.3",
+ "resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.6.3.tgz",
+ "integrity": "sha512-7ZgogeTnjuHbo+ct10G9Ffp0mif17idi0IyWNVA/wcwcm7NPOD/WEHVP3n7n3MhXqxoIYm8d6MuZohYWIZ4T3w==",
+ "dev": true
+ },
"node_modules/dom-helpers": {
"version": "5.2.1",
"resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.2.1.tgz",
@@ -3882,6 +4135,18 @@
"dev": true,
"optional": true
},
+ "node_modules/entities": {
+ "version": "4.5.0",
+ "resolved": "https://registry.npmjs.org/entities/-/entities-4.5.0.tgz",
+ "integrity": "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==",
+ "dev": true,
+ "engines": {
+ "node": ">=0.12"
+ },
+ "funding": {
+ "url": "https://github.com/fb55/entities?sponsor=1"
+ }
+ },
"node_modules/error-stack-parser": {
"version": "2.1.4",
"resolved": "https://registry.npmjs.org/error-stack-parser/-/error-stack-parser-2.1.4.tgz",
@@ -4746,6 +5011,18 @@
"node": ">=8"
}
},
+ "node_modules/html-encoding-sniffer": {
+ "version": "4.0.0",
+ "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-4.0.0.tgz",
+ "integrity": "sha512-Y22oTqIU4uuPgEemfz7NDJz6OeKf12Lsu+QC+s3BVpda64lTiMYCyGwg5ki4vFxkMwQdeZDl2adZoqUgdFuTgQ==",
+ "dev": true,
+ "dependencies": {
+ "whatwg-encoding": "^3.1.1"
+ },
+ "engines": {
+ "node": ">=18"
+ }
+ },
"node_modules/html-escaper": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/html-escaper/-/html-escaper-2.0.2.tgz",
@@ -4790,7 +5067,6 @@
"resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.4.tgz",
"integrity": "sha512-wlwpilI7YdjSkWaQ/7omYBMTliDcmCN8OLihO6I9B86g06lMyAoqgoDpV0XqoaPOKj+0DIdAvnsWfyAAhmimcg==",
"dev": true,
- "optional": true,
"dependencies": {
"agent-base": "^7.0.2",
"debug": "4"
@@ -4813,6 +5089,18 @@
"resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.0.4.tgz",
"integrity": "sha512-ygGZLjmXfPHj+ZWh6LwbC37l43MhfztxetbFCoYTM2VjkIUpeHgSNn7QIyVFj7YQ1Wl9Cbw5sholVJPzWvC2MQ=="
},
+ "node_modules/iconv-lite": {
+ "version": "0.6.3",
+ "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
+ "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==",
+ "dev": true,
+ "dependencies": {
+ "safer-buffer": ">= 2.1.2 < 3.0.0"
+ },
+ "engines": {
+ "node": ">=0.10.0"
+ }
+ },
"node_modules/idb": {
"version": "7.1.1",
"resolved": "https://registry.npmjs.org/idb/-/idb-7.1.1.tgz",
@@ -4877,6 +5165,15 @@
"node": ">=0.8.19"
}
},
+ "node_modules/indent-string": {
+ "version": "4.0.0",
+ "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-4.0.0.tgz",
+ "integrity": "sha512-EdDDZu4A2OyIK7Lr/2zG+w5jmbuk1DVBnEwREQvBzspBJkCEbRa8GxU1lghYcaGJCnRWibjDXlq779X1/y5xwg==",
+ "dev": true,
+ "engines": {
+ "node": ">=8"
+ }
+ },
"node_modules/inflight": {
"version": "1.0.6",
"resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
@@ -4979,6 +5276,12 @@
"node": ">=8"
}
},
+ "node_modules/is-potential-custom-element-name": {
+ "version": "1.0.1",
+ "resolved": "https://registry.npmjs.org/is-potential-custom-element-name/-/is-potential-custom-element-name-1.0.1.tgz",
+ "integrity": "sha512-bCYeRA2rVibKZd+s2625gGnGF/t7DSqDs4dP7CrLA1m7jKWz6pps0LpYLJN8Q64HtmPKJ1hrN3nzPNKFEKOUiQ==",
+ "dev": true
+ },
"node_modules/is-stream": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/is-stream/-/is-stream-2.0.1.tgz",
@@ -5095,6 +5398,107 @@
"js-yaml": "bin/js-yaml.js"
}
},
+ "node_modules/jsdom": {
+ "version": "24.0.0",
+ "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-24.0.0.tgz",
+ "integrity": "sha512-UDS2NayCvmXSXVP6mpTj+73JnNQadZlr9N68189xib2tx5Mls7swlTNao26IoHv46BZJFvXygyRtyXd1feAk1A==",
+ "dev": true,
+ "dependencies": {
+ "cssstyle": "^4.0.1",
+ "data-urls": "^5.0.0",
+ "decimal.js": "^10.4.3",
+ "form-data": "^4.0.0",
+ "html-encoding-sniffer": "^4.0.0",
+ "http-proxy-agent": "^7.0.0",
+ "https-proxy-agent": "^7.0.2",
+ "is-potential-custom-element-name": "^1.0.1",
+ "nwsapi": "^2.2.7",
+ "parse5": "^7.1.2",
+ "rrweb-cssom": "^0.6.0",
+ "saxes": "^6.0.0",
+ "symbol-tree": "^3.2.4",
+ "tough-cookie": "^4.1.3",
+ "w3c-xmlserializer": "^5.0.0",
+ "webidl-conversions": "^7.0.0",
+ "whatwg-encoding": "^3.1.1",
+ "whatwg-mimetype": "^4.0.0",
+ "whatwg-url": "^14.0.0",
+ "ws": "^8.16.0",
+ "xml-name-validator": "^5.0.0"
+ },
+ "engines": {
+ "node": ">=18"
+ },
+ "peerDependencies": {
+ "canvas": "^2.11.2"
+ },
+ "peerDependenciesMeta": {
+ "canvas": {
+ "optional": true
+ }
+ }
+ },
+ "node_modules/jsdom/node_modules/form-data": {
+ "version": "4.0.0",
+ "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz",
+ "integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==",
+ "dev": true,
+ "dependencies": {
+ "asynckit": "^0.4.0",
+ "combined-stream": "^1.0.8",
+ "mime-types": "^2.1.12"
+ },
+ "engines": {
+ "node": ">= 6"
+ }
+ },
+ "node_modules/jsdom/node_modules/http-proxy-agent": {
+ "version": "7.0.2",
+ "resolved": "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-7.0.2.tgz",
+ "integrity": "sha512-T1gkAiYYDWYx3V5Bmyu7HcfcvL7mUrTWiM6yOfa3PIphViJ/gFPbvidQ+veqSOHci/PxBcDabeUNCzpOODJZig==",
+ "dev": true,
+ "dependencies": {
+ "agent-base": "^7.1.0",
+ "debug": "^4.3.4"
+ },
+ "engines": {
+ "node": ">= 14"
+ }
+ },
+ "node_modules/jsdom/node_modules/tr46": {
+ "version": "5.0.0",
+ "resolved": "https://registry.npmjs.org/tr46/-/tr46-5.0.0.tgz",
+ "integrity": "sha512-tk2G5R2KRwBd+ZN0zaEXpmzdKyOYksXwywulIX95MBODjSzMIuQnQ3m8JxgbhnL1LeVo7lqQKsYa1O3Htl7K5g==",
+ "dev": true,
+ "dependencies": {
+ "punycode": "^2.3.1"
+ },
+ "engines": {
+ "node": ">=18"
+ }
+ },
+ "node_modules/jsdom/node_modules/webidl-conversions": {
+ "version": "7.0.0",
+ "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-7.0.0.tgz",
+ "integrity": "sha512-VwddBukDzu71offAQR975unBIGqfKZpM+8ZX6ySk8nYhVoo5CYaZyzt3YBvYtRtO+aoGlqxPg/B87NGVZ/fu6g==",
+ "dev": true,
+ "engines": {
+ "node": ">=12"
+ }
+ },
+ "node_modules/jsdom/node_modules/whatwg-url": {
+ "version": "14.0.0",
+ "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-14.0.0.tgz",
+ "integrity": "sha512-1lfMEm2IEr7RIV+f4lUNPOqfFL+pO+Xw3fJSqmjX9AbXcXcYOkCe1P6+9VBZB6n94af16NfZf+sSk0JCBZC9aw==",
+ "dev": true,
+ "dependencies": {
+ "tr46": "^5.0.0",
+ "webidl-conversions": "^7.0.0"
+ },
+ "engines": {
+ "node": ">=18"
+ }
+ },
"node_modules/jsesc": {
"version": "2.5.2",
"resolved": "https://registry.npmjs.org/jsesc/-/jsesc-2.5.2.tgz",
@@ -5421,6 +5825,15 @@
"integrity": "sha512-ncTzHV7NvsQZkYe1DW7cbDLm0YpzHmZF5r/iyP3ZnQtMiJ+pjzisCiMNI+Sj+xQF5pXhSHxSB3uDbsBTzY/c2A==",
"dev": true
},
+ "node_modules/lz-string": {
+ "version": "1.5.0",
+ "resolved": "https://registry.npmjs.org/lz-string/-/lz-string-1.5.0.tgz",
+ "integrity": "sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==",
+ "dev": true,
+ "bin": {
+ "lz-string": "bin/bin.js"
+ }
+ },
"node_modules/magic-string": {
"version": "0.30.10",
"resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.10.tgz",
@@ -5553,6 +5966,15 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
+ "node_modules/min-indent": {
+ "version": "1.0.1",
+ "resolved": "https://registry.npmjs.org/min-indent/-/min-indent-1.0.1.tgz",
+ "integrity": "sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==",
+ "dev": true,
+ "engines": {
+ "node": ">=4"
+ }
+ },
"node_modules/minimatch": {
"version": "9.0.4",
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.4.tgz",
@@ -5744,6 +6166,12 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
+ "node_modules/nwsapi": {
+ "version": "2.2.9",
+ "resolved": "https://registry.npmjs.org/nwsapi/-/nwsapi-2.2.9.tgz",
+ "integrity": "sha512-2f3F0SEEer8bBu0dsNCFF50N0cTThV1nWFYcEYFZttdW0lDAoybv9cQoK7X7/68Z89S7FoRrVjP1LPX4XRf9vg==",
+ "dev": true
+ },
"node_modules/object-assign": {
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
@@ -5850,6 +6278,18 @@
"node": ">=6"
}
},
+ "node_modules/parse5": {
+ "version": "7.1.2",
+ "resolved": "https://registry.npmjs.org/parse5/-/parse5-7.1.2.tgz",
+ "integrity": "sha512-Czj1WaSVpaoj0wbhMzLmWD69anp2WH7FXMB9n1Sy8/ZFF9jolSQVMu1Ij5WIyGmcBmhk7EOndpO4mIpihVqAXw==",
+ "dev": true,
+ "dependencies": {
+ "entities": "^4.4.0"
+ },
+ "funding": {
+ "url": "https://github.com/inikulin/parse5?sponsor=1"
+ }
+ },
"node_modules/path-exists": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
@@ -6088,6 +6528,12 @@
"integrity": "sha512-b/YwNhb8lk1Zz2+bXXpS/LK9OisiZZ1SNsSLxN1x2OXVEhW2Ckr/7mWE5vrC1ZTiJlD9g19jWszTmJsB+oEpFQ==",
"dev": true
},
+ "node_modules/psl": {
+ "version": "1.9.0",
+ "resolved": "https://registry.npmjs.org/psl/-/psl-1.9.0.tgz",
+ "integrity": "sha512-E/ZsdU4HLs/68gYzgGTkMicWTLPdAftJLfJFlLUAAKZGkStNU72sZjT66SnMDVOfOWY/YAoiD7Jxa9iHvngcag==",
+ "dev": true
+ },
"node_modules/pump": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/pump/-/pump-3.0.0.tgz",
@@ -6107,6 +6553,12 @@
"node": ">=6"
}
},
+ "node_modules/querystringify": {
+ "version": "2.2.0",
+ "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.2.0.tgz",
+ "integrity": "sha512-FIqgj2EUvTa7R50u0rGsyTftzjYmv/a3hO345bZNrqabNqjtgiDMgmo4mkUjd+nzU5oF3dClKqFIPUKybUyqoQ==",
+ "dev": true
+ },
"node_modules/queue-microtask": {
"version": "1.2.3",
"resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz",
@@ -6376,6 +6828,19 @@
"decimal.js-light": "^2.4.1"
}
},
+ "node_modules/redent": {
+ "version": "3.0.0",
+ "resolved": "https://registry.npmjs.org/redent/-/redent-3.0.0.tgz",
+ "integrity": "sha512-6tDA8g98We0zd0GvVeMT9arEOnTw9qM03L9cJXaCjrip1OO764RDBLBfrB4cwzNGDj5OA5ioymC9GkizgWJDUg==",
+ "dev": true,
+ "dependencies": {
+ "indent-string": "^4.0.0",
+ "strip-indent": "^3.0.0"
+ },
+ "engines": {
+ "node": ">=8"
+ }
+ },
"node_modules/regenerator-runtime": {
"version": "0.14.1",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz",
@@ -6389,6 +6854,12 @@
"node": ">=0.10.0"
}
},
+ "node_modules/requires-port": {
+ "version": "1.0.0",
+ "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
+ "integrity": "sha512-KigOCHcocU3XODJxsu8i/j8T9tzT4adHiecwORRQ0ZZFcp7ahwXuRU1m+yuO90C5ZUyGeGfocHDI14M3L3yDAQ==",
+ "dev": true
+ },
"node_modules/resize-observer-polyfill": {
"version": "1.5.1",
"resolved": "https://registry.npmjs.org/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz",
@@ -6488,6 +6959,12 @@
"fsevents": "~2.3.2"
}
},
+ "node_modules/rrweb-cssom": {
+ "version": "0.6.0",
+ "resolved": "https://registry.npmjs.org/rrweb-cssom/-/rrweb-cssom-0.6.0.tgz",
+ "integrity": "sha512-APM0Gt1KoXBz0iIkkdB/kfvGOwC4UuJFeG/c+yV7wSc7q96cG/kJ0HiYCnzivD9SB53cLV1MlHFNfOuPaadYSw==",
+ "dev": true
+ },
"node_modules/rtl-css-js": {
"version": "1.16.1",
"resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.16.1.tgz",
@@ -6538,6 +7015,12 @@
}
]
},
+ "node_modules/safer-buffer": {
+ "version": "2.1.2",
+ "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
+ "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
+ "dev": true
+ },
"node_modules/sass": {
"version": "1.75.0",
"resolved": "https://registry.npmjs.org/sass/-/sass-1.75.0.tgz",
@@ -6554,6 +7037,18 @@
"node": ">=14.0.0"
}
},
+ "node_modules/saxes": {
+ "version": "6.0.0",
+ "resolved": "https://registry.npmjs.org/saxes/-/saxes-6.0.0.tgz",
+ "integrity": "sha512-xAg7SOnEhrm5zI3puOOKyy1OMcMlIJZYNJY7xLBwSze0UjhPLnWfj2GF2EpT0jmzaJKIWKHLsaSSajf35bcYnA==",
+ "dev": true,
+ "dependencies": {
+ "xmlchars": "^2.2.0"
+ },
+ "engines": {
+ "node": ">=v12.22.7"
+ }
+ },
"node_modules/scheduler": {
"version": "0.23.0",
"resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.0.tgz",
@@ -6827,6 +7322,18 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
+ "node_modules/strip-indent": {
+ "version": "3.0.0",
+ "resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-3.0.0.tgz",
+ "integrity": "sha512-laJTa3Jb+VQpaC6DseHhF7dXVqHTfJPCRDaEbid/drOhgitgYku/letMUqOXFoWV0zIIUbjpdH2t+tYj4bQMRQ==",
+ "dev": true,
+ "dependencies": {
+ "min-indent": "^1.0.0"
+ },
+ "engines": {
+ "node": ">=8"
+ }
+ },
"node_modules/strip-json-comments": {
"version": "3.1.1",
"resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.1.1.tgz",
@@ -6888,6 +7395,12 @@
"node": ">=8"
}
},
+ "node_modules/symbol-tree": {
+ "version": "3.2.4",
+ "resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz",
+ "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==",
+ "dev": true
+ },
"node_modules/tar-fs": {
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-2.1.1.tgz",
@@ -7064,6 +7577,21 @@
"resolved": "https://registry.npmjs.org/toggle-selection/-/toggle-selection-1.0.6.tgz",
"integrity": "sha512-BiZS+C1OS8g/q2RRbJmy59xpyghNBqrr6k5L/uKBGRsTfxmu3ffiRnd8mlGPUVayg8pvfi5urfnu8TU7DVOkLQ=="
},
+ "node_modules/tough-cookie": {
+ "version": "4.1.4",
+ "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-4.1.4.tgz",
+ "integrity": "sha512-Loo5UUvLD9ScZ6jh8beX1T6sO1w2/MpCRpEP7V280GKMVUQ0Jzar2U3UJPsrdbziLEMMhu3Ujnq//rhiFuIeag==",
+ "dev": true,
+ "dependencies": {
+ "psl": "^1.1.33",
+ "punycode": "^2.1.1",
+ "universalify": "^0.2.0",
+ "url-parse": "^1.5.3"
+ },
+ "engines": {
+ "node": ">=6"
+ }
+ },
"node_modules/tr46": {
"version": "0.0.3",
"resolved": "https://registry.npmjs.org/tr46/-/tr46-0.0.3.tgz",
@@ -7229,6 +7757,15 @@
"resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz",
"integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA=="
},
+ "node_modules/universalify": {
+ "version": "0.2.0",
+ "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.2.0.tgz",
+ "integrity": "sha512-CJ1QgKmNg3CwvAv/kOFmtnEN05f0D/cn9QntgNOQlQF9dgvVTHj3t+8JPdjqawCHk7V/KA+fbUqzZ9XWhcqPUg==",
+ "dev": true,
+ "engines": {
+ "node": ">= 4.0.0"
+ }
+ },
"node_modules/update-browserslist-db": {
"version": "1.0.13",
"resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.13.tgz",
@@ -7268,6 +7805,16 @@
"punycode": "^2.1.0"
}
},
+ "node_modules/url-parse": {
+ "version": "1.5.10",
+ "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.5.10.tgz",
+ "integrity": "sha512-WypcfiRhfeUP9vvF0j6rw0J3hrWrw6iZv3+22h6iRMJ/8z1Tj6XfLP4DsUix5MhMPnXpiHDoKyoZ/bdCkwBCiQ==",
+ "dev": true,
+ "dependencies": {
+ "querystringify": "^2.1.1",
+ "requires-port": "^1.0.0"
+ }
+ },
"node_modules/util-deprecate": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
@@ -7456,6 +8003,18 @@
}
}
},
+ "node_modules/w3c-xmlserializer": {
+ "version": "5.0.0",
+ "resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-5.0.0.tgz",
+ "integrity": "sha512-o8qghlI8NZHU1lLPrpi2+Uq7abh4GGPpYANlalzWxyWteJOCsr/P+oPBA49TOLu5FTZO4d3F9MnWJfiMo4BkmA==",
+ "dev": true,
+ "dependencies": {
+ "xml-name-validator": "^5.0.0"
+ },
+ "engines": {
+ "node": ">=18"
+ }
+ },
"node_modules/warning": {
"version": "4.0.3",
"resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz",
@@ -7491,6 +8050,27 @@
"node": ">=0.8.0"
}
},
+ "node_modules/whatwg-encoding": {
+ "version": "3.1.1",
+ "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-3.1.1.tgz",
+ "integrity": "sha512-6qN4hJdMwfYBtE3YBTTHhoeuUrDBPZmbQaxWAqSALV/MeEnR5z1xd8UKud2RAkFoPkmB+hli1TZSnyi84xz1vQ==",
+ "dev": true,
+ "dependencies": {
+ "iconv-lite": "0.6.3"
+ },
+ "engines": {
+ "node": ">=18"
+ }
+ },
+ "node_modules/whatwg-mimetype": {
+ "version": "4.0.0",
+ "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-4.0.0.tgz",
+ "integrity": "sha512-QaKxh0eNIi2mE9p2vEdzfagOKHCcj1pJ56EEHGQOVxp8r9/iszLUUV7v89x9O1p/T+NlTM5W7jW6+cz4Fq1YVg==",
+ "dev": true,
+ "engines": {
+ "node": ">=18"
+ }
+ },
"node_modules/whatwg-url": {
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-5.0.0.tgz",
@@ -7554,6 +8134,42 @@
"integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==",
"dev": true
},
+ "node_modules/ws": {
+ "version": "8.17.0",
+ "resolved": "https://registry.npmjs.org/ws/-/ws-8.17.0.tgz",
+ "integrity": "sha512-uJq6108EgZMAl20KagGkzCKfMEjxmKvZHG7Tlq0Z6nOky7YF7aq4mOx6xK8TJ/i1LeK4Qus7INktacctDgY8Ow==",
+ "dev": true,
+ "engines": {
+ "node": ">=10.0.0"
+ },
+ "peerDependencies": {
+ "bufferutil": "^4.0.1",
+ "utf-8-validate": ">=5.0.2"
+ },
+ "peerDependenciesMeta": {
+ "bufferutil": {
+ "optional": true
+ },
+ "utf-8-validate": {
+ "optional": true
+ }
+ }
+ },
+ "node_modules/xml-name-validator": {
+ "version": "5.0.0",
+ "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-5.0.0.tgz",
+ "integrity": "sha512-EvGK8EJ3DhaHfbRlETOWAS5pO9MZITeauHKJyb8wyajUfQUenkIg2MvLDTZ4T/TgIcm3HU0TFBgWWboAZ30UHg==",
+ "dev": true,
+ "engines": {
+ "node": ">=18"
+ }
+ },
+ "node_modules/xmlchars": {
+ "version": "2.2.0",
+ "resolved": "https://registry.npmjs.org/xmlchars/-/xmlchars-2.2.0.tgz",
+ "integrity": "sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==",
+ "dev": true
+ },
"node_modules/y18n": {
"version": "5.0.8",
"resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
diff --git a/package.json b/package.json
index 28028bc..1de76a6 100644
--- a/package.json
+++ b/package.json
@@ -30,11 +30,13 @@
},
"devDependencies": {
"@faker-js/faker": "^8.4.1",
+ "@testing-library/jest-dom": "^6.4.2",
+ "@testing-library/react": "^15.0.5",
+ "@testing-library/user-event": "^14.5.2",
"@types/lodash": "^4.17.0",
"@types/react": "^18.2.66",
"@types/react-dom": "^18.2.22",
"@typescript-eslint/eslint-plugin": "^7.2.0",
- "@firebase/rules-unit-testing": "^3.0.2",
"@typescript-eslint/parser": "^7.2.0",
"@vitejs/plugin-react-swc": "^3.5.0",
"@vitest/coverage-istanbul": "^1.5.1",
@@ -42,9 +44,10 @@
"eslint-plugin-react-hooks": "^4.6.0",
"eslint-plugin-react-refresh": "^0.4.6",
"firebase-admin": "^12.1.0",
+ "jsdom": "^24.0.0",
"ts-node": "^10.9.2",
"typescript": "^5.2.2",
"vite": "^5.2.0",
- "vitest": "^1.5.1"
+ "vitest": "^1.5.2"
}
}
diff --git a/src/components/transactions/CSVUpload.test.tsx b/src/components/transactions/CSVUpload.test.tsx
new file mode 100644
index 0000000..590499b
--- /dev/null
+++ b/src/components/transactions/CSVUpload.test.tsx
@@ -0,0 +1,127 @@
+import { beforeEach, describe, expect, test as defaultTest, vi } from 'vitest';
+import { CSVUpload } from './CSVUpload';
+import { useState } from 'react';
+import { Button } from 'react-bootstrap';
+import { render, screen } from '@testing-library/react';
+import { userEvent } from '@testing-library/user-event';
+import "@testing-library/jest-dom";
+
+function TestCSVUpload() {
+ const [show, setShow] = useState(false);
+
+ return <>
+
+ setShow(false)} />
+
+}
+
+const test = defaultTest.extend({ user: userEvent.setup() })
+
+// mock the "writeNewTransactionsBatched" function to cirumvent firebase auth and rules
+// its already been unit tested so we know it works
+vi.mock("../../utils/transaction", async (importOriginal) => {
+ const mod: {} = await importOriginal();
+ return {
+ ...mod,
+ writeNewTransactionsBatched: vi.fn(),
+ }
+})
+
+// mock auth.currentUser to simulate a user being signed into website
+vi.mock("../../utils/firebase", async (importOriginal) => {
+ const mod: {} = await importOriginal();
+ return {
+ ...mod,
+ auth: { currentUser: { uid: "100" } }
+ }
+})
+
+describe("CSVUpload Tests", () => {
+ beforeEach(() => {
+ render()
+ });
+
+ test("modal opens", async ({ user }) => {
+ expect(screen.queryByText("Upload CSV Transactions")).toBeNull();
+
+ await user.click(screen.getByText("Open"));
+
+ expect(screen.getByText("Upload CSV Transactions")).toBeInTheDocument();
+ })
+
+ test("modal closes with close button", async ({ user }) => {
+ await user.click(screen.getByText("Open"));
+
+ await user.click(screen.getByText("Close"));
+
+ expect(screen.getByText("Open")).toBeVisible()
+ })
+
+ test("stops no uploaded CSV", async ({ user }) => {
+ await user.click(screen.getByText("Open"));
+
+ await user.click(screen.getByText("Upload CSV"));
+
+ expect(screen.getByText("You haven't uploaded a CSV file")).toBeVisible()
+ })
+
+ test("non-CSV results in zero uploaded transactions", async ({ user }) => {
+ await user.click(screen.getByText("Open"));
+
+ const txt = new File(["testing"], "text.txt", { type: "text/plaintext", lastModified: Date.now() })
+
+ await user.upload(screen.getByTestId("csvUpload"), txt)
+
+ await user.click(screen.getByText("Upload CSV"));
+
+ expect(screen.getByText("You haven't uploaded a CSV file")).toBeVisible()
+ })
+
+ test("empty CSV results in zero uploaded transactions", async ({ user }) => {
+ await user.click(screen.getByText("Open"));
+
+ const csv = new File([""], "emptyCSV.csv", { type: "text/csv", lastModified: Date.now() })
+
+ await user.upload(screen.getByTestId("csvUpload"), csv)
+
+ await user.click(screen.getByText("Upload CSV"));
+
+ expect(screen.getByText("Uploaded CSV is empty")).toBeVisible()
+ })
+
+ test("non-Monzo CSV results in zero uploaded transactions", async ({ user }) => {
+ await user.click(screen.getByText("Open"));
+
+ const csv = new File(
+ ["testing1, 123, testing2, testing,, testing3, 5-5, testing!"],
+ "invalidCSV.csv",
+ { type: "text/csv", lastModified: Date.now() }
+ )
+
+ await user.upload(screen.getByTestId("csvUpload"), csv)
+
+ await user.click(screen.getByText("Upload CSV"));
+
+ expect(screen.getByText("The uploaded CSV file has no valid transactions")).toBeVisible()
+ })
+
+ test("Monzo CSV file uploads transactions", async ({ user }) => {
+ await user.click(screen.getByText("Open"));
+
+ const csv = new File(
+ [
+ "Transaction ID,Date,Time,Type,Name,Emoji,Category,Amount,Currency,Local amount,Local currency,Notes and #tags,Address,Receipt,Description,Category split,Money Out,Money In\n",
+ "tx_0000AbA3Oasz9hIuCRy3RT,26/10/2023,11:55:41,Card payment,Boots,💊,Personal care,-21.97,GBP,-21.97,GBP,,1 Newark Street,,BOOTS 2011 BATH GBR,,-21.97,\n",
+ "tx_0000Ab8DxJ14CFwgh9JVh4,25/10/2023,14:44:35,Card payment,Aesop Bath,💄,Shopping,-25.00,GBP,-25.00,GBP,,16 New Bond Street,,Aesop Bath Bath GBR,,-25.00,\n"
+ ],
+ "validCSV.csv",
+ { type: "text/csv", lastModified: Date.now() }
+ )
+
+ await user.upload(screen.getByTestId("csvUpload"), csv)
+
+ await user.click(screen.getByText("Upload CSV"));
+
+ expect(screen.getByText("2 transactions have been imported")).toBeVisible()
+ })
+})
\ No newline at end of file
diff --git a/src/components/transactions/CSVUpload.tsx b/src/components/transactions/CSVUpload.tsx
index d8f3063..e2f7b85 100644
--- a/src/components/transactions/CSVUpload.tsx
+++ b/src/components/transactions/CSVUpload.tsx
@@ -26,12 +26,12 @@ export function CSVUpload({ show, closeModal }: { show: boolean, closeModal: (ad
const file = fileElement.files![0];
if (!file) return setError("You haven't uploaded a CSV file");
-
+
reader.onload = async (event) => {
if (!auth.currentUser) return setError("You are not signed in");
const csvContent = event.target?.result;
- if (!csvContent || csvContent instanceof ArrayBuffer) return setError("Unable to read uploaded CSV file");
+ if (!csvContent || csvContent instanceof ArrayBuffer) return setError("Uploaded CSV is empty");
const transactionDocuments = csvContent
.split("\n")
@@ -62,7 +62,7 @@ export function CSVUpload({ show, closeModal }: { show: boolean, closeModal: (ad
{successMsg && {successMsg}}
diff --git a/src/components/transactions/InputTransaction.test.tsx b/src/components/transactions/InputTransaction.test.tsx
new file mode 100644
index 0000000..74c21be
--- /dev/null
+++ b/src/components/transactions/InputTransaction.test.tsx
@@ -0,0 +1,102 @@
+import { beforeEach, describe, expect, vi, test as defaultTest } from 'vitest';
+import { InputTransaction } from './InputTransaction';
+import { useState } from 'react';
+import { Button } from 'react-bootstrap';
+import { render, screen } from '@testing-library/react';
+import { writeNewTransaction } from '../../utils/transaction';
+import { userEvent } from "@testing-library/user-event"
+import "@testing-library/jest-dom";
+
+function TestInputTransaction() {
+ const [show, setShow] = useState(false);
+
+ return <>
+
+ setShow(false)} />
+
+}
+
+const test = defaultTest.extend({ user: userEvent.setup() })
+
+// mock the "writeNewTransaction" function to cirumvent firebase auth and rules
+// its already been unit tested so we know it works
+vi.mock("../../utils/transaction", async (importOriginal) => {
+ const mod: {} = await importOriginal();
+ return {
+ ...mod,
+ writeNewTransaction: vi.fn(),
+ }
+})
+
+// mock auth.currentUser to simulate a user being signed into website
+vi.mock("../../utils/firebase", async (importOriginal) => {
+ const mod: {} = await importOriginal();
+ return {
+ ...mod,
+ auth: { currentUser: { uid: "100" } }
+ }
+})
+
+describe("InputTransaction Tests", () => {
+ beforeEach(() => {
+ render()
+ })
+
+ test("modal opens", async ({ user }) => {
+ expect(screen.queryByText("Add Transaction")).toBeNull();
+
+ await user.click(screen.getByText("Open"));
+
+ // there are two elements with the text "Add Transaction" in this modal: the modal title and the submit button
+ expect(screen.getAllByText("Add Transaction")).toHaveLength(2)
+ })
+
+ test("modal closes with close button", async ({ user }) => {
+ await user.click(screen.getByText("Open"));
+
+ await user.click(screen.getByText("Close"));
+
+ expect(screen.getByText("Open")).toBeVisible()
+ })
+
+ test("empty required textboxes results in zero uploaded transactions", async ({ user }) => {
+ await user.click(screen.getByText("Open"));
+
+ await user.click(screen.getAllByRole("button").find((element) => element.textContent === "Add Transaction")!);
+
+ expect(screen.getByText("The inputted amount is invalid")).toBeVisible()
+ })
+
+ test("allow optional textboxes to be empty", async ({ user }) => {
+ await user.click(screen.getByText("Open"));
+
+ await user.type(screen.getByPlaceholderText("Enter name"), "Sainsburys");
+ await user.type(screen.getByPlaceholderText("Enter amount (use '-' for expenses, do not include currency)"), "-100");
+ // use default category -- income
+
+ await user.click(screen.getAllByRole("button").find((element) => element.textContent === "Add Transaction")!)
+
+ expect(await screen.findByText("Transaction has been successfully added")).toBeVisible()
+ expect(writeNewTransaction).toHaveBeenCalled();
+ })
+
+ test("transaction uploaded when all textboxes are valid", async ({ user }) => {
+ await user.click(screen.getByText("Open"));
+
+ await user.type(screen.getByPlaceholderText("Enter name"), "Sainsburys");
+ await user.type(screen.getByPlaceholderText("Enter amount (use '-' for expenses, do not include currency)"), "-100");
+ // use default category -- income
+ await user.type(screen.getByPlaceholderText("Enter date (DD/MM/YYYY) (optional)"), "12/12/2001");
+ await user.type(screen.getByPlaceholderText("Enter time (HH:MM:SS) (optional)"), "00:00:00");
+ await user.type(screen.getByPlaceholderText("Enter Description (optional)"), "testing description");
+ await user.type(screen.getByPlaceholderText("Enter Notes (optional)"), "testing notes");
+ await user.type(screen.getByPlaceholderText("Enter Address (optional)"), "testing address");
+
+ await user.click(screen.getAllByRole("button").find((element) => element.textContent === "Add Transaction")!)
+
+ expect(await screen.findByText("Transaction has been successfully added")).toBeVisible()
+ expect(writeNewTransaction).toHaveBeenCalled();
+ })
+})
+
+
diff --git a/src/components/transactions/InputTransaction.tsx b/src/components/transactions/InputTransaction.tsx
index a11455e..67532a6 100644
--- a/src/components/transactions/InputTransaction.tsx
+++ b/src/components/transactions/InputTransaction.tsx
@@ -32,7 +32,7 @@ export function InputTransaction({ show, closeModal }: { show: boolean, closeMod
if (date.trim() !== "" && curTime.trim() === "") curTime = "00:00:00"
else if (curTime.trim() === "") curTime = formatTime(new Date())
- const transaction = new Transaction()
+ const transaction = new Transaction()
.setDate(date.trim() === "" ? formatDate(new Date()) : date)
.setTime(curTime)
.setName(name)
diff --git a/src/components/transactions/Tranasction.test.ts b/src/components/transactions/Tranasction.test.ts
index 72f14cd..174a725 100644
--- a/src/components/transactions/Tranasction.test.ts
+++ b/src/components/transactions/Tranasction.test.ts
@@ -1,10 +1,93 @@
-import {describe, expect, test} from "vitest";
-import {emojis} from "./Transaction.ts";
-import {TransactionCategories} from "../../utils/transaction.ts";
+import { describe, expect, test } from "vitest";
+import { Transaction, emojis } from "./Transaction.ts";
+import { TransactionCategories } from "../../utils/transaction.ts";
import _ from "lodash";
describe("Input Transaction Test", () => {
test("Category Integrity Test", () => {
expect(_.isEqual(new Set(Object.keys(emojis)), TransactionCategories), "Emoji keys do not match transaction categories").toBeTruthy();
});
-});
\ No newline at end of file
+});
+
+const validationTest = test.extend({ transaction: new Transaction() })
+
+function doesValidate(transaction: Transaction, field: string) {
+ expect(!transaction.isValid && transaction.invalidField == field).toBeTruthy()
+}
+
+describe("Transaction Validator Tests", () => {
+ validationTest("stops undefined date", ({ transaction }) => {
+ transaction.setDate();
+ doesValidate(transaction, "date");
+ })
+
+ validationTest("stops empty string as date", ({ transaction }) => {
+ transaction.setDate("");
+ doesValidate(transaction, "date");
+ })
+
+ validationTest("stops 00/00/00 as date", ({ transaction }) => {
+ transaction.setDate("00/00/00");
+ doesValidate(transaction, "date");
+ })
+
+ validationTest("stops 32/21/00 as date", ({ transaction }) => {
+ transaction.setDate("32/21/00");
+ doesValidate(transaction, "date");
+ })
+
+ validationTest("stops / as date", ({ transaction }) => {
+ transaction.setDate("/");
+ doesValidate(transaction, "date");
+ })
+
+ validationTest("stops undefined time", ({ transaction }) => {
+ transaction.setTime();
+ doesValidate(transaction, "time");
+ })
+
+ validationTest("stops empty string as time", ({ transaction }) => {
+ transaction.setTime("");
+ doesValidate(transaction, "time");
+ })
+
+ validationTest("stops 25:61:61 as time", ({ transaction }) => {
+ transaction.setTime("25:61:61");
+ doesValidate(transaction, "time");
+ })
+
+ validationTest("stops : as time", ({ transaction }) => {
+ transaction.setTime(":");
+ doesValidate(transaction, "time");
+ })
+
+ validationTest("stops undefined names", ({ transaction }) => {
+ transaction.setName();
+ doesValidate(transaction, "name");
+ })
+
+ validationTest("stops unknown categories", ({ transaction }) => {
+ transaction.setCategory("testing");
+ doesValidate(transaction, "category");
+ })
+
+ validationTest("stops undefined category", ({ transaction }) => {
+ transaction.setCategory();
+ doesValidate(transaction, "category");
+ })
+
+ validationTest("stops non-number amounts", ({ transaction }) => {
+ transaction.setAmount("testing");
+ doesValidate(transaction, "amount");
+ })
+
+ validationTest("stops undefined amount", ({ transaction }) => {
+ transaction.setAmount();
+ doesValidate(transaction, "amount");
+ })
+
+ validationTest("stops undefined currencies", ({ transaction }) => {
+ transaction.setCurrency();
+ doesValidate(transaction, "currency");
+ })
+})
diff --git a/src/components/transactions/Transaction.ts b/src/components/transactions/Transaction.ts
index f5a5b1a..e364fe5 100644
--- a/src/components/transactions/Transaction.ts
+++ b/src/components/transactions/Transaction.ts
@@ -124,7 +124,7 @@ export class Transaction {
setCurrency(currency?: string) {
if (!this.isNotEmpty(currency)) {
this.isValid = false;
- this.invalidField = "name";
+ this.invalidField = "currency";
} else {
this.currency = currency;
}
diff --git a/vitest.config.ts b/vitest.config.ts
index 7018bdc..c501803 100644
--- a/vitest.config.ts
+++ b/vitest.config.ts
@@ -1,9 +1,13 @@
import { defineConfig } from 'vitest/config'
+import react from '@vitejs/plugin-react-swc'
export default defineConfig({
+ plugins: [react()],
test: {
+ globals: true,
+ environment: 'jsdom',
coverage: {
provider: 'istanbul' // or 'v8'
},
- },
+ }
})
\ No newline at end of file