Files
malio-layer-ui/app/components/malio/date/composables/useCalendarPopover.test.ts
T
tristan b07e001006 feat : en-tête « Mois Année » constant + année courante centrée (2e ligne/2e col) + cycle de vues
- l'en-tête affiche toujours « Mois Année » avec chevron bas dans les 3 vues
- le clic sur l'en-tête cycle jours -> mois -> années -> jours (goToHigherView -> cycleView)
- la grille d'années cale l'année courante en index 4 (yearPageStart = courante - 4)

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-06-22 11:28:20 +02:00

67 lines
1.9 KiB
TypeScript

import {describe, expect, it} from 'vitest'
import {defineComponent, h, ref} from 'vue'
import {mount} from '@vue/test-utils'
import {useCalendarPopover} from './useCalendarPopover'
const mountHost = () => {
const api: ReturnType<typeof useCalendarPopover> = {} as never
const Host = defineComponent({
setup() {
const root = ref<HTMLElement | null>(null)
Object.assign(api, useCalendarPopover(root))
return () => h('div', {ref: root}, 'host')
},
})
const wrapper = mount(Host, {attachTo: document.body})
return {wrapper, api}
}
describe('useCalendarPopover', () => {
it('starts closed in days view', () => {
const {api} = mountHost()
expect(api.isOpen.value).toBe(false)
expect(api.viewMode.value).toBe('days')
})
it('open() opens in days view', () => {
const {api} = mountHost()
api.open()
expect(api.isOpen.value).toBe(true)
expect(api.viewMode.value).toBe('days')
})
it('cycleView() cycles days -> months -> years -> days', () => {
const {api} = mountHost()
api.open()
api.cycleView()
expect(api.viewMode.value).toBe('months')
api.cycleView()
expect(api.viewMode.value).toBe('years')
api.cycleView()
expect(api.viewMode.value).toBe('days') // boucle vers le bas depuis 'years'
})
it('close() resets isOpen and viewMode', () => {
const {api} = mountHost()
api.open()
api.cycleView()
api.close()
expect(api.isOpen.value).toBe(false)
expect(api.viewMode.value).toBe('days')
})
it('closes on outside mousedown', () => {
const {api} = mountHost()
api.open()
document.body.dispatchEvent(new MouseEvent('mousedown', {bubbles: true}))
expect(api.isOpen.value).toBe(false)
})
it('stays open on inside mousedown', () => {
const {wrapper, api} = mountHost()
api.open()
wrapper.element.dispatchEvent(new MouseEvent('mousedown', {bubbles: true}))
expect(api.isOpen.value).toBe(true)
})
})