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