add tests for mt-avatar component

packages/component-library/src/components/icons-media/mt-avatar/mt-avatar.spec.ts

@@ -0,0 +1,25 @@
+import { render, screen } from "@testing-library/vue";
+import MtAvatar from "./mt-avatar.vue";
+
+describe("mt-avatar", () => {
+  it("shows only a placeholder", () => {
+    render(MtAvatar, { props: { placeholder: true } });
+
+    const result = screen.getByTestId("mt-avatar-placeholder");
+
+    expect(result).toBeInTheDocument();
+
+    expect(screen.queryByTestId("mt-avatar-initials")).not.toBeInTheDocument();
+  });
+
+  it("shows only initials", () => {
+    render(MtAvatar, { props: { firstName: "John", lastName: "Doe" } });
+
+    const result = screen.getByTestId("mt-avatar-initials");
+
+    expect(result).toBeInTheDocument();
+    expect(result).toHaveTextContent("JD");
+
+    expect(screen.queryByTestId("mt-avatar-placeholder")).not.toBeInTheDocument();
+  });
+});

packages/component-library/src/components/icons-media/mt-avatar/mt-avatar.vue

@@ -7,13 +7,16 @@
     role="img"
   >
     <slot>
-      <span v-if="showInitials" class="mt-avatar__initials">
+      <span v-if="showInitials" class="mt-avatar__initials" data-testid="mt-avatar-initials">
         {{ avatarInitials }}
       </span>
 
-      <span v-if="showPlaceholder">
-        <mt-icon name="regular-user" />
-      </span>
+      <mt-icon
+        v-if="showPlaceholder"
+        aria-hidden
+        name="regular-user"
+        data-testid="mt-avatar-placeholder"
+      />
     </slot>
   </span>
 </template>