#!/usr/bin/env python3 """JavaScript 디버깅을 위한 Playwright 테스트""" import asyncio from playwright.async_api import async_playwright async def debug_herb_info(): async with async_playwright() as p: browser = await p.chromium.launch(headless=True) page = await browser.new_page() # 콘솔 메시지 캡처 console_messages = [] page.on("console", lambda msg: console_messages.append({ "type": msg.type, "text": msg.text, "args": msg.args })) # 네트워크 요청 캡처 network_requests = [] page.on("request", lambda req: network_requests.append({ "url": req.url, "method": req.method })) # 네트워크 응답 캡처 network_responses = [] async def log_response(response): if "/api/" in response.url: try: body = await response.text() network_responses.append({ "url": response.url, "status": response.status, "body": body[:200] if body else None }) except: pass page.on("response", log_response) try: # 페이지 접속 print("페이지 접속 중...") await page.goto("http://localhost:5001") await page.wait_for_load_state("networkidle") # JavaScript 실행하여 직접 함수 호출 print("\n직접 JavaScript 함수 테스트...") # loadHerbInfo 함수 존재 확인 has_function = await page.evaluate("typeof loadHerbInfo === 'function'") print(f"1. loadHerbInfo 함수 존재: {has_function}") # loadAllHerbsInfo 함수 존재 확인 has_all_herbs = await page.evaluate("typeof loadAllHerbsInfo === 'function'") print(f"2. loadAllHerbsInfo 함수 존재: {has_all_herbs}") # displayHerbCards 함수 존재 확인 has_display = await page.evaluate("typeof displayHerbCards === 'function'") print(f"3. displayHerbCards 함수 존재: {has_display}") # 약재 정보 페이지로 이동 await page.click('a[data-page="herb-info"]') await page.wait_for_timeout(2000) # herbInfoGrid 요소 확인 grid_exists = await page.evaluate("document.getElementById('herbInfoGrid') !== null") print(f"4. herbInfoGrid 요소 존재: {grid_exists}") # herbInfoGrid 내용 확인 grid_html = await page.evaluate("document.getElementById('herbInfoGrid')?.innerHTML || 'EMPTY'") print(f"5. herbInfoGrid 내용 길이: {len(grid_html)} 문자") if grid_html and grid_html != 'EMPTY': print(f" 처음 100자: {grid_html[:100]}...") # API 호출 직접 테스트 print("\n\nAPI 응답 직접 테스트...") api_response = await page.evaluate(""" fetch('/api/herbs/masters') .then(res => res.json()) .then(data => ({ success: data.success, dataLength: data.data ? data.data.length : 0, firstItem: data.data ? data.data[0] : null })) .catch(err => ({ error: err.toString() })) """) print(f"API 응답: {api_response}") # displayHerbCards 직접 호출 테스트 if api_response.get('dataLength', 0) > 0: print("\n\ndisplayHerbCards 직접 호출...") await page.evaluate(""" fetch('/api/herbs/masters') .then(res => res.json()) .then(data => { if (typeof displayHerbCards === 'function') { displayHerbCards(data.data); } else { console.error('displayHerbCards 함수가 없습니다'); } }) """) await page.wait_for_timeout(1000) # 다시 확인 grid_html_after = await page.evaluate("document.getElementById('herbInfoGrid')?.innerHTML || 'EMPTY'") print(f"displayHerbCards 호출 후 내용 길이: {len(grid_html_after)} 문자") card_count = await page.evaluate("document.querySelectorAll('.herb-card').length") print(f"herb-card 요소 개수: {card_count}") # 콘솔 메시지 출력 print("\n\n=== 콘솔 메시지 ===") for msg in console_messages: if 'error' in msg['type'].lower(): print(f"❌ {msg['type']}: {msg['text']}") else: print(f"📝 {msg['type']}: {msg['text']}") # API 응답 상태 확인 print("\n\n=== API 응답 ===") for resp in network_responses: if '/api/herbs/masters' in resp['url']: print(f"URL: {resp['url']}") print(f"상태: {resp['status']}") print(f"응답: {resp['body'][:100] if resp['body'] else 'No body'}") finally: await browser.close() if __name__ == "__main__": asyncio.run(debug_herb_info())