test: add onMount test and replace onDestory test (#303)

Author: mcous

src/__tests__/fixtures/Mounter.svelte

@@ -0,0 +1,11 @@
+<script>
+  import { onDestroy,onMount } from 'svelte'
+
+  export let onMounted
+  export let onDestroyed
+
+  onMount(() => onMounted())
+  onDestroy(() => onDestroyed())
+</script>
+
+<button />

src/__tests__/fixtures/Stopwatch.svelte

@@ -0,0 +1,33 @@
+import { describe, expect, test, vi } from 'vitest'
+
+import { act, render, screen } from '..'
+import Mounter from './fixtures/Mounter.svelte'
+
+describe('mount and destroy', () => {
+  const handleMount = vi.fn()
+  const handleDestroy = vi.fn()
+
+  test('component is mounted', async () => {
+    await act(() => {
+      render(Mounter, { onMounted: handleMount, onDestroyed: handleDestroy })
+    })
+
+    const content = screen.getByRole('button')
+
+    expect(handleMount).toHaveBeenCalledOnce()
+    expect(content).toBeInTheDocument()
+  })
+
+  test('component is destroyed', async () => {
+    const { unmount } = render(Mounter, {
+      onMounted: handleMount,
+      onDestroyed: handleDestroy,
+    })
+
+    await act(() => unmount())
+    const content = screen.queryByRole('button')
+
+    expect(handleDestroy).toHaveBeenCalledOnce()
+    expect(content).not.toBeInTheDocument()
+  })
+})

src/__tests__/mount.test.js

@@ -2,14 +2,23 @@ import { svelte } from '@sveltejs/vite-plugin-svelte'
 import { defineConfig } from 'vite'
 
 // https://vitejs.dev/config/
-export default defineConfig({
+export default defineConfig(({ mode }) => ({
   plugins: [svelte()],
+  resolve: {
+    // Ensure `browser` exports are used in tests
+    // Vitest prefers modules' `node` export by default
+    // Svelte's `node` export is its SSR bundle, which does not have onMount
+    // https://github.com/testing-library/svelte-testing-library/issues/222#issuecomment-1909993331
+    conditions: mode === 'test' ? ['browser'] : [],
+  },
   test: {
     environment: 'jsdom',
     setupFiles: ['./src/__tests__/_vitest-setup.js'],
+    mockReset: true,
+    unstubGlobals: true,
     coverage: {
       provider: 'v8',
       include: ['src'],
     },
   },
-})
+}))