Récupération des genres et début du test avec récupération des élément du Dom.

@@ -2,13 +2,27 @@
 import { describe, expect, it } from "vitest";
 import { describe, expect, it } from "vitest";
 import { mount } from "@vue/test-utils";
 import { mount } from "@vue/test-utils";
 import MovieGender from "../../components/details/MovieGender.vue";
 import MovieGender from "../../components/details/MovieGender.vue";
+import type { Genre } from "~/interfaces/movie";
 //#endregion
 //#endregion
 
 
 describe("MovieGender", () => {
 describe("MovieGender", () => {
-  // todo : ajouter les tests ici.
-  it("component renders properly", () => {
-    const wrapper = mount(MovieGender);
+  it("affiche correctement les genres", () => {
+    // Données de test
+    const genres: Genre[] = [
+      { id: 1, name: "Action" },
+      { id: 2, name: "Comédie" },
+      { id: 3, name: "Drame" },
+    ];
+    // Monter le composant avec sa props
+    const wrapper = mount(MovieGender, {
+      props: {
+        genres
+      }
+    });
+
+    const spanElements = wrapper.findAll('span');
+    console.log(spanElements);
     // expect(wrapper.text()).toContain("Hello world");
     // expect(wrapper.text()).toContain("Hello world");
     expect(wrapper.text());
     expect(wrapper.text());
   });
   });
-});
+});