test(controller): copri la modal e il banner del time out

Copre apertura modal con fetch di /spot/list (incluso il fallback di
rete), il vincolo squadra obbligatoria su Avvia, l'invio di
startTimeout/stopTimeout e il banner con countdown durante il time
out attivo.

tests/component/ControllerPage.test.js

@@ -1,6 +1,6 @@
 // @vitest-environment happy-dom
 import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest'
-import { mount } from '@vue/test-utils'
+import { mount, flushPromises } from '@vue/test-utils'
 import ControllerPage from '../../src/components/ControllerPage.vue'
 import { generaReferto } from '../../src/referto.js'
 
@@ -29,6 +29,10 @@ class MockWebSocket {
 
 vi.stubGlobal('WebSocket', MockWebSocket)
 
+// Mock di fetch per /spot/list (usato dalla modal time out).
+const fetchMock = vi.fn().mockResolvedValue({ json: async () => [] })
+vi.stubGlobal('fetch', fetchMock)
+
 // 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 })
@@ -287,6 +291,80 @@ describe('ControllerPage.vue', () => {
         })
     })
 
+    // =============================================
+    // TIME OUT
+    // =============================================
+    describe('Time Out', () => {
+        it('il click su Time Out apre la modal con l\'elenco dei video', async () => {
+            fetchMock.mockResolvedValueOnce({ json: async () => ['a.mp4', 'b.mp4'] })
+            const wrapper = mountController()
+            await wrapper.find('.btn-timeout').trigger('click')
+            await flushPromises()
+            expect(wrapper.vm.showTimeoutModal).toBe(true)
+            expect(wrapper.find('.dialog-timeout').exists()).toBe(true)
+            expect(wrapper.vm.spotList).toEqual(['a.mp4', 'b.mp4'])
+            // le opzioni sono i video più "Nessun video"
+            expect(wrapper.findAll('.timeout-video-option')).toHaveLength(3)
+        })
+
+        it('se /spot/list fallisce la modal si apre comunque senza video', async () => {
+            fetchMock.mockRejectedValueOnce(new Error('rete assente'))
+            const wrapper = mountController()
+            await wrapper.find('.btn-timeout').trigger('click')
+            await flushPromises()
+            expect(wrapper.vm.showTimeoutModal).toBe(true)
+            expect(wrapper.vm.spotList).toEqual([])
+        })
+
+        it('Avvia è disabilitato finché non si sceglie la squadra', async () => {
+            const wrapper = mountController()
+            await wrapper.find('.btn-timeout').trigger('click')
+            await flushPromises()
+            const avvia = wrapper.find('.dialog-timeout .btn-confirm')
+            expect(avvia.attributes('disabled')).toBeDefined()
+            await wrapper.find('.dialog-timeout .btn-set.home-bg').trigger('click')
+            expect(avvia.attributes('disabled')).toBeUndefined()
+        })
+
+        it('Avvia invia startTimeout con squadra e video e chiude la modal', async () => {
+            fetchMock.mockResolvedValueOnce({ json: async () => ['a.mp4'] })
+            const wrapper = mountController()
+            const spy = vi.spyOn(wrapper.vm, 'sendAction')
+            await wrapper.find('.btn-timeout').trigger('click')
+            await flushPromises()
+            await wrapper.find('.dialog-timeout .btn-set.guest-bg').trigger('click')
+            wrapper.vm.timeoutVideoSel = 'a.mp4'
+            await wrapper.find('.dialog-timeout .btn-confirm').trigger('click')
+            expect(spy).toHaveBeenCalledWith({ type: 'startTimeout', team: 'guest', video: 'a.mp4' })
+            expect(wrapper.vm.showTimeoutModal).toBe(false)
+        })
+
+        it('durante il time out il bottone invia stopTimeout', async () => {
+            const wrapper = mountController()
+            const spy = vi.spyOn(wrapper.vm, 'sendAction')
+            wrapper.vm.state.timeout = true
+            wrapper.vm.state.timeoutTeam = 'home'
+            await wrapper.vm.$nextTick()
+            await wrapper.find('.btn-timeout').trigger('click')
+            expect(spy).toHaveBeenCalledWith({ type: 'stopTimeout' })
+        })
+
+        it('durante il time out mostra banner con squadra e countdown', async () => {
+            const wrapper = mountController()
+            wrapper.vm.state.timeoutTeam = 'home'
+            wrapper.vm.state.timeoutStartedAt = Date.now() - 10000
+            wrapper.vm.state.timeout = true
+            await wrapper.vm.$nextTick()
+            const banner = wrapper.find('.timeout-banner')
+            expect(banner.exists()).toBe(true)
+            expect(banner.text()).toContain('TIME OUT')
+            expect(banner.text()).toContain('Antoniana')
+            expect(banner.text()).toContain('00:20')
+            // anche il bottone mostra il countdown
+            expect(wrapper.find('.btn-timeout').text()).toBe('00:20')
+        })
+    })
+
     // =============================================
     // BARRA CONNESSIONE
     // =============================================