chore(deps): bump to React 18

front/package.json

@@ -30,16 +30,16 @@
   "dependencies": {
     "@babel/plugin-proposal-async-generator-functions": "^7.20.1",
     "@babel/preset-env": "^7.20.2",
-    "@babel/preset-react": "^7.18.6",
+    "@babel/preset-react": "^7.25.7",
     "@geist-ui/core": "^2.3.8",
-    "@monaco-editor/react": "^4.4.1",
-    "@rjsf/core": "^3.2.1",
+    "@monaco-editor/react": "~4.6",
+    "@rjsf/core": "~5.21",
     "@rollup/plugin-graphql": "^2.0.2",
     "@vitejs/plugin-legacy": "^3.0.1",
-    "@vitejs/plugin-react": "^3.0.0",
+    "@vitejs/plugin-react": "^4.0.0",
     "biblatex-csl-converter": "^1.11.0",
     "clsx": "^1.2.1",
-    "core-js": "^3.26.1",
+    "core-js": "^3.38",
     "diff-match-patch": "^1.0.5",
     "downshift": "^6.1.3",
     "http-link-header": "^1.0.2",
@@ -53,11 +53,11 @@
     "object-path-immutable": "^4.1.0",
     "pagedjs": "^0.4.0",
     "prop-types": "^15.8.1",
-    "react": "^16.13.1",
+    "react": "~18.3",
     "react-copy-to-clipboard": "^5.0.3",
     "react-dnd": "16.0.1",
     "react-dnd-html5-backend": "16.0.1",
-    "react-dom": "^16.13.1",
+    "react-dom": "~18.3",
     "react-feather": "^2.0.9",
     "react-i18next": "^12.2.2",
     "react-redux": "^7.2.4",
@@ -73,6 +73,12 @@
     "y-websocket": "^1.5.0",
     "yjs": "^13.6.6"
   },
+  "overrides": {
+    "@geist-ui/core": {
+      "react": "$react",
+      "react-dom": "$react-dom"
+    }
+  },
   "repository": {
     "type": "git",
     "url": "https://github.com/ecrituresnumeriques/stylo"
@@ -81,12 +87,16 @@
     "url": "https://github.com/ecrituresnumeriques/stylo/issues"
   },
   "devDependencies": {
+    "@testing-library/jest-dom": "^6.5.0",
+    "@testing-library/react": "^16.0.1",
+    "@testing-library/user-event": "^14.5.2",
     "@vitest/coverage-v8": "^2.1.2",
-    "@welldone-software/why-did-you-render": "^6.2.3",
+    "@welldone-software/why-did-you-render": "~8.0",
     "eslint": "^8.2.0",
     "eslint-plugin-jsonc": "^2.5.0",
     "eslint-plugin-react": "^7.27.0",
-    "eslint-plugin-vitest": "^0.4.1",
+    "eslint-plugin-vitest": "^0.5.4",
+    "jsdom": "^25.0.1",
     "prettier": "^2.3.0",
     "vitest": "^2.1.2"
   },

front/src/components/Button.test.jsx

@@ -0,0 +1,28 @@
+import { describe, expect, test } from 'vitest'
+import { render, screen } from '@testing-library/react'
+import {getRoles} from '@testing-library/dom'
+import React from 'react'
+import Component from './Button.jsx'
+
+describe('Button', () => {
+  test('renders as a button (default)', () => {
+    render(<Component>Test</Component>)
+
+    expect(screen.getByRole('button')).toHaveAttribute('type', 'button')
+  })
+
+  test('renders as a submit button', () => {
+    render(<Component primary>Test</Component>)
+    expect(screen.getByRole('button')).toHaveAttribute('type', 'submit')
+  })
+
+  test('renders with title, className and props', () => {
+    render(<Component title="ok" disabled small link icon className="truc">Test</Component>)
+    expect(screen.getByRole('button')).toHaveAttribute('title', 'ok')
+    expect(screen.getByRole('button')).toHaveAttribute('disabled')
+    expect(screen.getByRole('button')).toHaveClass(/small/)
+    expect(screen.getByRole('button')).toHaveClass(/link/)
+    expect(screen.getByRole('button')).toHaveClass(/icon/)
+    expect(screen.getByRole('button')).toHaveClass('truc')
+  })
+})

front/src/components/Write/bibliographe/ZoteroPanel.jsx

