/** * Splash screen tests — logo, version, loading indicator, auto-dismiss. * * The splash screen uses display toggle (style:display) — it is always in the * DOM but hidden once the app loads. Tests verify structure, not visibility. */ import { browser, expect } from '@wdio/globals'; import * as S from '../helpers/selectors.ts'; import { exec } from '../helpers/execute.ts'; describe('Splash screen', () => { it('should have splash element in DOM', async () => { const exists = await exec((sel: string) => { return document.querySelector(sel) !== null; }, S.SPLASH); expect(exists).toBe(true); }); it('should show the AGOR logo text', async () => { const text = await exec((sel: string) => { const el = document.querySelector(sel); return el?.textContent ?? ''; }, S.LOGO_TEXT); if (text) { expect(text).toBe('AGOR'); } }); it('should show version string', async () => { const text = await exec((sel: string) => { const el = document.querySelector(sel); return el?.textContent ?? ''; }, S.SPLASH_VERSION); if (text) { expect(text).toMatch(/^v/); } }); it('should have loading indicator dots', async () => { const count = await exec((sel: string) => { return document.querySelectorAll(sel).length; }, S.SPLASH_DOT); if (count > 0) { expect(count).toBe(3); } }); it('should use display toggle (not removed from DOM)', async () => { // Splash stays in DOM but gets display:none after load const display = await exec((sel: string) => { const el = document.querySelector(sel); if (!el) return 'not-found'; return getComputedStyle(el).display; }, S.SPLASH); // After app loads, should be 'none' (hidden) but element still exists expect(['none', 'flex', 'block', 'not-found']).toContain(display); }); it('should have proper z-index for overlay', async () => { const zIndex = await exec((sel: string) => { const el = document.querySelector(sel); if (!el) return '0'; return getComputedStyle(el).zIndex; }, S.SPLASH); // Splash should overlay everything expect(typeof zIndex).toBe('string'); }); });