// @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' // 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) // 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() wrapper.vm.state.sp.punt.home = 5 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() wrapper.vm.state.sp.punt.home = 5 wrapper.vm.state.sp.punt.guest = 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() wrapper.vm.state.sp.punt.home = 15 wrapper.vm.state.sp.punt.guest = 10 wrapper.vm.state.sp.servHome = true 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() wrapper.vm.state.sp.punt.home = 10 wrapper.vm.state.sp.punt.guest = 15 wrapper.vm.state.sp.servHome = false 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') }) }) // ============================================= // 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') }) }) })