import { chromium } from '@playwright/test';

const browser = await chromium.launch();
const page = await browser.newPage();

try {
  console.log('🧪 최종 테스트: Settings 페이지 로딩 인디케이터');
  console.log('');

  // 로그인
  await page.goto('http://178.104.200.7/taxbaik/admin/login', { waitUntil: 'networkidle' });
  await page.fill('input[placeholder="사용자명"]', 'test_admin');
  await page.fill('input[placeholder="비밀번호"]', 'TestAdmin@123456');
  await page.click('button:has-text("로그인")');
  await page.waitForURL(/\/taxbaik\/admin\/dashboard$/);
  console.log('✅ 로그인 성공');

  // Settings 페이지로 이동
  console.log('📍 Settings 페이지로 이동...');
  await page.goto('http://178.104.200.7/taxbaik/admin/settings', { waitUntil: 'domcontentloaded' });

  // 로딩 인디케이터 상태 확인
  console.log('');
  console.log('⏱️ 로딩 상태 모니터링:');
  
  for (let i = 1; i <= 5; i++) {
    await page.waitForTimeout(500);
    
    const loadingVisible = await page.locator('#blazor-loading.show').isVisible().catch(() => false);
    const mudCount = await page.locator('[class*="mud-"]').count();
    const formElements = await page.locator('input, .admin-section-header').count();
    
    console.log(`  ${i}초: Loading=${loadingVisible ? '보임' : '안보임'}, Mud=${mudCount}, Form=${formElements}`);
    
    if (!loadingVisible && mudCount > 20) {
      console.log('');
      console.log('✅ 로딩 인디케이터 정상 작동!');
      console.log('   → 페이지 로드 중: 스피너 표시');
      console.log('   → 페이지 완료: 스피너 숨김');
      break;
    }
  }

  // 스크린샷
  await page.screenshot({ path: 'settings-final.png' });
  console.log('✅ 스크린샷 저장: settings-final.png');
  
} catch (error) {
  console.error('❌ 오류:', error.message);
}

await browser.close();