// @vitest-environment happy-dom import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest' import { mount } from '@vue/test-utils' import ControllerPage from '../../src/components/ControllerPage.vue' import { generaReferto } from '../../src/referto.js' // Il referto apre una finestra/print: lo mockiamo per testarne solo l'invocazione. vi.mock('../../src/referto.js', () => ({ generaReferto: vi.fn() })) // Mock globale WebSocket per jsdom class MockWebSocket { static OPEN = 1 static CONNECTING = 0 readyState = 0 onopen = null onclose = null onmessage = null onerror = null send = vi.fn() close = vi.fn() constructor() { // Simula connessione immediata setTimeout(() => { this.readyState = 1 if (this.onopen) this.onopen() }, 0) } } vi.stubGlobal('WebSocket', MockWebSocket) // Forza l'orientamento portrait → il controller usa il layout "mobile" // (con .team-pts, .btn-ctrl, ecc.) su cui questi test fanno asserzioni. Object.defineProperty(window, 'innerWidth', { value: 400, writable: true, configurable: true }) Object.defineProperty(window, 'innerHeight', { value: 800, writable: true, configurable: true }) // Imposta il punteggio del set in corso costruendo una ris coerente. // `serv` ('h'|'g') controlla l'ultimo punto, quindi chi risulta al servizio. function setScore(wrapper, home, guest, serv = 'h') { const altro = serv === 'h' ? 'g' : 'h' const nAltro = serv === 'h' ? guest : home const nServ = serv === 'h' ? home : guest // mette per ultimo il carattere del battitore desiderato wrapper.vm.state.sp.striscia.at(-1).ris = altro.repeat(nAltro) + serv.repeat(nServ) } // Helper per creare il componente con stato personalizzato function mountController(stateOverrides = {}) { const wrapper = mount(ControllerPage, { global: { stubs: { 'w-app': true, 'w-button': true } } }) if (Object.keys(stateOverrides).length > 0) { wrapper.vm.state = { ...wrapper.vm.state, ...stateOverrides } } return wrapper } describe('ControllerPage.vue', () => { beforeEach(() => { vi.useFakeTimers() }) afterEach(() => { vi.useRealTimers() }) // ============================================= // RENDERING INIZIALE // ============================================= describe('Rendering iniziale', () => { it('dovrebbe mostrare i nomi dei team', () => { const wrapper = mountController() const text = wrapper.text() expect(text).toContain('Antoniana') expect(text).toContain('Guest') }) it('dovrebbe mostrare punteggio 0-0', () => { const wrapper = mountController() const pts = wrapper.findAll('.team-pts') expect(pts[0].text()).toBe('0') expect(pts[1].text()).toBe('0') }) it('dovrebbe mostrare SET 0 per entrambi i team', () => { const wrapper = mountController() const sets = wrapper.findAll('.team-set') expect(sets[0].text()).toContain('SET 0') expect(sets[1].text()).toContain('SET 0') }) }) // ============================================= // CLICK PUNTEGGIO // ============================================= describe('Click punteggio', () => { it('dovrebbe chiamare sendAction con incPunt home al click sul team home', async () => { const wrapper = mountController() const spy = vi.spyOn(wrapper.vm, 'sendAction') await wrapper.find('.team-score.home-bg').trigger('click') expect(spy).toHaveBeenCalledWith({ type: 'incPunt', team: 'home' }) }) it('dovrebbe chiamare sendAction con incPunt guest al click sul team guest', async () => { const wrapper = mountController() const spy = vi.spyOn(wrapper.vm, 'sendAction') await wrapper.find('.team-score.guest-bg').trigger('click') expect(spy).toHaveBeenCalledWith({ type: 'incPunt', team: 'guest' }) }) }) // ============================================= // BOTTONE CAMBIO PALLA // ============================================= describe('Cambio Palla', () => { it('dovrebbe essere abilitato a 0-0', () => { const wrapper = mountController() const btn = wrapper.findAll('.btn-ctrl').find(b => b.text().includes('Cambio Palla')) expect(btn.attributes('disabled')).toBeUndefined() }) it('dovrebbe essere disabilitato se il punteggio non è 0-0', async () => { const wrapper = mountController() setScore(wrapper, 5, 0) await wrapper.vm.$nextTick() const btn = wrapper.findAll('.btn-ctrl').find(b => b.text().includes('Cambio Palla')) expect(btn.attributes('disabled')).toBeDefined() }) }) // ============================================= // DIALOG RESET // ============================================= describe('Dialog Reset', () => { it('click Reset dovrebbe aprire la conferma', async () => { const wrapper = mountController() expect(wrapper.find('.overlay').exists()).toBe(false) await wrapper.find('.btn-danger').trigger('click') expect(wrapper.vm.confirmReset).toBe(true) expect(wrapper.find('.overlay').exists()).toBe(true) }) it('click NO dovrebbe chiudere la conferma', async () => { const wrapper = mountController() wrapper.vm.confirmReset = true await wrapper.vm.$nextTick() await wrapper.find('.btn-cancel').trigger('click') expect(wrapper.vm.confirmReset).toBe(false) }) it('click SI dovrebbe chiamare doReset', async () => { const wrapper = mountController() const spy = vi.spyOn(wrapper.vm, 'sendAction') wrapper.vm.confirmReset = true await wrapper.vm.$nextTick() await wrapper.find('.btn-confirm').trigger('click') expect(spy).toHaveBeenCalledWith({ type: 'resetta' }) expect(wrapper.vm.confirmReset).toBe(false) }) }) // ============================================= // COMPUTED cambiValid // ============================================= describe('cambiValid', () => { it('dovrebbe essere false se tutti i campi sono vuoti', () => { const wrapper = mountController() wrapper.vm.cambiData = [{ in: '', out: '' }, { in: '', out: '' }] expect(wrapper.vm.cambiValid).toBe(false) }) it('dovrebbe essere true con un cambio completo', () => { const wrapper = mountController() wrapper.vm.cambiData = [{ in: '10', out: '1' }, { in: '', out: '' }] expect(wrapper.vm.cambiValid).toBe(true) }) it('dovrebbe essere false con un cambio parziale (solo IN)', () => { const wrapper = mountController() wrapper.vm.cambiData = [{ in: '10', out: '' }, { in: '', out: '' }] expect(wrapper.vm.cambiValid).toBe(false) }) it('dovrebbe essere false con un cambio parziale (solo OUT)', () => { const wrapper = mountController() wrapper.vm.cambiData = [{ in: '', out: '1' }, { in: '', out: '' }] expect(wrapper.vm.cambiValid).toBe(false) }) it('dovrebbe essere true con due cambi completi', () => { const wrapper = mountController() wrapper.vm.cambiData = [{ in: '10', out: '1' }, { in: '11', out: '2' }] expect(wrapper.vm.cambiValid).toBe(true) }) }) // ============================================= // SPEAK // ============================================= describe('speak', () => { it('dovrebbe generare "zero a zero" a 0-0', () => { const wrapper = mountController() wrapper.vm.wsConnected = true wrapper.vm.ws = { readyState: 1, send: vi.fn() } wrapper.vm.speak() const sent = JSON.parse(wrapper.vm.ws.send.mock.calls[0][0]) expect(sent.type).toBe('speak') expect(sent.text).toBe('zero a zero') }) it('dovrebbe generare "N pari" a punteggio uguale', () => { const wrapper = mountController() setScore(wrapper, 5, 5) wrapper.vm.wsConnected = true wrapper.vm.ws = { readyState: 1, send: vi.fn() } wrapper.vm.speak() const sent = JSON.parse(wrapper.vm.ws.send.mock.calls[0][0]) expect(sent.text).toBe('5 pari') }) it('dovrebbe annunciare prima il punteggio di chi batte (home serve)', () => { const wrapper = mountController() setScore(wrapper, 15, 10, 'h') wrapper.vm.wsConnected = true wrapper.vm.ws = { readyState: 1, send: vi.fn() } wrapper.vm.speak() const sent = JSON.parse(wrapper.vm.ws.send.mock.calls[0][0]) expect(sent.text).toBe('15 a 10') }) it('dovrebbe annunciare prima il punteggio di chi batte (guest serve)', () => { const wrapper = mountController() setScore(wrapper, 10, 15, 'g') wrapper.vm.wsConnected = true wrapper.vm.ws = { readyState: 1, send: vi.fn() } wrapper.vm.speak() const sent = JSON.parse(wrapper.vm.ws.send.mock.calls[0][0]) expect(sent.text).toBe('15 a 10') }) }) // ============================================= // REFERTO (modal PARTITA FINITA) // ============================================= describe('Referto', () => { // Porta il componente allo stato "partita finita" per home in 2/3 function setPartitaFinita(wrapper) { wrapper.vm.state.modalitaPartita = '2/3' wrapper.vm.state.sp.striscia = [ { serv: 'h', ris: '', vinc: 'h' }, { serv: 'h', ris: '', vinc: null }, ] wrapper.vm.setVintoTeam = 'home' wrapper.vm.showSetVinto = true } it('mostra il bottone REFERTO quando la partita è finita', async () => { const wrapper = mountController() setPartitaFinita(wrapper) await wrapper.vm.$nextTick() expect(wrapper.vm.isPartitaFinita).toBe(true) const btn = wrapper.findAll('.btn-secondary').find(b => b.text().includes('REFERTO')) expect(btn).toBeDefined() }) it('il click su REFERTO invoca generaReferto con lo stato', async () => { const wrapper = mountController() setPartitaFinita(wrapper) await wrapper.vm.$nextTick() const btn = wrapper.findAll('.btn-secondary').find(b => b.text().includes('REFERTO')) await btn.trigger('click') expect(generaReferto).toHaveBeenCalledWith(wrapper.vm.state) }) it('NON mostra il bottone REFERTO a set vinto (partita non finita)', async () => { const wrapper = mountController() wrapper.vm.state.modalitaPartita = '3/5' wrapper.vm.setVintoTeam = 'home' wrapper.vm.showSetVinto = true await wrapper.vm.$nextTick() expect(wrapper.vm.isPartitaFinita).toBe(false) const btn = wrapper.findAll('.btn-secondary').find(b => b.text().includes('REFERTO')) expect(btn).toBeUndefined() }) }) // ============================================= // BARRA CONNESSIONE // ============================================= describe('Barra connessione', () => { it('dovrebbe avere classe "connected" quando connesso', async () => { const wrapper = mountController() wrapper.vm.wsConnected = true await wrapper.vm.$nextTick() expect(wrapper.find('.conn-bar').classes()).toContain('connected') }) it('non dovrebbe avere classe "connected" quando disconnesso', () => { const wrapper = mountController() wrapper.vm.wsConnected = false expect(wrapper.find('.conn-bar').classes()).not.toContain('connected') }) it('dovrebbe mostrare "Connesso" quando connesso', async () => { const wrapper = mountController() wrapper.vm.wsConnected = true await wrapper.vm.$nextTick() expect(wrapper.find('.conn-bar').text()).toContain('Connesso') }) }) })