import os
import json
from src.browser.controller import BrowserController

def debug_sidebar():
    browser = BrowserController(headless=False)
    try:
        browser.start()
        browser.goto('http://47.99.105.253:8084')
        browser.wait(2000)
        
        # Login
        print("Logging in...")
        browser.page.locator('input[placeholder*="用户名"]').fill('admin')
        browser.page.locator('input[type="password"]').fill('password')
        browser.page.locator('button:has-text("登录")').click()
        browser.wait(5000)
        
        print(f"Current URL: {browser.page.url}")
        
        # Capture sidebar structure
        sidebar_data = browser.page.evaluate('''() => {
            const getInfo = (el) => {
                const rect = el.getBoundingClientRect();
                return {
                    tag: el.tagName,
                    text: el.innerText.split('\\n')[0].trim(),
                    classes: el.className,
                    visible: rect.width > 0 && rect.height > 0,
                    rect: { x: rect.left, y: rect.top, w: rect.width, h: rect.height }
                };
            };
            
            // Look for ant-menu or aside
            const sidebar = document.querySelector('.ant-layout-sider, aside, .ant-menu');
            if (!sidebar) return "Sidebar not found";
            
            const items = Array.from(sidebar.querySelectorAll('.ant-menu-item, .ant-menu-submenu-title, a, button'));
            return items.map(getInfo);
        }''')
        
        print("\nSidebar Elements Found:")
        if isinstance(sidebar_data, list):
            for item in sidebar_data:
                print(f"- [{item['tag']}] {item['text']} | Visible: {item['visible']} | Classes: {item['classes']}")
        else:
            print(sidebar_data)
            
    finally:
        browser.close()

if __name__ == "__main__":
    debug_sidebar()