ajouter des tests pour les groupes

sonar888 · sonar888 · commit 011fd03c6f2a · 2026-03-04T16:21:50.000+01:00
diff --git a/frontend/src/components/forms/auth/LoginForm.tsx b/frontend/src/components/forms/auth/LoginForm.tsx
@@ -82,7 +82,7 @@ const LoginForm = () => {
         colour="dark"
         className="text-xl px-[25px] py-[10px] mt-5"
         type="submit"
-        dataTestId="buttonLogin"
+        data-testid="buttonLogin"
       >
         Connexion
       </Button>
diff --git a/frontend/src/components/forms/auth/RegisterForm.tsx b/frontend/src/components/forms/auth/RegisterForm.tsx
@@ -187,7 +187,7 @@ const RegisterForm = () => {
         colour="dark"
         rounded
         className="text-xl px-[25px] py-[10px] mt-5"
-        dataTestId="buttonRegister"
+        data-testid="buttonRegister"
       >
         Inscription
       </Button>
diff --git a/frontend/src/components/forms/groups/GroupForm.tsx b/frontend/src/components/forms/groups/GroupForm.tsx
@@ -39,6 +39,7 @@ export default function GroupForm({
           onChange={handleChange}
           placeholder="Entrez le nom du groupe"
           error={errors.name}
+          data-testid="name-input"
         />
 
         <SearchSelectInput
@@ -54,6 +55,7 @@ export default function GroupForm({
           error={errors.event_type}
           options={options}
           theme="light"
+          data-testid="event-type-select"
         />
 
         <Input
@@ -64,6 +66,7 @@ export default function GroupForm({
           onChange={handleChange}
           placeholder={String(0)}
           error={errors.piggy_bank}
+          data-testid="piggy-bank-input"
         />
 
         <InputWithToggle
@@ -78,6 +81,7 @@ export default function GroupForm({
           label="Le nom du destinataire"
           question="Voulez-vous ajouter un destinataire? "
           error={errors.user_beneficiary}
+          data-testid="toggle-beneficiary-input"
         />
 
         <Input
@@ -87,6 +91,7 @@ export default function GroupForm({
           value={formData.deadline}
           onChange={handleChange}
           error={errors.deadline}
+          data-testid="deadline-input"
         />
       </div>
     </div>
diff --git a/frontend/src/components/forms/groups/GroupFormTemplate.tsx b/frontend/src/components/forms/groups/GroupFormTemplate.tsx
@@ -28,6 +28,7 @@ export default function GroupFormTemplate({
   return (
     <form
       className="relative flex flex-col w-full md:h-full md:min-h-0 max-md:h-auto"
+      data-testid="create-group-form"
       onSubmit={(e) => {
         onSubmit(e);
       }}
@@ -46,16 +47,29 @@ export default function GroupFormTemplate({
 
       {/* Boutons desktop : positionnés en absolu */}
       <div className="max-md:hidden absolute bottom-4 left-1/2 -translate-x-1/2 flex flex-row items-center gap-5">
-        <Button colour="dark" rounded type="button" onClick={onSuccess} className="px-4">
+        <Button
+          colour="dark"
+          rounded
+          type="button"
+          onClick={onSuccess}
+          className="px-4"
+          data-testid="cancel-button"
+        >
           Annuler
         </Button>
         {isEdit && isAdmin && (
-          <Button colour="green" rounded type="submit" className="px-4">
+          <Button colour="green" rounded type="submit" className="px-4" data-testid="edit-group-button">
             Modifier
           </Button>
         )}
         {!isEdit && (
-          <Button colour="green" rounded type="submit" className="px-4">
+          <Button
+            colour="green"
+            rounded
+            type="submit"
+            className="px-4"
+            data-testid="submit-create-group-button"
+          >
             Créer
           </Button>
         )}
diff --git a/frontend/src/components/forms/groups/UsersForm.tsx b/frontend/src/components/forms/groups/UsersForm.tsx
@@ -66,6 +66,7 @@ export default function UsersForm({
           placeholder="Ajouter des participants..."
           theme="light"
           name="users"
+          data-testid="users-input"
           value={query}
           onChange={(e) => setQuery(e.target.value)}
           items={[...items]}
diff --git a/frontend/src/components/groups/Groups.tsx b/frontend/src/components/groups/Groups.tsx
@@ -45,6 +45,7 @@ export default function Groups({
         classNameTitle="text-[1.125rem]"
         button={
           <Button
+            data-testid="create-group-button"
             text={"Ajouter un groupe"}
             icon="plus"
             colour="green"
@@ -88,6 +89,7 @@ export default function Groups({
         onClose={closeCreateGroupModal}
         size="lg"
         withPadding
+        data-testid="create-group-modal"
         className="p-0 overflow-y-auto max-h-[72vh] max-md:max-h-full"
       >
         <GroupFormindex onCancel={createGroupModal.close} onSuccess={createGroupModal.close} />
diff --git a/frontend/src/components/utils/Button.tsx b/frontend/src/components/utils/Button.tsx
@@ -30,7 +30,7 @@ export default function Button({
   type = "button",
   small = false,
   disabled = false,
-  dataTestId,
+  ...rest
 }: ButtonProps) {
   const backgroundColours = {
     blue: "bg-blue",
@@ -47,9 +47,9 @@ export default function Button({
 
   return (
     <button
+      {...rest}
       type={type}
       disabled={disabled}
-      data-testid={dataTestId}
       className={`${backgroundColour} text-white font-inter-extra-bold
         ${rounded ? "rounded-full p-2" : small ? "rounded-lg py-1.5 px-3 text-sm" : "rounded-lg py-2 px-4"}
         flex items-center gap-2 font-medium shadow-md
diff --git a/frontend/src/components/utils/Modal.tsx b/frontend/src/components/utils/Modal.tsx
@@ -43,6 +43,7 @@ export default function Modal({
   closeOnOverlayClick = true,
   showCloseButton = true,
   withPadding = true,
+  ...rest
 }: ModalProps) {
   useEffect(() => {
     if (!isOpen) return;
@@ -68,7 +69,8 @@ export default function Modal({
   return (
     // biome-ignore lint/a11y/noStaticElementInteractions: overlay click is pointer-only; keyboard users dismiss via Escape
     <div
-      className="fixed inset-0 z-[1100] flex items-center justify-center bg-black/75 max-md:p-0" //
+      {...rest}
+      className="fixed inset-0 z-[1100] flex items-center justify-center bg-black/75 max-md:p-0"
       role="presentation"
       onMouseDown={() => {
         if (closeOnOverlayClick) onClose();
diff --git a/frontend/src/components/utils/SearchSelectInput.tsx b/frontend/src/components/utils/SearchSelectInput.tsx
@@ -23,7 +23,6 @@ interface SearchableSelectProps {
 }
 
 export default function SearchSelectInput({
-  // name,
   value,
   onChange,
   options,
@@ -35,6 +34,7 @@ export default function SearchSelectInput({
   icon,
   className = "",
   name,
+  ...rest
 }: SearchableSelectProps) {
   const id = useId();
   const [open, setOpen] = useState(false);
@@ -112,6 +112,7 @@ export default function SearchSelectInput({
 
   return (
     <div
+      {...rest}
       tabIndex={disabled ? -1 : 0}
       ref={containerRef}
       role="combobox"
diff --git a/frontend/src/components/utils/ToggleSwitch.tsx b/frontend/src/components/utils/ToggleSwitch.tsx
@@ -22,6 +22,7 @@ export default function ToggleSwitch({ checked, onChange, mode = "light" }: Togg
 
   return (
     <div
+      data-testid="toggle-switch"
       onClick={() => onChange(!checked)}
       onKeyDown={(e) => {
         if (e.key === "Enter") {
diff --git a/frontend/src/pages/Conversations.tsx b/frontend/src/pages/Conversations.tsx
@@ -152,38 +152,6 @@ export default function Conversations() {
     chat.connectToRoom(groupData?.getAllMyGroups.groupToken);
   }, [groupData, chat]);
 
-  // useEffect(() => {
-  //   if (!groupData?.getAllMyGroups) return;
-
-  //   if (groupData?.getAllMyGroups.groups.length === 0) {
-  //     setIndexGroup(-1);
-  //     setSelectedGroupId(null);
-  //     return;
-  //   }
-
-  //   const newGroups = groupData?.getAllMyGroups.groups || [];
-  //   setGroups(newGroups);
-
-  //   // Initialize messages map with empty arrays for all groups
-  //   setMessages((prev) => {
-  //     const updated = { ...prev };
-  //     newGroups.forEach((group) => {
-  //       const groupId = Number(group.id);
-  //       if (!updated[groupId]) {
-  //         updated[groupId] = [];
-  //       }
-  //     });
-  //     return updated;
-  //   });
-
-  //   const existing =
-  //     indexGroups !== -1
-  //       ? groupData?.getAllMyGroups.groups.find((group) => Number(group.id) === Number(indexGroups))
-  //       : null;
-
-  //   setIndexGroup(existing ? indexGroups : 0);
-  // }, [groupData, indexGroups]);
-
   // pour set les messages initiaux
   useEffect(() => {
     const data = messageData?.getAllMessageMyGroups;
@@ -502,6 +470,7 @@ export default function Conversations() {
               icon="plus"
               text="Créer un groupe"
               colour="green"
+              data-testid="create-group-button"
               onClick={() => setIsCreateGroupModalOpen(true)}
             />
           </div>
@@ -514,6 +483,7 @@ export default function Conversations() {
           </div>
         </div>
         <Modal
+          data-testid="create-group-modal"
           colour="blue"
           isOpen={isCreateGroupModalOpen}
           onClose={() => setIsCreateGroupModalOpen(false)}
diff --git a/frontend/tests/Authentication.test.tsx b/frontend/tests/Authentication.test.tsx
@@ -5,6 +5,7 @@ import userEvent from '@testing-library/user-event'
 import { MemoryRouter } from 'react-router'
 import LoginForm from '../src/components/forms/auth/LoginForm'
 import RegisterForm from '../src/components/forms/auth/RegisterForm'
+import React from 'react'
 
 const { mockNavigate, mockLogin, mockSetUserProfile, mockRegister } = vi.hoisted(() => ({
   mockNavigate: vi.fn(),
diff --git a/frontend/tests/Dashboard.test.tsx b/frontend/tests/Dashboard.test.tsx
@@ -0,0 +1,15 @@
+/// <reference types="@testing-library/jest-dom" />
+import { describe, test, expect, vi, beforeEach } from 'vitest'
+import { render, screen, waitFor } from '@testing-library/react'
+import userEvent from '@testing-library/user-event'
+import { MemoryRouter } from 'react-router'
+import LoginForm from '../src/components/forms/auth/LoginForm'
+import RegisterForm from '../src/components/forms/auth/RegisterForm'
+import React from 'react'
+
+describe('Affichage des éléments dans le Dashboard', () => {
+    test("Si aucun groupe n'existe, la page de placeholder s'affiche", () => {})
+    test("Si je fait partie des groupes, les groupes s'affichent", () => {})
+    test("Si je fait partie des groupes, les groupes s'affichent", () => {})
+})
+
diff --git a/frontend/tests/Group.test.tsx b/frontend/tests/Group.test.tsx
diff --git a/frontend/tests/Groupe.test.tsx b/frontend/tests/Groupe.test.tsx
diff --git a/frontend/tests/fixtures/groupFixtures.ts b/frontend/tests/fixtures/groupFixtures.ts

Original file line number	Diff line number	Diff line change
`@@ -82,7 +82,7 @@ const LoginForm = () => {`
`82`	`82`	`colour="dark"`
`83`	`83`	`className="text-xl px-[25px] py-[10px] mt-5"`
`84`	`84`	`type="submit"`
`85`		`- dataTestId="buttonLogin"`
	`85`	`+ data-testid="buttonLogin"`
`86`	`86`	`>`
`87`	`87`	`Connexion`
`88`	`88`	`</Button>`
Original file line number	Diff line number	Diff line change
`@@ -187,7 +187,7 @@ const RegisterForm = () => {`
`187`	`187`	`colour="dark"`
`188`	`188`	`rounded`
`189`	`189`	`className="text-xl px-[25px] py-[10px] mt-5"`
`190`		`- dataTestId="buttonRegister"`
	`190`	`+ data-testid="buttonRegister"`
`191`	`191`	`>`
`192`	`192`	`Inscription`
`193`	`193`	`</Button>`