Migrate to Vue 3 and Vite

Signed-off-by: Thomas Citharel <tcit@tcit.fr>

js/tests/unit/specs/components/Report/ReportCard.spec.ts

@@ -1,18 +1,16 @@
-import { config, createLocalVue, mount } from "@vue/test-utils";
+import { config, mount } from "@vue/test-utils";
 import ReportCard from "@/components/Report/ReportCard.vue";
-import Buefy from "buefy";
 import { ActorType } from "@/types/enums";
-
-const localVue = createLocalVue();
-localVue.use(Buefy);
-config.mocks.$t = (key: string): string => key;
+import { describe, expect, it } from "vitest";
+import { createI18n } from "vue-i18n";
+import en from "@/i18n/en_US.json";
 
 const reportData = {
   id: "1",
   content: "My content",
   insertedAt: "2020-12-02T09:01:20.873Z",
   reporter: {
-    preferredUsername: "author",
+    preferredUsername: "John Snow",
     domain: null,
     name: "Reporter of Things",
     type: ActorType.PERSON,
@@ -26,7 +24,6 @@ const reportData = {
 
 const generateWrapper = (customReportData: Record<string, unknown> = {}) => {
   return mount(ReportCard, {
-    localVue,
     propsData: {
       report: { ...reportData, ...customReportData },
     },
@@ -37,16 +34,16 @@ describe("ReportCard", () => {
   it("renders report card with basic informations", () => {
     const wrapper = generateWrapper();
 
-    expect(wrapper.find(".media-content .title").text()).toBe(
+    expect(wrapper.find(".flex.gap-1 div p:first-child").text()).toBe(
       reportData.reported.name
     );
 
-    expect(wrapper.find(".media-content .subtitle").text()).toBe(
+    expect(wrapper.find(".flex.gap-1 div p:nth-child(2)").text()).toBe(
       `@${reportData.reported.preferredUsername}`
     );
 
-    expect(wrapper.find(".is-one-quarter-desktop span").text()).toBe(
-      `Reported by {reporter}`
+    expect(wrapper.find(".reported_by div:first-child").text()).toBe(
+      `Reported by John Snow`
     );
   });
 
@@ -55,8 +52,8 @@ describe("ReportCard", () => {
       reporter: { domain: "somewhere.else", type: ActorType.APPLICATION },
     });
 
-    expect(wrapper.find(".is-one-quarter-desktop span").text()).toBe(
-      "Reported by someone on {domain}"
+    expect(wrapper.find(".reported_by div:first-child").text()).toBe(
+      "Reported by someone on somewhere.else"
     );
   });
 });