[#MUI-32] Création d'un composant saisie assistée (autocomplete) (#46)
| Numéro du ticket | Titre du ticket | |------------------|-----------------| | | | ## Description de la PR ## Modification du .env ## Check list - [ ] Pas de régression - [ ] TU/TI/TF rédigée - [ ] TU/TI/TF OK - [ ] CHANGELOG modifié Reviewed-on: #46 Co-authored-by: tristan <tristan@yuno.malio.fr> Co-committed-by: tristan <tristan@yuno.malio.fr>
This commit was merged in pull request #46.
This commit is contained in:
@@ -8,6 +8,7 @@ type Tab = {
|
||||
key: string
|
||||
label: string
|
||||
icon?: string
|
||||
disabled?: boolean
|
||||
}
|
||||
|
||||
type TabListProps = {
|
||||
@@ -134,4 +135,53 @@ describe('MalioTabList', () => {
|
||||
expect(icons[0].props('icon')).toBe('mdi:home')
|
||||
expect(icons[1].props('icon')).toBe('mdi:account')
|
||||
})
|
||||
|
||||
it('sets disabled attribute and aria-disabled on disabled tabs', () => {
|
||||
const disabledTabs: Tab[] = [
|
||||
{key: 'a', label: 'A'},
|
||||
{key: 'b', label: 'B', disabled: true},
|
||||
]
|
||||
const wrapper = mountComponent({tabs: disabledTabs})
|
||||
const buttons = wrapper.findAll('[role="tab"]')
|
||||
expect(buttons[1].attributes('disabled')).toBeDefined()
|
||||
expect(buttons[1].attributes('aria-disabled')).toBe('true')
|
||||
})
|
||||
|
||||
it('applies cursor-not-allowed on disabled tabs', () => {
|
||||
const disabledTabs: Tab[] = [
|
||||
{key: 'a', label: 'A'},
|
||||
{key: 'b', label: 'B', disabled: true},
|
||||
]
|
||||
const wrapper = mountComponent({tabs: disabledTabs})
|
||||
const buttons = wrapper.findAll('[role="tab"]')
|
||||
expect(buttons[1].classes()).toContain('cursor-not-allowed')
|
||||
expect(buttons[1].classes()).not.toContain('hover:text-m-primary/70')
|
||||
})
|
||||
|
||||
it('does not emit update:modelValue when clicking a disabled tab', async () => {
|
||||
const disabledTabs: Tab[] = [
|
||||
{key: 'a', label: 'A'},
|
||||
{key: 'b', label: 'B', disabled: true},
|
||||
]
|
||||
const wrapper = mountComponent({tabs: disabledTabs, modelValue: 'a'})
|
||||
const buttons = wrapper.findAll('[role="tab"]')
|
||||
|
||||
await buttons[1].trigger('click')
|
||||
|
||||
expect(wrapper.emitted('update:modelValue')).toBeUndefined()
|
||||
})
|
||||
|
||||
it('does not change active tab in uncontrolled mode when clicking disabled tab', async () => {
|
||||
const disabledTabs: Tab[] = [
|
||||
{key: 'a', label: 'A'},
|
||||
{key: 'b', label: 'B', disabled: true},
|
||||
]
|
||||
const wrapper = mountComponent({tabs: disabledTabs})
|
||||
const buttons = wrapper.findAll('[role="tab"]')
|
||||
|
||||
await buttons[1].trigger('click')
|
||||
|
||||
expect(buttons[0].attributes('aria-selected')).toBe('true')
|
||||
expect(buttons[1].attributes('aria-selected')).toBe('false')
|
||||
})
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user