38 lines
1.3 KiB
TypeScript
38 lines
1.3 KiB
TypeScript
import { describe, it, expect } from 'vitest'
|
|
import { h } from 'vue'
|
|
import { mount } from '@vue/test-utils'
|
|
import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from '../src/lib'
|
|
|
|
const RIVERS = ['Styx', 'Acheron', 'Cocytus']
|
|
|
|
function mountSelect(modelValue: string | undefined) {
|
|
return mount(Select, {
|
|
props: { modelValue },
|
|
slots: {
|
|
default: () => [
|
|
h(SelectTrigger, undefined, {
|
|
default: () => h(SelectValue, { placeholder: 'Choose a river' }),
|
|
}),
|
|
h(SelectContent, undefined, {
|
|
default: () => RIVERS.map((r) => h(SelectItem, { value: r }, { default: () => r })),
|
|
}),
|
|
],
|
|
},
|
|
attachTo: document.body,
|
|
})
|
|
}
|
|
|
|
describe('Select', () => {
|
|
it('renders the trigger with the placeholder when no value is selected', () => {
|
|
const wrapper = mountSelect(undefined)
|
|
expect(wrapper.text()).toContain('Choose a river')
|
|
})
|
|
|
|
it('shows the selected value in the trigger once the item has rendered', async () => {
|
|
const wrapper = mountSelect('Styx')
|
|
// SelectValue resolves its display label from the matching SelectItem, which only
|
|
// mounts once the dropdown has opened at least once.
|
|
await wrapper.get('button[role="combobox"]').trigger('click')
|
|
expect(wrapper.text()).toContain('Styx')
|
|
})
|
|
})
|