segnapunti/tests/component/ControllerPage.test.js

// @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')
        })
    })
})