Initial commit: Telegram Management System
Some checks failed
Deploy / deploy (push) Has been cancelled
Some checks failed
Deploy / deploy (push) Has been cancelled
Full-stack web application for Telegram management - Frontend: Vue 3 + Vben Admin - Backend: NestJS - Features: User management, group broadcast, statistics 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
你的用户名
204
test-vben-diagnostic.cjs
Normal file
204
test-vben-diagnostic.cjs
Normal file
@@ -0,0 +1,204 @@
|
||||
const { chromium } = require('playwright');
|
||||
|
||||
async function runDiagnosticTest() {
|
||||
const browser = await chromium.launch({
|
||||
headless: false,
|
||||
slowMo: 300
|
||||
});
|
||||
|
||||
const context = await browser.newContext({
|
||||
viewport: { width: 1920, height: 1080 }
|
||||
});
|
||||
|
||||
const page = await context.newPage();
|
||||
|
||||
// 监听控制台消息
|
||||
const consoleMessages = [];
|
||||
page.on('console', msg => {
|
||||
consoleMessages.push({
|
||||
type: msg.type(),
|
||||
text: msg.text(),
|
||||
location: msg.location()
|
||||
});
|
||||
});
|
||||
|
||||
// 监听页面错误
|
||||
const pageErrors = [];
|
||||
page.on('pageerror', error => {
|
||||
pageErrors.push({
|
||||
message: error.message,
|
||||
stack: error.stack
|
||||
});
|
||||
});
|
||||
|
||||
// 监听网络请求
|
||||
const networkRequests = [];
|
||||
page.on('request', request => {
|
||||
networkRequests.push({
|
||||
url: request.url(),
|
||||
method: request.method(),
|
||||
resourceType: request.resourceType()
|
||||
});
|
||||
});
|
||||
|
||||
const failedRequests = [];
|
||||
page.on('requestfailed', request => {
|
||||
failedRequests.push({
|
||||
url: request.url(),
|
||||
error: request.failure().errorText
|
||||
});
|
||||
});
|
||||
|
||||
try {
|
||||
console.log('=== Vben Frontend 诊断测试 ===\n');
|
||||
|
||||
// 1. 访问首页
|
||||
console.log('1. 访问首页...');
|
||||
await page.goto('http://localhost:5174/', {
|
||||
waitUntil: 'domcontentloaded',
|
||||
timeout: 30000
|
||||
});
|
||||
|
||||
// 等待应用加载
|
||||
console.log('2. 等待应用加载...');
|
||||
await page.waitForTimeout(5000);
|
||||
|
||||
// 检查页面状态
|
||||
console.log('\n3. 页面状态检查：');
|
||||
|
||||
// 检查 Vue 应用是否挂载
|
||||
const appMounted = await page.evaluate(() => {
|
||||
const app = document.querySelector('#app');
|
||||
return {
|
||||
exists: !!app,
|
||||
hasChildren: app ? app.children.length > 0 : false,
|
||||
innerHTML: app ? app.innerHTML.substring(0, 200) : null
|
||||
};
|
||||
});
|
||||
console.log('- Vue 应用挂载点:', appMounted);
|
||||
|
||||
// 检查是否有任何可见内容
|
||||
const visibleContent = await page.evaluate(() => {
|
||||
const body = document.body;
|
||||
return {
|
||||
textContent: body.textContent.trim().substring(0, 200),
|
||||
childElementCount: body.childElementCount
|
||||
};
|
||||
});
|
||||
console.log('- 页面可见内容:', visibleContent);
|
||||
|
||||
// 检查是否在登录页面
|
||||
const loginElements = await page.evaluate(() => {
|
||||
const forms = document.querySelectorAll('form');
|
||||
const inputs = document.querySelectorAll('input');
|
||||
const buttons = document.querySelectorAll('button');
|
||||
|
||||
return {
|
||||
formCount: forms.length,
|
||||
inputCount: inputs.length,
|
||||
buttonCount: buttons.length,
|
||||
hasPasswordInput: !!document.querySelector('input[type="password"]'),
|
||||
hasSubmitButton: !!document.querySelector('button[type="submit"]')
|
||||
};
|
||||
});
|
||||
console.log('- 登录元素检查:', loginElements);
|
||||
|
||||
// 4. 尝试直接访问登录路由
|
||||
console.log('\n4. 尝试访问登录路由...');
|
||||
await page.goto('http://localhost:5174/login', { waitUntil: 'domcontentloaded' });
|
||||
await page.waitForTimeout(3000);
|
||||
await page.screenshot({ path: 'test-screenshots/diagnostic-login-route.png' });
|
||||
|
||||
// 再次检查登录元素
|
||||
const loginRouteElements = await page.evaluate(() => {
|
||||
return {
|
||||
url: window.location.href,
|
||||
hasLoginForm: !!document.querySelector('form'),
|
||||
inputElements: Array.from(document.querySelectorAll('input')).map(input => ({
|
||||
type: input.type,
|
||||
placeholder: input.placeholder,
|
||||
name: input.name,
|
||||
id: input.id
|
||||
}))
|
||||
};
|
||||
});
|
||||
console.log('- 登录路由元素:', JSON.stringify(loginRouteElements, null, 2));
|
||||
|
||||
// 5. 检查 API 配置
|
||||
console.log('\n5. 检查 API 配置...');
|
||||
const apiConfig = await page.evaluate(() => {
|
||||
// 尝试获取任何全局配置
|
||||
return {
|
||||
windowConfig: window._VBEN_ADMIN_PRO_APP_CONF_ || null,
|
||||
location: window.location.href
|
||||
};
|
||||
});
|
||||
console.log('- API 配置:', apiConfig);
|
||||
|
||||
// 6. 尝试手动触发登录
|
||||
console.log('\n6. 尝试查找任何形式的登录入口...');
|
||||
const possibleLoginSelectors = [
|
||||
'input[type="text"]',
|
||||
'input[type="email"]',
|
||||
'input[placeholder*="user" i]',
|
||||
'input[placeholder*="账" i]',
|
||||
'input[placeholder*="admin" i]',
|
||||
'input:not([type="hidden"])'
|
||||
];
|
||||
|
||||
for (const selector of possibleLoginSelectors) {
|
||||
const element = await page.locator(selector).first();
|
||||
if (await element.isVisible().catch(() => false)) {
|
||||
console.log(` 找到输入框: ${selector}`);
|
||||
const attributes = await element.evaluate(el => ({
|
||||
type: el.type,
|
||||
placeholder: el.placeholder,
|
||||
name: el.name,
|
||||
id: el.id
|
||||
}));
|
||||
console.log(' 属性:', attributes);
|
||||
}
|
||||
}
|
||||
|
||||
// 7. 输出诊断信息
|
||||
console.log('\n=== 诊断信息汇总 ===');
|
||||
console.log(`\n控制台消息 (${consoleMessages.length} 条):`);
|
||||
consoleMessages.forEach(msg => {
|
||||
if (msg.type === 'error' || msg.type === 'warning') {
|
||||
console.log(` [${msg.type}] ${msg.text}`);
|
||||
}
|
||||
});
|
||||
|
||||
console.log(`\n页面错误 (${pageErrors.length} 条):`);
|
||||
pageErrors.forEach(error => {
|
||||
console.log(` ${error.message}`);
|
||||
});
|
||||
|
||||
console.log(`\n失败的请求 (${failedRequests.length} 条):`);
|
||||
failedRequests.forEach(req => {
|
||||
console.log(` ${req.url}: ${req.error}`);
|
||||
});
|
||||
|
||||
console.log(`\n网络请求统计:`);
|
||||
const requestTypes = {};
|
||||
networkRequests.forEach(req => {
|
||||
requestTypes[req.resourceType] = (requestTypes[req.resourceType] || 0) + 1;
|
||||
});
|
||||
Object.entries(requestTypes).forEach(([type, count]) => {
|
||||
console.log(` ${type}: ${count}`);
|
||||
});
|
||||
|
||||
// 保存页面 HTML
|
||||
const pageHTML = await page.content();
|
||||
require('fs').writeFileSync('test-screenshots/diagnostic-page.html', pageHTML);
|
||||
console.log('\n页面 HTML 已保存到 diagnostic-page.html');
|
||||
|
||||
} catch (error) {
|
||||
console.error('诊断过程中发生错误:', error);
|
||||
} finally {
|
||||
await browser.close();
|
||||
}
|
||||
}
|
||||
|
||||
// 运行诊断
|
||||
runDiagnosticTest().catch(console.error);
|
||||
Reference in New Issue
Block a user