search

gitcoinco / grants-stack

Round Manager & Grant Explorer & Project Builder of the Grants Protocol
Other
318 stars 154 forks source link

Remove DOM and React warnings from grant-explorer test output #2717

Open bard opened 10 months ago

bard commented 10 months ago

Examples:

stderr | src/features/contributors/__tests__/ViewContributionHistory.test.tsx > <ViewContributionHistory/> > Should show donation impact & donation history
Warning: validateDOMNesting(...): <tr> cannot appear as a child of <table>. Add a <tbody>, <thead> or <tfoot> to your code to match the DOM tree generated by the browser.
    at tr
    at table
    at DonationsTable (/home/bard/projects/gitcoin/grants-stack/packages/grant-explorer/src/features/contributors/DonationsTable.tsx:104:17)
    at main
    at div
    at ViewContributionHistory (/home/bard/projects/gitcoin/grants-stack/packages/grant-explorer/src/features/contributors/ViewContributionHistory.tsx:172:13)
    at Router (/home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/react-router@6.15.0_react@18.2.0/node_modules/react-router/dist/umd/react-router.development.js:1085:17)
    at MemoryRouter (/home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/react-router@6.15.0_react@18.2.0/node_modules/react-router/dist/umd/react-router.development.js:985:7)
 ✓ src/features/api/__tests__/voting.test.tsx  (5 tests) 38ms
