✅ test: 子コンポーネントのレンダリングテストを追加

子コンポーネントが正しくレンダリングされているかのテストを追加

ISSUES CLOSED: #34

Author: XeicuLy

src/__test__/components/mount/ParentComponent.nuxt.spec.ts

@@ -0,0 +1,16 @@
+import { describe, expect, test } from 'vitest';
+import ParentComponent from '@/components/mount/ParentComponent.vue';
+import { mountSuspendedComponent } from '@/helpers/test';
+
+describe('src/components/mount/ParentComponent.vue', () => {
+  test('子コンポーネントが正しくレンダリングされているか（stub）', async () => {
+    const ChildComponent = {
+      template: '<div id="test">Child Component Stub</div>',
+    };
+    const stubs = { ChildComponent };
+    const wrapper = await mountSuspendedComponent(ParentComponent, { stubs });
+
+    expect(wrapper.exists()).toBe(true);
+    expect(wrapper.findComponent(ChildComponent).exists()).toBe(true);
+  });
+});

src/components/mount/ChildComponent.vue

@@ -0,0 +1,3 @@
+<template>
+  <div id="child-component">Child Component</div>
+</template>

src/components/mount/ParentComponent.vue

@@ -0,0 +1,8 @@
+<script setup lang="ts">
+import ChildComponent from '@/components/mount/ChildComponent.vue';
+</script>
+<template>
+  <div id="parent-component">
+    <ChildComponent />
+  </div>
+</template>

src/pages/mount/index.vue

@@ -1,6 +1,10 @@
 <script setup lang="ts">
 import Mount from '@/components/mount/Mount.vue';
+import ParentComponent from '@/components/mount/ParentComponent.vue';
 </script>
 <template>
-  <Mount />
+  <section>
+    <Mount />
+    <ParentComponent />
+  </section>
 </template>