diff --git a/package.json b/package.json
index d6a153d..20bc1c2 100644
--- a/package.json
+++ b/package.json
@@ -72,6 +72,7 @@
"devDependencies": {
"@sveltejs/vite-plugin-svelte": "^2.4.2",
"@testing-library/jest-dom": "^6.3.0",
+ "@testing-library/user-event": "^14.5.2",
"@typescript-eslint/eslint-plugin": "6.19.1",
"@typescript-eslint/parser": "6.19.1",
"@vitest/coverage-v8": "^0.33.0",
diff --git a/src/__tests__/fixtures/Transitioner.svelte b/src/__tests__/fixtures/Transitioner.svelte
new file mode 100644
index 0000000..2ee1557
--- /dev/null
+++ b/src/__tests__/fixtures/Transitioner.svelte
@@ -0,0 +1,18 @@
+
+
+
+
+{#if show}
+
(introDone = true)}>
+ {#if introDone}
+
Done
+ {:else}
+
Pending
+ {/if}
+
+{/if}
diff --git a/src/__tests__/transition.test.js b/src/__tests__/transition.test.js
new file mode 100644
index 0000000..5b1ff18
--- /dev/null
+++ b/src/__tests__/transition.test.js
@@ -0,0 +1,30 @@
+import { userEvent } from '@testing-library/user-event'
+import { beforeEach, describe, expect, test, vi } from 'vitest'
+
+import { render, screen, waitFor } from '..'
+import Transitioner from './fixtures/Transitioner.svelte'
+
+describe('transitions', () => {
+ beforeEach(() => {
+ if (window.navigator.userAgent.includes('jsdom')) {
+ const raf = (fn) => setTimeout(() => fn(new Date()), 16)
+ vi.stubGlobal('requestAnimationFrame', raf)
+ }
+ })
+
+ test('on:introend', async () => {
+ const user = userEvent.setup()
+
+ render(Transitioner)
+ const start = screen.getByRole('button')
+ await user.click(start)
+
+ const pending = screen.getByTestId('intro-pending')
+ expect(pending).toBeInTheDocument()
+
+ await waitFor(() => {
+ const done = screen.queryByTestId('intro-done')
+ expect(done).toBeInTheDocument()
+ })
+ })
+})