stderr | src/features/common/__tests__/Navbar.test.tsx > <Navbar> > SHOULD display home-link
Warning: Invalid DOM property `stroke-width`. Did you mean `strokeWidth`?
    at circle
    at svg
    at a
    at div
    at div
    at div
    at div
    at nav
    at Navbar (/home/bard/projects/gitcoin/grants-stack/packages/grant-explorer/src/features/common/Navbar.tsx:28:39)
    at DataLayerProvider (/home/bard/projects/gitcoin/grants-stack/packages/data-layer/dist/react.js:7:30)
    at Router (/home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/react-router@6.15.0_react@18.2.0/node_modules/react-router/dist/umd/react-router.development.js:1085:17)
    at MemoryRouter (/home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/react-router@6.15.0_react@18.2.0/node_modules/react-router/dist/umd/react-router.development.js:985:7)
    at EnvironmentProvider (file:///home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/@chakra-ui+react-env@3.1.0_react@18.2.0/node_modules/@chakra-ui/react-env/dist/chunk-VMD3UMGK.mjs:26:11)
    at ColorModeProvider (file:///home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/@chakra-ui+color-mode@2.2.0_react@18.2.0/node_modules/@chakra-ui/color-mode/dist/chunk-AMBGAKG2.mjs:23:5)
    at ThemeProvider (/home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/@emotion+react@11.11.1_@types+react@18.2.21_react@18.2.0/node_modules/@emotion/react/dist/emotion-element-48d2c2e4.cjs.dev.js:125:32)
    at ThemeProvider (file:///home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/@chakra-ui+system@2.6.0_@emotion+react@11.11.1_@emotion+styled@11.11.0_react@18.2.0/node_modules/@chakra-ui/system/dist/chunk-UBPTU7WB.mjs:15:11)
    at ChakraProvider (file:///home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/@chakra-ui+provider@2.4.0_@emotion+react@11.11.1_@emotion+styled@11.11.0_react-dom@18.2.0_react@18.2.0/node_modules/@chakra-ui/provider/dist/chunk-3DDHO3UN.mjs:17:5)
    at ChakraProvider2 (file:///home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/@chakra-ui+react@2.8.0_@emotion+react@11.11.1_@emotion+styled@11.11.0_@types+react@18.2.21_fr_l6ziguyqzjnjjaly5at3bpc2wq/node_modules/@chakra-ui/react/dist/chunk-QAITB7GG.mjs:15:5)
Warning: Each child in a list should have a unique "key" prop.

Check the render method of `CategoryBanner`. See https://reactjs.org/link/warning-keys for more information.
    at div
    at CategoryBanner (/home/bard/projects/gitcoin/grants-stack/packages/grant-explorer/src/features/discovery/CardBanner.tsx:159:27)
    at div
    at /home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/tailwind-styled-components@2.2.0_react-dom@18.2.0_react@18.2.0/node_modules/tailwind-styled-components/dist/tailwind-styled-components.cjs.js:1:2200
    at a
    at div
    at /home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/tailwind-styled-components@2.2.0_react-dom@18.2.0_react@18.2.0/node_modules/tailwind-styled-components/dist/tailwind-styled-components.cjs.js:1:2200
    at CategoryCard (/home/bard/projects/gitcoin/grants-stack/packages/grant-explorer/src/features/categories/CategoryCard.tsx:7:25)
    at div
    at CategoriesGrid (/home/bard/projects/gitcoin/grants-stack/packages/grant-explorer/src/features/categories/CategoriesGrid.tsx:5:27)
    at div
    at section
    at LandingSection (/home/bard/projects/gitcoin/grants-stack/packages/grant-explorer/src/features/discovery/LandingSection.tsx:15:3)
    at div
    at main
    at DefaultLayout (/home/bard/projects/gitcoin/grants-stack/packages/grant-explorer/src/features/common/DefaultLayout.tsx:8:3)
    at LandingPage (/home/bard/projects/gitcoin/grants-stack/packages/grant-explorer/src/features/discovery/LandingPage.tsx:57:46)
    at DataLayerProvider (/home/bard/projects/gitcoin/grants-stack/packages/data-layer/dist/react.js:7:30)
    at Router (/home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/react-router@6.15.0_react@18.2.0/node_modules/react-router/dist/umd/react-router.development.js:1085:17)
    at MemoryRouter (/home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/react-router@6.15.0_react@18.2.0/node_modules/react-router/dist/umd/react-router.development.js:985:7)
    at EnvironmentProvider (file:///home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/@chakra-ui+react-env@3.1.0_react@18.2.0/node_modules/@chakra-ui/react-env/dist/chunk-VMD3UMGK.mjs:26:11)
    at ColorModeProvider (file:///home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/@chakra-ui+color-mode@2.2.0_react@18.2.0/node_modules/@chakra-ui/color-mode/dist/chunk-AMBGAKG2.mjs:23:5)
    at ThemeProvider (/home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/@emotion+react@11.11.1_@types+react@18.2.21_react@18.2.0/node_modules/@emotion/react/dist/emotion-element-48d2c2e4.cjs.dev.js:125:32)
    at ThemeProvider (file:///home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/@chakra-ui+system@2.6.0_@emotion+react@11.11.1_@emotion+styled@11.11.0_react@18.2.0/node_modules/@chakra-ui/system/dist/chunk-UBPTU7WB.mjs:15:11)
    at ChakraProvider (file:///home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/@chakra-ui+provider@2.4.0_@emotion+react@11.11.1_@emotion+styled@11.11.0_react-dom@18.2.0_react@18.2.0/node_modules/@chakra-ui/provider/dist/chunk-3DDHO3UN.mjs:17:5)
    at ChakraProvider2 (file:///home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/@chakra-ui+react@2.8.0_@emotion+react@11.11.1_@emotion+styled@11.11.0_@types+react@18.2.21_fr_l6ziguyqzjnjjaly5at3bpc2wq/node_modules/@chakra-ui/react/dist/chunk-QAITB7GG.mjs:15:5)
stderr | src/features/discovery/__tests__/LandingPage.test.tsx > LandingPage > fetches and displays active rounds and rounds in application phase
Warning: Encountered two children with the same key, `0x8f56aa55c8e6b9f4fdbbaffedbff286b8dfcfdb0`. Keys should be unique so that components maintain their identity across updates. Non-unique keys may cause children to be duplicated and/or omitted — the behavior is unsupported and could change in a future version.
    at div
    at RoundsGrid (/home/bard/projects/gitcoin/grants-stack/packages/grant-explorer/src/features/discovery/RoundsGrid.tsx:10:3)
    at div
    at section
    at LandingSection (/home/bard/projects/gitcoin/grants-stack/packages/grant-explorer/src/features/discovery/LandingSection.tsx:15:3)
    at div
    at main
    at DefaultLayout (/home/bard/projects/gitcoin/grants-stack/packages/grant-explorer/src/features/common/DefaultLayout.tsx:8:3)
    at LandingPage (/home/bard/projects/gitcoin/grants-stack/packages/grant-explorer/src/features/discovery/LandingPage.tsx:57:46)
    at DataLayerProvider (/home/bard/projects/gitcoin/grants-stack/packages/data-layer/dist/react.js:7:30)
    at Router (/home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/react-router@6.15.0_react@18.2.0/node_modules/react-router/dist/umd/react-router.development.js:1085:17)
    at MemoryRouter (/home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/react-router@6.15.0_react@18.2.0/node_modules/react-router/dist/umd/react-router.development.js:985:7)
    at EnvironmentProvider (file:///home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/@chakra-ui+react-env@3.1.0_react@18.2.0/node_modules/@chakra-ui/react-env/dist/chunk-VMD3UMGK.mjs:26:11)
    at ColorModeProvider (file:///home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/@chakra-ui+color-mode@2.2.0_react@18.2.0/node_modules/@chakra-ui/color-mode/dist/chunk-AMBGAKG2.mjs:23:5)
    at ThemeProvider (/home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/@emotion+react@11.11.1_@types+react@18.2.21_react@18.2.0/node_modules/@emotion/react/dist/emotion-element-48d2c2e4.cjs.dev.js:125:32)
    at ThemeProvider (file:///home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/@chakra-ui+system@2.6.0_@emotion+react@11.11.1_@emotion+styled@11.11.0_react@18.2.0/node_modules/@chakra-ui/system/dist/chunk-UBPTU7WB.mjs:15:11)
    at ChakraProvider (file:///home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/@chakra-ui+provider@2.4.0_@emotion+react@11.11.1_@emotion+styled@11.11.0_react-dom@18.2.0_react@18.2.0/node_modules/@chakra-ui/provider/dist/chunk-3DDHO3UN.mjs:17:5)
    at ChakraProvider2 (file:///home/bard/projects/gitcoin/grants-stack/node_modules/.pnpm/@chakra-ui+react@2.8.0_@emotion+react@11.11.1_@emotion+styled@11.11.0_@types+react@18.2.21_fr_l6ziguyqzjnjjaly5at3bpc2wq/node_modules/@chakra-ui/react/dist/chunk-QAITB7GG.mjs:15:5)
bard commented 10 months ago

The DevTools message should be fixed by upgrading vitest, see https://github.com/vitest-dev/vitest/issues/4107.