test(component): porta ControllerPage e DisplayPage al 100% di statement coverage
Aggiunge 65 test per ControllerPage.vue (layout esteso/landscape, popup automatico di set vinto con soglia decisiva, modal di configurazione, validazione completa dei cambi giocatore, modal time out con selezione video/ticker/countdown, cleanup dei listener) e 35 per DisplayPage.vue (countdown overlay, riallineamento video su riconnessione, fallback muto per autoplay bloccato, selezione voce per la sintesi vocale). Nessun bug riscontrato nei componenti.
This commit is contained in:
@@ -31,6 +31,15 @@ vi.stubGlobal('speechSynthesis', {
|
||||
getVoices: () => []
|
||||
})
|
||||
|
||||
// happy-dom non implementa la Web Speech API: stub minimo dell'utterance.
|
||||
vi.stubGlobal('SpeechSynthesisUtterance', class {
|
||||
constructor(text) {
|
||||
this.text = text
|
||||
this.voice = null
|
||||
this.lang = ''
|
||||
}
|
||||
})
|
||||
|
||||
// happy-dom non implementa la riproduzione media: stub di play/pause/load
|
||||
// così l'overlay time out può montare il <video> senza errori.
|
||||
Object.defineProperty(HTMLMediaElement.prototype, 'play', { value: vi.fn().mockResolvedValue(undefined), writable: true })
|
||||
@@ -257,6 +266,256 @@ describe('DisplayPage.vue', () => {
|
||||
})
|
||||
})
|
||||
|
||||
// =============================================
|
||||
// ORDINE GUEST/HOME CON FORMAZIONE
|
||||
// =============================================
|
||||
describe('Ordine guest/home con formazione visibile', () => {
|
||||
it('order=false e visuForm=true mostra punteggio inline e formazioni nell\'ordine guest poi home', async () => {
|
||||
const wrapper = mountDisplay()
|
||||
wrapper.vm.state.order = false
|
||||
wrapper.vm.state.visuForm = true
|
||||
wrapper.vm.state.sp.striscia.at(-1).ris = 'h'.repeat(3) + 'g'.repeat(2)
|
||||
await wrapper.vm.$nextTick()
|
||||
const scores = wrapper.findAll('.score-inline')
|
||||
expect(scores[0].text()).toBe('2') // guest per primo
|
||||
expect(scores[1].text()).toBe('3') // home per secondo
|
||||
const formDivs = wrapper.findAll('.formdiv')
|
||||
expect(formDivs).toHaveLength(12)
|
||||
})
|
||||
})
|
||||
|
||||
// =============================================
|
||||
// MONTAGGIO: FULLSCREEN E TIME OUT GIÀ ATTIVO
|
||||
// =============================================
|
||||
describe('Comportamento al mount', () => {
|
||||
it('su dispositivo mobile richiede la fullscreen', () => {
|
||||
const uaSpy = vi.spyOn(navigator, 'userAgent', 'get').mockReturnValue('Mozilla/5.0 (iPhone; CPU iPhone OS 15_0 like Mac OS X)')
|
||||
const fsSpy = vi.fn()
|
||||
document.documentElement.requestFullscreen = fsSpy
|
||||
const wrapper = mountDisplay()
|
||||
expect(fsSpy).toHaveBeenCalled()
|
||||
wrapper.unmount()
|
||||
uaSpy.mockRestore()
|
||||
})
|
||||
|
||||
it('non richiede la fullscreen su desktop', () => {
|
||||
const fsSpy = vi.fn()
|
||||
document.documentElement.requestFullscreen = fsSpy
|
||||
const wrapper = mountDisplay()
|
||||
expect(fsSpy).not.toHaveBeenCalled()
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('ignora l\'errore se requestFullscreen lancia un\'eccezione', () => {
|
||||
const uaSpy = vi.spyOn(navigator, 'userAgent', 'get').mockReturnValue('Mozilla/5.0 (Linux; Android 10)')
|
||||
document.documentElement.requestFullscreen = () => { throw new Error('non consentito') }
|
||||
expect(() => mountDisplay()).not.toThrow()
|
||||
uaSpy.mockRestore()
|
||||
})
|
||||
|
||||
it('se il time out è già attivo al mount avvia subito la modalità time out', async () => {
|
||||
const wrapper = mount(DisplayPage, {
|
||||
global: { stubs: { 'w-app': true } },
|
||||
data() {
|
||||
const state = {
|
||||
order: true, visuForm: false, visuStriscia: true,
|
||||
timeout: true, timeoutTeam: 'home', timeoutVideo: null,
|
||||
timeoutStartedAt: Date.now(), modalitaPartita: '3/5',
|
||||
sp: {
|
||||
striscia: [{ serv: 'h', ris: '', vinc: null }],
|
||||
nomi: { home: 'Antoniana', guest: 'Guest' },
|
||||
form: { home: ['1', '2', '3', '4', '5', '6'], guest: ['1', '2', '3', '4', '5', '6'] },
|
||||
},
|
||||
}
|
||||
return { state }
|
||||
}
|
||||
})
|
||||
await wrapper.vm.$nextTick()
|
||||
expect(wrapper.vm.mostraPlaceholder).toBe(true)
|
||||
expect(wrapper.find('.timeout-overlay').exists()).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
// =============================================
|
||||
// TICKER COUNTDOWN E CASI LIMITE
|
||||
// =============================================
|
||||
describe('Ticker del countdown', () => {
|
||||
it('il ticker aggiorna nowTick periodicamente durante il time out', async () => {
|
||||
const wrapper = mountDisplay()
|
||||
wrapper.vm.state.timeoutTeam = 'home'
|
||||
wrapper.vm.state.timeoutStartedAt = Date.now()
|
||||
wrapper.vm.state.timeout = true
|
||||
await wrapper.vm.$nextTick()
|
||||
expect(wrapper.vm.timeoutRemaining).toBe(30)
|
||||
vi.advanceTimersByTime(1000)
|
||||
await wrapper.vm.$nextTick()
|
||||
expect(wrapper.vm.timeoutRemaining).toBeLessThan(30)
|
||||
})
|
||||
|
||||
it('timeoutRemaining resta 30 se manca timeoutStartedAt', async () => {
|
||||
const wrapper = mountDisplay()
|
||||
wrapper.vm.state.timeoutTeam = 'home'
|
||||
wrapper.vm.state.timeoutStartedAt = null
|
||||
wrapper.vm.state.timeout = true
|
||||
await wrapper.vm.$nextTick()
|
||||
expect(wrapper.vm.timeoutRemaining).toBe(30)
|
||||
})
|
||||
|
||||
it('smontare il componente durante il time out ferma il ticker senza errori', async () => {
|
||||
const wrapper = mountDisplay()
|
||||
wrapper.vm.state.timeoutTeam = 'home'
|
||||
wrapper.vm.state.timeoutStartedAt = Date.now()
|
||||
wrapper.vm.state.timeout = true
|
||||
await wrapper.vm.$nextTick()
|
||||
expect(() => wrapper.unmount()).not.toThrow()
|
||||
})
|
||||
|
||||
it('stricciaStrip non fallisce se la striscia del set corrente è assente', async () => {
|
||||
const wrapper = mountDisplay()
|
||||
wrapper.vm.state.sp.striscia = []
|
||||
expect(wrapper.vm.stricciaStrip).toEqual({ home: [], guest: [] })
|
||||
// ripristina uno stato valido prima che Vue ricalcoli gli altri computed (punt/servHome)
|
||||
wrapper.vm.state.sp.striscia = [{ serv: 'h', ris: '', vinc: null }]
|
||||
await wrapper.vm.$nextTick()
|
||||
})
|
||||
})
|
||||
|
||||
// =============================================
|
||||
// FINE TIME OUT: STOP VIDEO E FALLBACK MUTO
|
||||
// =============================================
|
||||
describe('Stop del time out e riproduzione video', () => {
|
||||
async function attivaTimeout(wrapper, { team = 'home', video = null, startedAt = Date.now() } = {}) {
|
||||
wrapper.vm.state.timeoutTeam = team
|
||||
wrapper.vm.state.timeoutVideo = video
|
||||
wrapper.vm.state.timeoutStartedAt = startedAt
|
||||
wrapper.vm.state.timeout = true
|
||||
await wrapper.vm.$nextTick()
|
||||
await wrapper.vm.$nextTick()
|
||||
}
|
||||
|
||||
it('allo stop del time out con video in corso mette in pausa e resetta il video', async () => {
|
||||
const wrapper = mountDisplay()
|
||||
await attivaTimeout(wrapper, { video: 'a.mp4' })
|
||||
const video = wrapper.find('.timeout-video').element
|
||||
const pauseSpy = vi.spyOn(video, 'pause')
|
||||
wrapper.vm.state.timeout = false
|
||||
await wrapper.vm.$nextTick()
|
||||
expect(pauseSpy).toHaveBeenCalled()
|
||||
})
|
||||
|
||||
it('a metà riproduzione si riallinea al punto corretto (riconnessione)', async () => {
|
||||
const wrapper = mountDisplay()
|
||||
await attivaTimeout(wrapper, { video: 'a.mp4', startedAt: Date.now() - 10000 })
|
||||
const video = wrapper.find('.timeout-video').element
|
||||
Object.defineProperty(video, 'duration', { value: 60, configurable: true })
|
||||
video.onloadedmetadata()
|
||||
expect(video.currentTime).toBeCloseTo(10, 0)
|
||||
})
|
||||
|
||||
it('senza timeoutStartedAt non tenta alcun riallineamento (trascorsi=0)', async () => {
|
||||
const wrapper = mountDisplay()
|
||||
await attivaTimeout(wrapper, { video: 'a.mp4', startedAt: null })
|
||||
const video = wrapper.find('.timeout-video').element
|
||||
Object.defineProperty(video, 'duration', { value: 60, configurable: true })
|
||||
video.currentTime = 0
|
||||
video.onloadedmetadata()
|
||||
expect(video.currentTime).toBe(0)
|
||||
})
|
||||
|
||||
it('non si riallinea se il tempo trascorso supera la durata del video', async () => {
|
||||
const wrapper = mountDisplay()
|
||||
await attivaTimeout(wrapper, { video: 'a.mp4', startedAt: Date.now() - 10000 })
|
||||
const video = wrapper.find('.timeout-video').element
|
||||
Object.defineProperty(video, 'duration', { value: 5, configurable: true })
|
||||
video.currentTime = 0
|
||||
video.onloadedmetadata()
|
||||
expect(video.currentTime).toBe(0)
|
||||
})
|
||||
|
||||
it('caricaSpotCorrente non fa nulla se manca il ref del video o il video del time out', () => {
|
||||
const wrapper = mountDisplay()
|
||||
// nessun overlay attivo: $refs.spotVideo non esiste
|
||||
expect(() => wrapper.vm.caricaSpotCorrente()).not.toThrow()
|
||||
expect(wrapper.vm.spotVideoDuration).toBe(null)
|
||||
})
|
||||
|
||||
it('playSpot non fa nulla se manca il ref del video', () => {
|
||||
const wrapper = mountDisplay()
|
||||
expect(() => wrapper.vm.playSpot()).not.toThrow()
|
||||
})
|
||||
|
||||
it('se l\'autoplay con audio viene bloccato ripiega sul muto', async () => {
|
||||
const wrapper = mountDisplay()
|
||||
HTMLMediaElement.prototype.play = vi.fn()
|
||||
.mockRejectedValueOnce(new Error('autoplay bloccato'))
|
||||
.mockResolvedValueOnce(undefined)
|
||||
await attivaTimeout(wrapper, { video: 'a.mp4' })
|
||||
const video = wrapper.find('.timeout-video').element
|
||||
await Promise.resolve()
|
||||
await Promise.resolve()
|
||||
expect(video.muted).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
// =============================================
|
||||
// MESSAGGI WEBSOCKET E SINTESI VOCALE
|
||||
// =============================================
|
||||
describe('onWsMessage e sintesi vocale', () => {
|
||||
it('un messaggio "speak" avvia la sintesi vocale con il testo ricevuto', () => {
|
||||
const wrapper = mountDisplay()
|
||||
wrapper.vm.onWsMessage({ type: 'speak', text: '15 a 10' })
|
||||
expect(window.speechSynthesis.cancel).toHaveBeenCalled()
|
||||
expect(window.speechSynthesis.speak).toHaveBeenCalled()
|
||||
const utterance = window.speechSynthesis.speak.mock.calls.at(-1)[0]
|
||||
expect(utterance.text).toBe('15 a 10')
|
||||
expect(utterance.lang).toBe('it-IT')
|
||||
})
|
||||
|
||||
it('un messaggio "error" viene loggato in console', () => {
|
||||
const wrapper = mountDisplay()
|
||||
const spy = vi.spyOn(console, 'error').mockImplementation(() => {})
|
||||
wrapper.vm.onWsMessage({ type: 'error', message: 'boom' })
|
||||
expect(spy).toHaveBeenCalledWith('[Display] Server error:', 'boom')
|
||||
spy.mockRestore()
|
||||
})
|
||||
|
||||
it('ignora testo vuoto o non stringa nella sintesi vocale', () => {
|
||||
const wrapper = mountDisplay()
|
||||
window.speechSynthesis.speak.mockClear()
|
||||
wrapper.vm.speakOnDisplay(' ')
|
||||
wrapper.vm.speakOnDisplay(42)
|
||||
expect(window.speechSynthesis.speak).not.toHaveBeenCalled()
|
||||
})
|
||||
|
||||
it('sceglie la voce "Google italiano" quando disponibile', () => {
|
||||
const wrapper = mountDisplay()
|
||||
const vIt = { name: 'voce it generica', lang: 'it-IT' }
|
||||
const vGoogle = { name: 'Google italiano', lang: 'it-IT' }
|
||||
window.speechSynthesis.getVoices = () => [vIt, vGoogle]
|
||||
wrapper.vm.speakOnDisplay('prova')
|
||||
const utterance = window.speechSynthesis.speak.mock.calls.at(-1)[0]
|
||||
expect(utterance.voice).toBe(vGoogle)
|
||||
})
|
||||
|
||||
it('ripiega su una voce con lingua "it" se manca "Google italiano"', () => {
|
||||
const wrapper = mountDisplay()
|
||||
const vIt = { name: 'voce italiana', lang: 'it-IT' }
|
||||
const vEn = { name: 'english voice', lang: 'en-US' }
|
||||
window.speechSynthesis.getVoices = () => [vEn, vIt]
|
||||
wrapper.vm.speakOnDisplay('prova')
|
||||
const utterance = window.speechSynthesis.speak.mock.calls.at(-1)[0]
|
||||
expect(utterance.voice).toBe(vIt)
|
||||
})
|
||||
|
||||
it('usa voice=null se nessuna voce italiana è disponibile', () => {
|
||||
const wrapper = mountDisplay()
|
||||
window.speechSynthesis.getVoices = () => [{ name: 'english voice', lang: 'en-US' }]
|
||||
wrapper.vm.speakOnDisplay('prova')
|
||||
const utterance = window.speechSynthesis.speak.mock.calls.at(-1)[0]
|
||||
expect(utterance.voice).toBe(null)
|
||||
})
|
||||
})
|
||||
|
||||
// =============================================
|
||||
// ICONA SERVIZIO
|
||||
// =============================================
|
||||
|
||||
Reference in New Issue
Block a user