correct unittest front-end #1776

tests/unit/specs/components/Participation/ParticipationWithoutAccount.spec.ts

@@ -139,9 +139,9 @@ describe("ParticipationWithoutAccount", () => {
 
     await flushPromises();
 
-    expect(requestHandlers.joinEventMutationHandler).toHaveBeenCalledWith({
+    expect(requestHandlers.joinEventMutationHandler).toHaveBeenCalledWith(
-      ...joinEventMock,
+      expect.objectContaining(joinEventMock)
-    });
+    );
 
     const cachedData = mockClient?.cache.readQuery<{ event: IEvent }>({
       query: FETCH_EVENT_BASIC,
@@ -216,9 +216,9 @@ describe("ParticipationWithoutAccount", () => {
 
     await flushPromises();
 
-    expect(requestHandlers.joinEventMutationHandler).toHaveBeenCalledWith({
+    expect(requestHandlers.joinEventMutationHandler).toHaveBeenCalledWith(
-      ...joinEventMock,
+      expect.objectContaining(joinEventMock)
-    });
+    );
 
     const cachedData = mockClient?.cache.readQuery<{ event: IEvent }>({
       query: FETCH_EVENT_BASIC,
@@ -260,9 +260,9 @@ describe("ParticipationWithoutAccount", () => {
 
     await flushPromises();
 
-    expect(requestHandlers.joinEventMutationHandler).toHaveBeenCalledWith({
+    expect(requestHandlers.joinEventMutationHandler).toHaveBeenCalledWith(
-      ...joinEventMock,
+      expect.objectContaining(joinEventMock)
-    });
+    );
     await flushPromises();
     expect(wrapper.find("form").exists()).toBeTruthy();
     expect(wrapper.find(".o-notification--danger").text()).toContain(

tests/unit/specs/components/Participation/__snapshots__/ParticipationWithoutAccount.spec.ts.snap

@@ -64,29 +64,3 @@ exports[`ParticipationWithoutAccount > handles being already a participant 1`] =
   </div>
 </section>"
 `;
-
-exports[`ParticipationWithoutAccount > renders the participation without account view with minimal data 1`] = `
-"<section class="container mx-auto">
-  <div class="">
-    <div>
-      <h1 class="title">Request for participation confirmation sent</h1>
-      <p class="prose dark:prose-invert"><span>Check your inbox (and your junk mail folder).</span><span class="details">Your participation will be validated once you click the confirmation link into the email.</span></p>
-      <!--v-if-->
-      <p class="prose dark:prose-invert">You may now close this window, or <a href="/events/f37910ea-fd5a-4756-9679-00971f3f4106" class="">return to the event's page</a>.</p>
-    </div>
-  </div>
-</section>"
-`;
-
-exports[`ParticipationWithoutAccount > renders the warning if the event participation is restricted 1`] = `
-"<section class="container mx-auto">
-  <div class="">
-    <div>
-      <h1 class="title">Request for participation confirmation sent</h1>
-      <p class="prose dark:prose-invert"><span>Check your inbox (and your junk mail folder).</span><span class="details">Your participation will be validated once you click the confirmation link into the email, and after the organizer manually validates your participation.</span></p>
-      <!--v-if-->
-      <p class="prose dark:prose-invert">You may now close this window, or <a href="/events/f37910ea-fd5a-4756-9679-00971f3f4106" class="">return to the event's page</a>.</p>
-    </div>
-  </div>
-</section>"
-`;

tests/unit/specs/components/stories/__snapshots__/DateCalendarIconStory.spec.ts.snap

@@ -3,14 +3,14 @@
 exports[`Date Calendar Icon Story > Default 1`] = `
 "<story>
   <variant title="new">
-    <div data-v-1df97f42="" class="datetime-container flex flex-col rounded-lg text-center justify-center overflow-hidden items-stretch bg-white dark:bg-gray-700 text-violet-3 dark:text-white" style="--small: 2;">
+    <div data-v-1df97f42="" class="datetime-container flex flex-col rounded-lg text-center justify-center overflow-hidden items-stretch bg-white dark:bg-gray-700 text-black dark:text-white" style="--small: 2;">
-      <div data-v-1df97f42="" class="datetime-container-header"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="weekday">Wed</time></div>
+      <div data-v-1df97f42="" class="datetime-container-header bg-red-500 dark:bg-red-900"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="weekday">Wed</time></div>
       <div data-v-1df97f42="" class="datetime-container-content"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="day block font-semibold">2</time><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="month font-semibold block uppercase py-1 px-0">Feb</time></div>
     </div>
   </variant>
   <variant title="small">
-    <div data-v-1df97f42="" class="datetime-container flex flex-col rounded-lg text-center justify-center overflow-hidden items-stretch bg-white dark:bg-gray-700 text-violet-3 dark:text-white small" style="--small: 1.2;">
+    <div data-v-1df97f42="" class="datetime-container flex flex-col rounded-lg text-center justify-center overflow-hidden items-stretch bg-white dark:bg-gray-700 text-black dark:text-white small" style="--small: 1.2;">
-      <div data-v-1df97f42="" class="datetime-container-header"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="weekday">Wed</time></div>
+      <div data-v-1df97f42="" class="datetime-container-header bg-red-500 dark:bg-red-900"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="weekday">Wed</time></div>
       <div data-v-1df97f42="" class="datetime-container-content"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="day block font-semibold">2</time><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="month font-semibold block uppercase py-1 px-0">Feb</time></div>
     </div>
   </variant>

tests/unit/specs/components/stories/__snapshots__/EventCardStory.spec.ts.snap

@@ -6,8 +6,8 @@ exports[`Event Card Story > Default 1`] = `
     <router-link data-v-4bd07c72="" to="[object Object]" class="mbz-card snap-center dark:bg-mbz-purple sm:max-w-xs w-[18rem] shrink-0 flex flex-col">
       <div data-v-4bd07c72="" class="rounded-lg">
         <div data-v-4bd07c72="" class="-mt-3 h-0 mb-3 ltr:ml-0 rtl:mr-0 block relative z-10 calendar-simple">
-          <div data-v-1df97f42="" data-v-4bd07c72="" class="datetime-container flex flex-col rounded-lg text-center justify-center overflow-hidden items-stretch bg-white dark:bg-gray-700 text-violet-3 dark:text-white small" style="--small: 1.2;">
+          <div data-v-1df97f42="" data-v-4bd07c72="" class="datetime-container flex flex-col rounded-lg text-center justify-center overflow-hidden items-stretch bg-white dark:bg-gray-700 text-black dark:text-white small" style="--small: 1.2;">
-            <div data-v-1df97f42="" class="datetime-container-header"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="weekday">Wed</time></div>
+            <div data-v-1df97f42="" class="datetime-container-header bg-red-500 dark:bg-red-900"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="weekday">Wed</time></div>
             <div data-v-1df97f42="" class="datetime-container-content"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="day block font-semibold">2</time><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="month font-semibold block uppercase py-1 px-0">Feb</time></div>
           </div>
           <!--v-if-->
@@ -57,8 +57,8 @@ exports[`Event Card Story > Default 1`] = `
     <router-link data-v-4bd07c72="" to="[object Object]" class="mbz-card snap-center dark:bg-mbz-purple sm:max-w-xs w-[18rem] shrink-0 flex flex-col">
       <div data-v-4bd07c72="" class="rounded-lg">
         <div data-v-4bd07c72="" class="-mt-3 h-0 mb-3 ltr:ml-0 rtl:mr-0 block relative z-10 calendar-simple">
-          <div data-v-1df97f42="" data-v-4bd07c72="" class="datetime-container flex flex-col rounded-lg text-center justify-center overflow-hidden items-stretch bg-white dark:bg-gray-700 text-violet-3 dark:text-white small" style="--small: 1.2;">
+          <div data-v-1df97f42="" data-v-4bd07c72="" class="datetime-container flex flex-col rounded-lg text-center justify-center overflow-hidden items-stretch bg-white dark:bg-gray-700 text-black dark:text-white small" style="--small: 1.2;">
-            <div data-v-1df97f42="" class="datetime-container-header"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="weekday">Wed</time></div>
+            <div data-v-1df97f42="" class="datetime-container-header bg-red-500 dark:bg-red-900"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="weekday">Wed</time></div>
             <div data-v-1df97f42="" class="datetime-container-content"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="day block font-semibold">2</time><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="month font-semibold block uppercase py-1 px-0">Feb</time></div>
           </div>
           <!--v-if-->
@@ -108,8 +108,8 @@ exports[`Event Card Story > Default 1`] = `
     <router-link data-v-4bd07c72="" to="[object Object]" class="mbz-card snap-center dark:bg-mbz-purple sm:max-w-xs w-[18rem] shrink-0 flex flex-col">
       <div data-v-4bd07c72="" class="rounded-lg">
         <div data-v-4bd07c72="" class="-mt-3 h-0 mb-3 ltr:ml-0 rtl:mr-0 block relative z-10 calendar-simple">
-          <div data-v-1df97f42="" data-v-4bd07c72="" class="datetime-container flex flex-col rounded-lg text-center justify-center overflow-hidden items-stretch bg-white dark:bg-gray-700 text-violet-3 dark:text-white small" style="--small: 1.2;">
+          <div data-v-1df97f42="" data-v-4bd07c72="" class="datetime-container flex flex-col rounded-lg text-center justify-center overflow-hidden items-stretch bg-white dark:bg-gray-700 text-black dark:text-white small" style="--small: 1.2;">
-            <div data-v-1df97f42="" class="datetime-container-header"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="weekday">Wed</time></div>
+            <div data-v-1df97f42="" class="datetime-container-header bg-red-500 dark:bg-red-900"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="weekday">Wed</time></div>
             <div data-v-1df97f42="" class="datetime-container-content"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="day block font-semibold">2</time><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="month font-semibold block uppercase py-1 px-0">Feb</time></div>
           </div>
           <!--v-if-->
@@ -157,8 +157,8 @@ exports[`Event Card Story > Default 1`] = `
     <router-link data-v-4bd07c72="" to="[object Object]" class="mbz-card snap-center dark:bg-mbz-purple sm:max-w-xs w-[18rem] shrink-0 flex flex-col">
       <div data-v-4bd07c72="" class="rounded-lg">
         <div data-v-4bd07c72="" class="-mt-3 h-0 mb-3 ltr:ml-0 rtl:mr-0 block relative z-10 calendar-simple">
-          <div data-v-1df97f42="" data-v-4bd07c72="" class="datetime-container flex flex-col rounded-lg text-center justify-center overflow-hidden items-stretch bg-white dark:bg-gray-700 text-violet-3 dark:text-white small" style="--small: 1.2;">
+          <div data-v-1df97f42="" data-v-4bd07c72="" class="datetime-container flex flex-col rounded-lg text-center justify-center overflow-hidden items-stretch bg-white dark:bg-gray-700 text-black dark:text-white small" style="--small: 1.2;">
-            <div data-v-1df97f42="" class="datetime-container-header"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="weekday">Wed</time></div>
+            <div data-v-1df97f42="" class="datetime-container-header bg-red-500 dark:bg-red-900"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="weekday">Wed</time></div>
             <div data-v-1df97f42="" class="datetime-container-content"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="day block font-semibold">2</time><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="month font-semibold block uppercase py-1 px-0">Feb</time></div>
           </div>
           <!--v-if-->
@@ -206,8 +206,8 @@ exports[`Event Card Story > Default 1`] = `
     <router-link data-v-4bd07c72="" to="[object Object]" class="mbz-card snap-center dark:bg-mbz-purple sm:flex sm:items-start">
       <div data-v-4bd07c72="" class="rounded-lg sm:w-full sm:max-w-[20rem]">
         <div data-v-4bd07c72="" class="-mt-3 h-0 mb-3 ltr:ml-0 rtl:mr-0 block relative z-10 sm:hidden calendar-simple">
-          <div data-v-1df97f42="" data-v-4bd07c72="" class="datetime-container flex flex-col rounded-lg text-center justify-center overflow-hidden items-stretch bg-white dark:bg-gray-700 text-violet-3 dark:text-white small" style="--small: 1.2;">
+          <div data-v-1df97f42="" data-v-4bd07c72="" class="datetime-container flex flex-col rounded-lg text-center justify-center overflow-hidden items-stretch bg-white dark:bg-gray-700 text-black dark:text-white small" style="--small: 1.2;">
-            <div data-v-1df97f42="" class="datetime-container-header"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="weekday">Wed</time></div>
+            <div data-v-1df97f42="" class="datetime-container-header bg-red-500 dark:bg-red-900"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="weekday">Wed</time></div>
             <div data-v-1df97f42="" class="datetime-container-content"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="day block font-semibold">2</time><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="month font-semibold block uppercase py-1 px-0">Feb</time></div>
           </div>
           <!--v-if-->

tests/unit/specs/components/stories/__snapshots__/EventListViewCardStory.spec.ts.snap

@@ -6,8 +6,8 @@ exports[`Event List View Card Story > Default 1`] = `
     <article class="bg-white dark:bg-zinc-700 dark:text-white dark:hover:text-white rounded-lg shadow-md max-w-3xl p-2">
       <div class="flex gap-2">
         <div class="">
-          <div data-v-1df97f42="" class="datetime-container flex flex-col rounded-lg text-center justify-center overflow-hidden items-stretch bg-white dark:bg-gray-700 text-violet-3 dark:text-white small" style="--small: 1.2;">
+          <div data-v-1df97f42="" class="datetime-container flex flex-col rounded-lg text-center justify-center overflow-hidden items-stretch bg-white dark:bg-gray-700 text-black dark:text-white small" style="--small: 1.2;">
-            <div data-v-1df97f42="" class="datetime-container-header"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="weekday">Wed</time></div>
+            <div data-v-1df97f42="" class="datetime-container-header bg-red-500 dark:bg-red-900"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="weekday">Wed</time></div>
             <div data-v-1df97f42="" class="datetime-container-content"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="day block font-semibold">2</time><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="month font-semibold block uppercase py-1 px-0">Feb</time></div>
           </div>
         </div>
@@ -28,8 +28,8 @@ exports[`Event List View Card Story > Default 1`] = `
     <article class="bg-white dark:bg-zinc-700 dark:text-white dark:hover:text-white rounded-lg shadow-md max-w-3xl p-2">
       <div class="flex gap-2">
         <div class="">
-          <div data-v-1df97f42="" class="datetime-container flex flex-col rounded-lg text-center justify-center overflow-hidden items-stretch bg-white dark:bg-gray-700 text-violet-3 dark:text-white small" style="--small: 1.2;">
+          <div data-v-1df97f42="" class="datetime-container flex flex-col rounded-lg text-center justify-center overflow-hidden items-stretch bg-white dark:bg-gray-700 text-black dark:text-white small" style="--small: 1.2;">
-            <div data-v-1df97f42="" class="datetime-container-header"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="weekday">Wed</time></div>
+            <div data-v-1df97f42="" class="datetime-container-header bg-red-500 dark:bg-red-900"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="weekday">Wed</time></div>
             <div data-v-1df97f42="" class="datetime-container-content"><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="day block font-semibold">2</time><time data-v-1df97f42="" datetime="2022-02-02T02:04:00.000Z" class="month font-semibold block uppercase py-1 px-0">Feb</time></div>
           </div>
         </div>

tests/unit/specs/mocks/event.ts

@@ -56,7 +56,6 @@ export const joinEventMock = {
   actorId: "1",
   email: "some@email.tld",
   message: "a message long enough",
-  locale: "en_US",
   timezone: Intl.DateTimeFormat().resolvedOptions().timeZone,
 };