arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-01-22 16:00:39 +01:00
Code Issues Packages Projects Releases Wiki Activity

test: move Button to elements dir

Browse Source
This commit is contained in:
Benjamin Canac
2023-11-22 17:59:16 +01:00
parent 15a40f53f2
commit 819b5f8a17
2 changed files with 1 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
test/components/elements/Button.spec.ts Normal file
View File

@@ -0,0 +1,24 @@
// @vitest-environment nuxt
import { describe, it, expect } from 'vitest'
import Button from '../../src/runtime/components/elements/Button.vue'
import type { TypeOf } from 'zod'
import ComponentRender from '../component-render'
type ButtonOptions = TypeOf<typeof Button.props>
describe('Button', () => {
it.each([
[ 'basic case', { } ],
[ 'leading icon', { props: { leading: true, icon: 'heroicons-check' } } ],
[ 'black solid', { props: { color: 'black', variant: 'solid' } } ],
[ 'rounded full', { props: { ui: { rounded: 'rounded-full' } } } ],
[ '<UButton icon="i-heroicons-pencil-square" size="sm" color="primary" square variant="solid" />' ]
])('renders %s correctly', async (nameOrHtml: string, options: ButtonOptions) => {
if (options !== undefined) {
options.slots = options.slots || { default: () => 'label' }
options.slots.default = options.slots.default || (() => 'label')
}
const html = await ComponentRender(nameOrHtml, options, Button)
expect(html).toMatchSnapshot()
})
})

35
test/components/elements/__snapshots__/Button.spec.ts.snap Normal file
View File

@@ -0,0 +1,35 @@
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`Button > renders <UButton icon="i-heroicons-pencil-square" size="sm" color="primary" square variant="solid" /> correctly 1`] = `
"<button type=\\"button\\" class=\\"focus:outline-none disabled:cursor-not-allowed disabled:opacity-75 flex-shrink-0 font-medium rounded-md text-sm gap-x-1.5 p-1.5 shadow-sm text-white dark:text-gray-900 bg-primary-500 hover:bg-primary-600 disabled:bg-primary-500 dark:bg-primary-400 dark:hover:bg-primary-500 dark:disabled:bg-primary-400 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 inline-flex items-center\\"><span class=\\"i-heroicons-pencil-square flex-shrink-0 h-5 w-5\\" aria-hidden=\\"true\\"></span>
<!--v-if-->
<!--v-if-->
</button>"
`;
exports[`Button > renders basic case correctly 1`] = `
"<button type=\\"button\\" class=\\"focus:outline-none disabled:cursor-not-allowed disabled:opacity-75 flex-shrink-0 font-medium rounded-md text-sm gap-x-1.5 px-2.5 py-1.5 shadow-sm text-white dark:text-gray-900 bg-primary-500 hover:bg-primary-600 disabled:bg-primary-500 dark:bg-primary-400 dark:hover:bg-primary-500 dark:disabled:bg-primary-400 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 inline-flex items-center\\">
<!--v-if-->label
<!--v-if-->
</button>"
`;
exports[`Button > renders black solid correctly 1`] = `
"<button type=\\"button\\" class=\\"focus:outline-none focus-visible:outline-0 disabled:cursor-not-allowed disabled:opacity-75 flex-shrink-0 font-medium rounded-md text-sm gap-x-1.5 px-2.5 py-1.5 shadow-sm text-white dark:text-gray-900 bg-gray-900 hover:bg-gray-800 disabled:bg-gray-900 dark:bg-white dark:hover:bg-gray-100 dark:disabled:bg-white focus-visible:ring-inset focus-visible:ring-2 focus-visible:ring-primary-500 dark:focus-visible:ring-primary-400 inline-flex items-center\\">
<!--v-if-->label
<!--v-if-->
</button>"
`;
exports[`Button > renders leading icon correctly 1`] = `
"<button type=\\"button\\" class=\\"focus:outline-none disabled:cursor-not-allowed disabled:opacity-75 flex-shrink-0 font-medium rounded-md text-sm gap-x-1.5 px-2.5 py-1.5 shadow-sm text-white dark:text-gray-900 bg-primary-500 hover:bg-primary-600 disabled:bg-primary-500 dark:bg-primary-400 dark:hover:bg-primary-500 dark:disabled:bg-primary-400 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 inline-flex items-center\\"><span class=\\"heroicons-check flex-shrink-0 h-5 w-5\\" aria-hidden=\\"true\\"></span>label
<!--v-if-->
</button>"
`;
exports[`Button > renders rounded full correctly 1`] = `
"<button type=\\"button\\" class=\\"focus:outline-none disabled:cursor-not-allowed disabled:opacity-75 flex-shrink-0 font-medium rounded-full text-sm gap-x-1.5 px-2.5 py-1.5 shadow-sm text-white dark:text-gray-900 bg-primary-500 hover:bg-primary-600 disabled:bg-primary-500 dark:bg-primary-400 dark:hover:bg-primary-500 dark:disabled:bg-primary-400 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 inline-flex items-center\\">
<!--v-if-->label
<!--v-if-->
</button>"
`;