@@ -106,7 +106,7 @@ export default function ZoteroPanel ({ articleId, zoteroLink: initialZoteroLink,
     setSaving(true)
     try {
       const result = await fetchBibliographyFromCollectionHref({ token, collectionHref })
-      onChange(result.join('\n'))
+      onChange(result)
     } catch (err) {
       console.error(`Something went wrong while fetching bibliography from Zotero: ${collectionHref}`, err)
     } finally {

front/src/helpers/__snapshots__/zotero/group-collection.bib

@@ -0,0 +1,129 @@
+
+@book{grossetie_test1_nodate,
+	title = {test1},
+	publisher = {Moi},
+	author = {Grossetie, Guillaume},
+}
+
+@misc{grossetie_hello_nodate,
+	title = {Hello},
+	shorttitle = {Hi},
+	author = {Grossetie, Guillaume},
+}
+
+@misc{grossetie_test_nodate,
+	type = {yuzutech.fr},
+	title = {test},
+	journal = {How to},
+	author = {GROSSETIE, guillaume},
+}
+
+@unpublished{noauthor_notitle_nodate,
+}
+
+@misc{noauthor_notitle_nodate-1,
+}
+
+@misc{noauthor_notitle_nodate-2,
+}
+
+@book{noauthor_test19_nodate,
+	title = {test19},
+}
+
+@book{noauthor_test26_nodate,
+	title = {test26},
+}
+
+@book{noauthor_test25_nodate,
+	title = {test25},
+}
+
+@book{noauthor_test24_nodate,
+	title = {test24},
+}
+
+@book{noauthor_test23_nodate,
+	title = {test23},
+}
+
+@book{noauthor_test22_nodate,
+	title = {test22},
+}
+
+@book{noauthor_test21_nodate,
+	title = {test21},
+}
+
+@book{noauthor_test20_nodate,
+	title = {test20},
+}
+
+@book{noauthor_test9_nodate,
+	title = {test9},
+}
+
+@book{noauthor_test8_nodate,
+	title = {test8},
+}
+
+@book{noauthor_test5_nodate,
+	title = {test5},
+}
+
+@book{noauthor_test7_nodate,
+	title = {test7},
+}
+
+@book{noauthor_test6_nodate,
+	title = {test6},
+}
+
+@book{noauthor_test4_nodate,
+	title = {test4},
+}
+
+@book{noauthor_test16_nodate,
+	title = {test16},
+}
+
+@book{noauthor_test15_nodate,
+	title = {test15},
+}
+
+@book{noauthor_test14_nodate,
+	title = {test14},
+}
+
+@book{noauthor_test12_nodate,
+	title = {test12},
+}
+
+@book{noauthor_test11_nodate,
+	title = {test11},
+}
+
+
+@book{noauthor_test3_nodate,
+	title = {test3},
+}
+
+@book{noauthor_test2_nodate,
+	title = {test2},
+}
+
+@book{noauthor_test18_nodate,
+	title = {test18},
+}
+
+@book{noauthor_test17_nodate,
+	title = {test17},
+}
+
+@book{noauthor_test13_nodate,
+	title = {test13},
+}
+
+@book{noauthor_test10_nodate,
+	title = {test10},
+}

front/src/helpers/zotero.js

@@ -189,8 +189,8 @@ export async function fetchUserCollections ({ userID, key }) {
 /**
  * @param collectionHref
  * @param key Zotero API key
- * @returns {Promise<string[]>}
+ * @returns {Promise<string>}
  */
 export const fetchBibliographyFromCollectionHref = async ({ collectionHref, token: key = null, }) => {
-  return fetchAllBibTeX(new URL(collectionHref + '/items'), key)
+  return (await fetchAllBibTeX(new URL(collectionHref + '/items'), key)).join('\n')
 }

front/src/helpers/zotero.test.js

@@ -2,15 +2,13 @@ import { describe, test, expect } from 'vitest'
 import { fetchBibliographyFromCollectionHref } from './zotero'
 
 describe('fetchBibliographyFromCollection', () => {
-  test('fetches a paginated collection of more than 25 elements', () => {
+  test('fetches a paginated collection of more than 25 elements', async () => {
     const zoteroId = '2478772/collections/UGF4W4PZ'
 
-    return fetchBibliographyFromCollectionHref({
+    const bib = await fetchBibliographyFromCollectionHref({
       collectionHref: `https://api.zotero.org/groups/${zoteroId}`,
-    }).then((bib) => {
-      expect(bib[0]).toMatch('@misc{grossetie_hello_nodate')
-      expect(bib[0]).not.toMatch('@book{grossetie_hello_nodate')
-      expect(bib[1]).toMatch('@book{noauthor_test10_nodate')
     })
+
+    return expect(bib).toMatchFileSnapshot('__snapshots__/zotero/group-collection.bib')
   })
 })

front/tests/setup.js

@@ -0,0 +1,7 @@
+import { afterEach, vi } from 'vitest'
+import { cleanup } from '@testing-library/react'
+import '@testing-library/jest-dom/vitest'
+
+vi.mock('react-router-dom')
+
+afterEach(() => cleanup())

front/tests/utils.jsx

@@ -0,0 +1,23 @@
+import React from 'react'
+import { render } from '@testing-library/react'
+import { Provider } from 'react-redux'
+import setupStore from '../src/createReduxStore.js'
+
+export function renderWithProviders(component, extendedRenderOptions = {}) {
+  const {
+    preloadedState = {},
+    // Automatically create a store instance if no store was passed in
+    store = setupStore(preloadedState),
+    ...renderOptions
+  } = extendedRenderOptions
+
+  function Wrapper ({ children }) {
+    <Provider store={store}>{children}</Provider>
+  }
+
+  // Return an object with the store and all of RTL's query functions
+  return {
+    store,
+    ...render(component, { wrapper: Wrapper, ...renderOptions })
+  }
+}

front/vite.config.js

@@ -64,14 +64,16 @@ export default defineConfig(async ({ mode }) => {
     },
 
     test: {
+      coverage: {
+        reporter: ['text', 'html', 'lcovonly'],
+      },
+      environment: 'jsdom',
       exclude: [
         'build/**',
         'public/**',
         'node_modules/**'
       ],
-      coverage: {
-        reporter: ['text', 'html', 'lcovonly'],
-      }
+      setupFiles: ['./tests/setup.js']
     }
   }
 })