diff --git a/test/components/Toast.spec.ts b/test/components/Toast.spec.ts
index 09c923c7..e59f2b5e 100644
--- a/test/components/Toast.spec.ts
+++ b/test/components/Toast.spec.ts
@@ -1,23 +1,34 @@
import { defineComponent } from 'vue'
import { describe, it, expect } from 'vitest'
-import App from '../../src/runtime/components/App.vue'
+import Toaster from '../../src/runtime/components/Toaster.vue'
import Toast, { type ToastProps } from '../../src/runtime/components/Toast.vue'
import ComponentRender from '../component-render'
+import { ClientOnly } from '#components'
const ToastWrapper = defineComponent({
components: {
- UApp: App,
- UToast: Toast
+ UToaster: Toaster,
+ UToast: Toast,
+ ClientOnly
},
inheritAttrs: false,
- template: ''
+ template: ''
})
describe('Toast', () => {
it.each([
- ['basic case', {}],
- ['with class', { props: { class: '' } }],
- ['with ui', { props: { ui: {} } }]
+ ['with title', { props: { title: 'Toast' } }],
+ ['with description', { props: { description: 'This is a toast' } }],
+ ['with title & description', { props: { title: 'Toast', description: 'This is a toast' } }],
+ ['with icon', { props: { icon: 'i-heroicons-rocket-launch', title: 'Toast' } }],
+ ['with avatar', { props: { avatar: { src: 'https://avatars.githubusercontent.com/u/739984?v=4' }, title: 'Toast' } }],
+ ['with color', { props: { color: 'green' as const, title: 'Toast' } }],
+ ['with actions', { props: { title: 'Toast', actions: [{ label: 'Action' }] } }],
+ ['with description actions', { props: { title: 'Toast', description: 'This is a toast', actions: [{ label: 'Action' }] } }],
+ ['without close', { props: { title: 'Toast', close: null } }],
+ ['with type', { props: { type: 'background' as const } }],
+ ['with class', { props: { class: 'bg-gray-50 dark:bg-gray-800/50' } }],
+ ['with ui', { props: { title: 'Toast', ui: { title: 'font-bold' } } }]
])('renders %s correctly', async (nameOrHtml: string, options: { props?: ToastProps, slots?: any }) => {
const html = await ComponentRender(nameOrHtml, options, ToastWrapper)
expect(html).toMatchSnapshot()
diff --git a/test/components/__snapshots__/Toast.spec.ts.snap b/test/components/__snapshots__/Toast.spec.ts.snap
new file mode 100644
index 00000000..b9af86f7
--- /dev/null
+++ b/test/components/__snapshots__/Toast.spec.ts.snap
@@ -0,0 +1,306 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`Toast > renders with actions correctly 1`] = `
+"
+
+ -
+
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+ -
+
+
+
+
+
+
+
+
+
+
+
+
+
+ -
+
+
+
+
+
+
+
+
+
+ -
+
+
+
Toast
+
This is a toast
+
+
+
+
+
+
+
+
+
+
+ -
+
+
+
+
+
+
+
+
+
+ -
+
+
+
+
+
+
+
+
+
+ -
+
+
+
Toast
+
This is a toast
+
+
+
+
+
+
+
+
+
+
+ -
+
+
+
+
+
+
+
+
+
+ -
+
+
+
+
+
+
+
+
+
+
+
+
+
+ -
+
+
+
+
+
+
+
+