From 161f22ceb5439c9c23936495d04b97904b690580 Mon Sep 17 00:00:00 2001 From: Ahmed Alatawi Date: Sat, 9 Nov 2024 03:13:51 -0500 Subject: [PATCH] Added dependencies for handling styles and svg files in test --- jest.config.js | 11 +- package.json | 5 +- src/App.test.tsx | 3 +- src/pages/calendar/Calendar.test.tsx | 3 +- src/pages/events/AddEvent/AddEvent.test.tsx | 7 +- tsconfig.json | 3 +- vite.config.mts | 2 + yarn.lock | 115 ++++++++++++++++---- 8 files changed, 115 insertions(+), 34 deletions(-) diff --git a/jest.config.js b/jest.config.js index 37dcb9f..6150bee 100644 --- a/jest.config.js +++ b/jest.config.js @@ -1,7 +1,16 @@ -export default { +//@ts-expect-error fix this later +const config = { testEnvironment: 'jsdom', transform: { '^.+\\.tsx?$': 'ts-jest', }, + + moduleNameMapper: { + '\\.(css|less|sass|scss)$': 'identity-obj-proxy', + '^.+\\.svg$': 'jest-transformer-svg', + }, + setupFilesAfterEnv: ['/jest.setup.ts'], } + +export default config diff --git a/package.json b/package.json index 0a56c03..81e17de 100644 --- a/package.json +++ b/package.json @@ -66,6 +66,7 @@ "@graphql-codegen/typescript-operations": "^4.3.1", "@graphql-codegen/typescript-react-apollo": "^4.3.2", "@graphql-codegen/typescript-resolvers": "^4.4.0", + "@testing-library/dom": "^10.4.0", "@testing-library/jest-dom": "^6.6.3", "@testing-library/react": "^16.0.1", "@testing-library/user-event": "^14.5.2", @@ -98,21 +99,23 @@ "eslint-plugin-react": "^7.37.2", "globals": "^15.11.0", "husky": "^8.0.0", + "identity-obj-proxy": "^3.0.0", "jest": "^29.7.0", "jest-environment-jsdom": "^29.7.0", + "jest-transformer-svg": "^2.0.2", "jquery": "^3.6.4", "lint-staged": "^13.2.2", "npm-run-all": "^4.1.5", "prettier": "^3.3.3", "pretty-quick": "^4.0.0", "react-error-overlay": "6.0.11", - "react-test-renderer": "^18.2.0", "ts-jest": "^29.2.5", "ts-node-dev": "^2.0.0", "typescript": "^5.6.3", "typescript-eslint": "^8.12.2", "vite": "^5.4.10", "vite-plugin-checker": "^0.8.0", + "vite-tsconfig-paths": "^5.1.1", "wait-on": "^7.0.1" }, "browserslist": { diff --git a/src/App.test.tsx b/src/App.test.tsx index 3c2011d..9283d75 100644 --- a/src/App.test.tsx +++ b/src/App.test.tsx @@ -1,9 +1,8 @@ -import React from 'react' // import { render, screen } from '@testing-library/react' // import App from './App' xtest('renders learn react link', () => { - console.log(React) + console.log() // render() // const linkElement = screen.getByText(/learn react/i) // expect(linkElement).toBeInTheDocument() diff --git a/src/pages/calendar/Calendar.test.tsx b/src/pages/calendar/Calendar.test.tsx index ba0247f..ca6fd54 100644 --- a/src/pages/calendar/Calendar.test.tsx +++ b/src/pages/calendar/Calendar.test.tsx @@ -1,7 +1,6 @@ // import { MockedProvider } from '@apollo/client/testing'; // ignore test for now -import React from 'react' describe('Calendar', () => { - xit('should do something...', () => console.log(React)) + xit('should do something...', () => console.log()) }) diff --git a/src/pages/events/AddEvent/AddEvent.test.tsx b/src/pages/events/AddEvent/AddEvent.test.tsx index f0ac6f8..d25e6fd 100644 --- a/src/pages/events/AddEvent/AddEvent.test.tsx +++ b/src/pages/events/AddEvent/AddEvent.test.tsx @@ -1,5 +1,4 @@ -import TestRenderer, { act } from 'react-test-renderer' -import { screen } from '@testing-library/dom' +import { act, render, screen } from '@testing-library/react' import { MockedProvider, type MockedResponse } from '@apollo/client/testing' import AddEvent from './AddEvent' import { SaveEventDocument } from '@/generated/graphql' @@ -45,7 +44,7 @@ const mocks: ReadonlyArray = [ describe('AddEvent', () => { it('should set state to loading when mutation is executed', () => { - const component = TestRenderer.create( + render( , @@ -53,7 +52,7 @@ describe('AddEvent', () => { const e = { preventDefault: jest.fn() } - const saveButton = component.root.findByType('form') + const saveButton = screen.findByRole('form') act(() => { saveButton.props.onSubmit(e) }) diff --git a/tsconfig.json b/tsconfig.json index 36d7524..fb0c140 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -20,12 +20,13 @@ "noUnusedParameters": true, "noFallthroughCasesInSwitch": true, "verbatimModuleSyntax": true, + "esModuleInterop": true, "baseUrl": ".", "paths": { "@/*": ["./src/*"] } }, - "include": ["src", "api/**/*"], + "include": ["src", "api/**/*", "./jest.setup.ts"], "references": [{ "path": "./tsconfig.node.json" }] } diff --git a/vite.config.mts b/vite.config.mts index dc1aec5..585cfec 100755 --- a/vite.config.mts +++ b/vite.config.mts @@ -2,6 +2,7 @@ import { defineConfig } from 'vite' import react from '@vitejs/plugin-react' import checker from 'vite-plugin-checker' import path from 'path' +import tsconfigPaths from 'vite-tsconfig-paths' // import dns from 'dns' // dns.setDefaultResultOrder('verbatim') @@ -10,6 +11,7 @@ import path from 'path' export default defineConfig({ plugins: [ react(), + tsconfigPaths(), checker({ typescript: true, }), diff --git a/yarn.lock b/yarn.lock index c9bc0a2..d497ca8 100644 --- a/yarn.lock +++ b/yarn.lock @@ -210,7 +210,7 @@ dependencies: node-fetch "^2.6.1" -"@babel/code-frame@^7.0.0", "@babel/code-frame@^7.12.13", "@babel/code-frame@^7.25.9", "@babel/code-frame@^7.26.0": +"@babel/code-frame@^7.0.0", "@babel/code-frame@^7.10.4", "@babel/code-frame@^7.12.13", "@babel/code-frame@^7.25.9", "@babel/code-frame@^7.26.0": version "7.26.2" resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.26.2.tgz#4b5fab97d33338eff916235055f0ebc21e573a85" integrity sha512-RJlIHRueQgwWitWgF8OdFYGZX328Ax5BCemNGlqHfplnRT9ESi8JkFlvaVYbS+UubVY6dpv87Fs2u5M29iNFVQ== @@ -2107,6 +2107,20 @@ dependencies: tslib "^2.4.0" +"@testing-library/dom@^10.4.0": + version "10.4.0" + resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-10.4.0.tgz#82a9d9462f11d240ecadbf406607c6ceeeff43a8" + integrity sha512-pemlzrSESWbdAloYml3bAJMEfNh1Z7EduzqPKprCH5S341frlpYnUEW0H72dLxa6IsYr+mPno20GiSm+h9dEdQ== + 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" + "@testing-library/jest-dom@^6.6.3": version "6.6.3" resolved "https://registry.yarnpkg.com/@testing-library/jest-dom/-/jest-dom-6.6.3.tgz#26ba906cf928c0f8172e182c6fe214eb4f9f2bd2" @@ -2157,6 +2171,11 @@ resolved "https://registry.yarnpkg.com/@tsconfig/node16/-/node16-1.0.4.tgz#0b92dcc0cc1c81f6f306a381f28e31b1a56536e9" integrity sha512-vxhUy4J8lyeyinH7Azl1pdd43GJhZH/tP2weN8TntQblOY+A0XbT8DJk1/oCPuOOyg/Ja757rG0CgHcWC8OfMA== +"@types/aria-query@^5.0.1": + version "5.0.4" + resolved "https://registry.yarnpkg.com/@types/aria-query/-/aria-query-5.0.4.tgz#1a31c3d378850d2778dabb6374d036dcba4ba708" + integrity sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw== + "@types/babel__core@^7.1.14", "@types/babel__core@^7.20.5": version "7.20.5" resolved "https://registry.yarnpkg.com/@types/babel__core/-/babel__core-7.20.5.tgz#3df15f27ba85319caa07ba08d0721889bb39c017" @@ -2855,6 +2874,13 @@ argparse@^2.0.1: resolved "https://registry.yarnpkg.com/argparse/-/argparse-2.0.1.tgz#246f50f3ca78a3240f6c997e8a9bd1eac49e4b38" integrity sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q== +aria-query@5.3.0: + version "5.3.0" + resolved "https://registry.yarnpkg.com/aria-query/-/aria-query-5.3.0.tgz#650c569e41ad90b51b3d7df5e5eed1c7549c103e" + integrity sha512-b0P0sZPKtyu8HkeRAfCq0IfURZK+SuwMjY1UXGBU27wpAiTwQAIlq56IbIO+ytk/JjS1fMR14ee5WBBfKi5J6A== + dependencies: + dequal "^2.0.3" + aria-query@^5.0.0: version "5.3.2" resolved "https://registry.yarnpkg.com/aria-query/-/aria-query-5.3.2.tgz#93f81a43480e33a338f19163a3d10a50c01dcd59" @@ -3932,6 +3958,11 @@ doctrine@^2.1.0: dependencies: esutils "^2.0.2" +dom-accessibility-api@^0.5.9: + version "0.5.16" + resolved "https://registry.yarnpkg.com/dom-accessibility-api/-/dom-accessibility-api-0.5.16.tgz#5a7429e6066eb3664d911e33fb0e45de8eb08453" + integrity sha512-X7BJ2yElsnOJ30pZF4uIIDfBEVgF4XEBxL9Bxhy6dnrm5hkzqmsWHGTiHqRiITNhMyFLyAiWndIJP7Z1NTteDg== + dom-accessibility-api@^0.6.3: version "0.6.3" resolved "https://registry.yarnpkg.com/dom-accessibility-api/-/dom-accessibility-api-0.6.3.tgz#993e925cc1d73f2c662e7d75dd5a5445259a8fd8" @@ -4781,6 +4812,11 @@ globby@^11.0.3: merge2 "^1.4.1" slash "^3.0.0" +globrex@^0.1.2: + version "0.1.2" + resolved "https://registry.yarnpkg.com/globrex/-/globrex-0.1.2.tgz#dd5d9ec826232730cd6793a5e33a9302985e6098" + integrity sha512-uHJgbwAMwNFf5mLst7IWLNg14x1CkeqglJb/K3doi4dw6q2IvAAmM/Y81kevy83wP+Sst+nutFTYOGg3d1lsxg== + goober@^2.1.10: version "2.1.16" resolved "https://registry.yarnpkg.com/goober/-/goober-2.1.16.tgz#7d548eb9b83ff0988d102be71f271ca8f9c82a95" @@ -4845,6 +4881,11 @@ graphql@*, graphql@^16.9.0: resolved "https://registry.yarnpkg.com/graphql/-/graphql-16.9.0.tgz#1c310e63f16a49ce1fbb230bd0a000e99f6f115f" integrity sha512-GGTKBX4SD7Wdb8mqeDLni2oaRGYQWjWHGKPQ24ZMnUtKfcsVoiv4uX8+LJr1K6U5VW2Lu1BwJnj7uiori0YtRw== +harmony-reflect@^1.4.6: + version "1.6.2" + resolved "https://registry.yarnpkg.com/harmony-reflect/-/harmony-reflect-1.6.2.tgz#31ecbd32e648a34d030d86adb67d4d47547fe710" + integrity sha512-HIp/n38R9kQjDEziXyDTuW3vvoxxyxjxFzXLrBr18uB47GnSt+G9D29fqrpM5ZkspMcPICud3XsBJQ4Y2URg8g== + has-bigints@^1.0.1, has-bigints@^1.0.2: version "1.0.2" resolved "https://registry.yarnpkg.com/has-bigints/-/has-bigints-1.0.2.tgz#0871bd3e3d51626f6ca0966668ba35d5602d6eaa" @@ -4996,6 +5037,13 @@ iconv-lite@0.6.3: dependencies: safer-buffer ">= 2.1.2 < 3.0.0" +identity-obj-proxy@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/identity-obj-proxy/-/identity-obj-proxy-3.0.0.tgz#94d2bda96084453ef36fbc5aaec37e0f79f1fc14" + integrity sha512-00n6YnVHKrinT9t0d9+5yZC6UBNJANpYEQvL2LlX6Ab9lnmxzIRcEmTPuyGScvl1+jKuCICX1Z0Ab1pPKKdikA== + dependencies: + harmony-reflect "^1.4.6" + ieee754@^1.1.13: version "1.2.1" resolved "https://registry.yarnpkg.com/ieee754/-/ieee754-1.2.1.tgz#8eb7a10a63fff25d15a57b001586d177d1b0d352" @@ -5758,6 +5806,11 @@ jest-snapshot@^29.7.0: pretty-format "^29.7.0" semver "^7.5.3" +jest-transformer-svg@^2.0.2: + version "2.0.2" + resolved "https://registry.yarnpkg.com/jest-transformer-svg/-/jest-transformer-svg-2.0.2.tgz#8801d4ca0eccfdc3f846cb21016e4093a456efed" + integrity sha512-+0PSqNw1Cu6vw05UrWe12u2eg2B1LqxrZDWp3oWJZFNSff9QzXoqc1ocpQ9sZ+YVQ9sNiaUDBI6zUpvDH/YpLA== + jest-util@^29.0.0, jest-util@^29.7.0: version "29.7.0" resolved "https://registry.yarnpkg.com/jest-util/-/jest-util-29.7.0.tgz#23c2b62bfb22be82b44de98055802ff3710fc0bc" @@ -6244,6 +6297,11 @@ luxon@^3.3.0: resolved "https://registry.yarnpkg.com/luxon/-/luxon-3.5.0.tgz#6b6f65c5cd1d61d1fd19dbf07ee87a50bf4b8e20" integrity sha512-rh+Zjr6DNfUYR3bPwJEnuwDdqMbxZW7LOQfUN4B54+Cl+0o5zaU9RJ6bcidfDtC1cWCZXQ+nvX8bf6bAji37QQ== +lz-string@^1.5.0: + version "1.5.0" + resolved "https://registry.yarnpkg.com/lz-string/-/lz-string-1.5.0.tgz#c1ab50f77887b712621201ba9fd4e3a6ed099941" + integrity sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ== + make-dir@^4.0.0: version "4.0.0" resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-4.0.0.tgz#c3c2307a771277cd9638305f915c29ae741b614e" @@ -6969,6 +7027,15 @@ prettier@^3.3.3: resolved "https://registry.yarnpkg.com/prettier/-/prettier-3.3.3.tgz#30c54fe0be0d8d12e6ae61dbb10109ea00d53105" integrity sha512-i2tDNA0O5IrMO757lfrdQZCc2jPNDVntV0m/+4whiDfWaTKfMNgR7Qz0NAeGz/nRqF4m5/6CLzbP4/liHt12Ew== +pretty-format@^27.0.2: + version "27.5.1" + resolved "https://registry.yarnpkg.com/pretty-format/-/pretty-format-27.5.1.tgz#2181879fdea51a7a5851fb39d920faa63f01d88e" + integrity sha512-Qb1gy5OrP5+zDf2Bvnzdl3jsTf1qXVMazbvCoKhtKqVs4/YK4ozX4gKQJJVyNe+cajNPn0KoC0MC3FUmaHWEmQ== + dependencies: + ansi-regex "^5.0.1" + ansi-styles "^5.0.0" + react-is "^17.0.1" + pretty-format@^29.0.0, pretty-format@^29.7.0: version "29.7.0" resolved "https://registry.yarnpkg.com/pretty-format/-/pretty-format-29.7.0.tgz#ca42c758310f365bfa71a0bda0a807160b776812" @@ -7141,16 +7208,21 @@ react-idle-timer@^5.5.2: resolved "https://registry.yarnpkg.com/react-idle-timer/-/react-idle-timer-5.7.2.tgz#f506db28a86645dd1b87987116501703e512142b" integrity sha512-+BaPfc7XEUU5JFkwZCx6fO1bLVK+RBlFH+iY4X34urvIzZiZINP6v2orePx3E6pAztJGE7t4DzvL7if2SL/0GQ== -"react-is@^16.12.0 || ^17.0.0 || ^18.0.0", react-is@^18.0.0, react-is@^18.3.1: - version "18.3.1" - resolved "https://registry.yarnpkg.com/react-is/-/react-is-18.3.1.tgz#e83557dc12eae63a99e003a46388b1dcbb44db7e" - integrity sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg== - react-is@^16.13.1, react-is@^16.3.2, react-is@^16.7.0: version "16.13.1" resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4" integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ== +react-is@^17.0.1: + version "17.0.2" + resolved "https://registry.yarnpkg.com/react-is/-/react-is-17.0.2.tgz#e691d4a8e9c789365655539ab372762b0efb54f0" + integrity sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w== + +react-is@^18.0.0: + version "18.3.1" + resolved "https://registry.yarnpkg.com/react-is/-/react-is-18.3.1.tgz#e83557dc12eae63a99e003a46388b1dcbb44db7e" + integrity sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg== + react-lifecycles-compat@^3.0.4: version "3.0.4" resolved "https://registry.yarnpkg.com/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz#4f1a273afdfc8f3488a8c516bfda78f872352362" @@ -7176,14 +7248,6 @@ react-router@6.27.0, react-router@^6.26.2: dependencies: "@remix-run/router" "1.20.0" -react-shallow-renderer@^16.15.0: - version "16.15.0" - resolved "https://registry.yarnpkg.com/react-shallow-renderer/-/react-shallow-renderer-16.15.0.tgz#48fb2cf9b23d23cde96708fe5273a7d3446f4457" - integrity sha512-oScf2FqQ9LFVQgA73vr86xl2NaOIX73rh+YFqcOp68CWj56tSfgtGKrEbyhCj0rSijyG9M1CYprTh39fBi5hzA== - dependencies: - object-assign "^4.1.1" - react-is "^16.12.0 || ^17.0.0 || ^18.0.0" - react-share@^5.1.0: version "5.1.0" resolved "https://registry.yarnpkg.com/react-share/-/react-share-5.1.0.tgz#27eff763e5c233c8765cacf595b039093cb9b408" @@ -7199,15 +7263,6 @@ react-switch@^6.0.0: dependencies: prop-types "^15.7.2" -react-test-renderer@^18.2.0: - version "18.3.1" - resolved "https://registry.yarnpkg.com/react-test-renderer/-/react-test-renderer-18.3.1.tgz#e693608a1f96283400d4a3afead6893f958b80b4" - integrity sha512-KkAgygexHUkQqtvvx/otwxtuFu5cVjfzTCtjXLH9boS19/Nbtg84zS7wIQn39G8IlrhThBpQsMKkq5ZHZIYFXA== - dependencies: - react-is "^18.3.1" - react-shallow-renderer "^16.15.0" - scheduler "^0.23.2" - react-transition-group@^4.4.5: version "4.4.5" resolved "https://registry.yarnpkg.com/react-transition-group/-/react-transition-group-4.4.5.tgz#e53d4e3f3344da8521489fbef8f2581d42becdd1" @@ -8202,6 +8257,11 @@ ts-node@^10.4.0, ts-node@^10.9.2: v8-compile-cache-lib "^3.0.1" yn "3.1.1" +tsconfck@^3.0.3: + version "3.1.4" + resolved "https://registry.yarnpkg.com/tsconfck/-/tsconfck-3.1.4.tgz#de01a15334962e2feb526824339b51be26712229" + integrity sha512-kdqWFGVJqe+KGYvlSO9NIaWn9jT1Ny4oKVzAJsKii5eoE9snzTJzL4+MMVOMn+fikWGFmKEylcXL710V/kIPJQ== + tsconfig@^7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/tsconfig/-/tsconfig-7.0.0.tgz#84538875a4dc216e5c4a5432b3a4dec3d54e91b7" @@ -8496,6 +8556,15 @@ vite-plugin-checker@^0.8.0: vscode-languageserver-textdocument "^1.0.1" vscode-uri "^3.0.2" +vite-tsconfig-paths@^5.1.1: + version "5.1.1" + resolved "https://registry.yarnpkg.com/vite-tsconfig-paths/-/vite-tsconfig-paths-5.1.1.tgz#c7e73fac6d6c541252742a9f9eda556d0751e669" + integrity sha512-0nLY3qQI4GlYw3We4rps16ntW+nAZYCUrJwsuvqxIUCY9Bk3VnSeJDm/VPCmjOcAJ9Kud4k+CK2ZEnf9pbzK9Q== + dependencies: + debug "^4.1.1" + globrex "^0.1.2" + tsconfck "^3.0.3" + vite@^5.4.10: version "5.4.10" resolved "https://registry.yarnpkg.com/vite/-/vite-5.4.10.tgz#d358a7bd8beda6cf0f3b7a450a8c7693a4f80c18"