Browse Source

✨ feat(debug): add automated login and page debugging script

- 创建debug-page.js文件,实现自动化登录和页面调试功能
- 添加页面错误和控制台日志捕获
- 实现登录流程自动化:导航到登录页、填写凭证、点击登录按钮
- 添加页面加载状态检查和等待机制
- 实现用户管理页面访问和元素检查功能
- 输出页面标题、按钮和内容等关键信息用于调试
yourname 2 months ago
parent
commit
d3317bf939
1 changed files with 83 additions and 0 deletions
  1. 83 0
      debug-page.js

+ 83 - 0
debug-page.js

@@ -0,0 +1,83 @@
+import { chromium } from '@playwright/test';
+
+async function debugPage() {
+  const browser = await chromium.launch({ headless: true });
+  const page = await browser.newPage();
+
+  // 捕获页面错误
+  page.on('console', msg => {
+    console.log(`页面控制台: ${msg.type()} ${msg.text()}`);
+  });
+
+  page.on('pageerror', error => {
+    console.log(`页面错误: ${error.message}`);
+  });
+
+  try {
+    console.log('导航到登录页面...');
+    await page.goto('http://localhost:8080/admin/login');
+
+    console.log('填写登录信息...');
+    await page.getByPlaceholder('请输入用户名').fill('admin');
+    await page.getByPlaceholder('请输入密码').fill('admin123');
+
+    console.log('点击登录按钮...');
+    await page.getByRole('button', { name: '登录' }).click();
+
+    console.log('等待登录完成...');
+    await page.waitForLoadState('networkidle');
+
+    // 等待更长时间确保页面完全加载
+    await page.waitForTimeout(5000);
+
+    // 检查页面是否完全加载
+    const loadingIndicator = await page.locator('text=Loading...').count();
+    console.log('Loading指示器数量:', loadingIndicator);
+
+    if (loadingIndicator > 0) {
+      console.log('页面仍在加载,等待更多时间...');
+      await page.waitForTimeout(3000);
+    }
+
+    console.log('当前URL:', page.url());
+    console.log('页面标题:', await page.title());
+
+    // 尝试直接访问用户管理页面
+    console.log('尝试直接访问用户管理页面...');
+    await page.goto('http://localhost:8080/admin/users');
+    await page.waitForLoadState('networkidle');
+    await page.waitForTimeout(5000);
+
+    console.log('用户管理页面URL:', page.url());
+    console.log('用户管理页面标题:', await page.title());
+
+    // 检查用户管理页面元素
+    const headings = await page.getByRole('heading').all();
+    console.log('页面标题数量:', headings.length);
+
+    for (let i = 0; i < headings.length; i++) {
+      const text = await headings[i].textContent();
+      console.log(`标题 ${i}:`, text);
+    }
+
+    // 检查按钮
+    const buttons = await page.getByRole('button').all();
+    console.log('按钮数量:', buttons.length);
+
+    for (let i = 0; i < Math.min(buttons.length, 10); i++) {
+      const text = await buttons[i].textContent();
+      console.log(`按钮 ${i}:`, text);
+    }
+
+    // 检查页面内容
+    const bodyText = await page.textContent('body');
+    console.log('页面内容前500字符:', bodyText.substring(0, 500));
+
+  } catch (error) {
+    console.error('调试出错:', error);
+  } finally {
+    await browser.close();
+  }
+}
+
+debugPage();