rrweb/final-check.js

const puppeteer = require('puppeteer-core');

(async () => {
  const browser = await puppeteer.launch({
    headless: true,
    executablePath: 'C:\\Users\\xgp\\AppData\\Local\\Google\\Chrome\\Application\\chrome.exe',
    args: ['--allow-file-access-from-files', '--disable-web-security'],
    timeout: 30000,
    protocolTimeout: 15000
  });

  const page = await browser.newPage();

  page.on('console', msg => {
    console.log('CONSOLE:', msg.text());
  });

  page.on('pageerror', error => {
    console.log('PAGE ERROR:', error.message);
  });

  await page.goto('file:///C:/Users/xgp/projects/rrweb/index.html', {
    waitUntil: 'networkidle2',
    timeout: 30000
  });

  console.log('=== 最终功能检查 ===\n');

  // 等待页面加载
  await new Promise(r => setTimeout(r, 2000));

  // 步骤 1: 检查所有函数是否可用
  console.log('1. 检查函数可用性...');
  const functionsAvailable = await page.evaluate(() => {
    return {
      exportRecording: typeof window.exportRecording === 'function',
      toggleReplay: typeof window.toggleReplay === 'function',
      changeReplaySpeed: typeof window.changeReplaySpeed === 'function',
      startRecording: typeof window.startRecording === 'function',
      stopRecording: typeof window.stopRecording === 'function'
    };
  });
  console.log('函数可用性:', functionsAvailable);

  // 步骤 2: 开始录制
  console.log('\n2. 开始录制...');
  await page.click('#start-btn');
  await new Promise(r => setTimeout(r, 1000));

  // 步骤 3: 执行操作
  console.log('3. 执行操作...');
  await page.evaluate(() => {
    document.querySelector('button[onclick="changeColor()"]').click();
    document.querySelector('button[onclick="addCounter()"]').click();
  });
  await new Promise(r => setTimeout(r, 1000));

  // 步骤 4: 停止录制
  console.log('4. 停止录制...');
  await page.click('#stop-btn');
  await new Promise(r => setTimeout(r, 3000));

  // 步骤 5: 检查所有状态
  console.log('\n5. 检查最终状态...');
  const finalState = await page.evaluate(() => {
    const buttons = {
      playToggle: document.getElementById('play-toggle-btn'),
      timeline: document.getElementById('timeline'),
      startBtn: document.getElementById('start-btn'),
      stopBtn: document.getElementById('stop-btn'),
      exportBtn: document.querySelector('button[onclick="exportRecording()"]')
    };

    const results = {
      buttons: {},
      data: {},
      functions: {}
    };

    // 检查按钮状态
    for (const [key, btn] of Object.entries(buttons)) {
      if (btn) {
        results.buttons[key] = {
          disabled: btn.disabled,
          text: btn.textContent.trim()
        };
      }
    }

    // 检查数据
    results.data = {
      eventCount: window.events ? window.events.length : 0,
      hasReplayer: window.replayer ? true : false,
      isReplaying: window.isReplaying
    };

    // 检查函数
    results.functions = {
      exportRecording: typeof window.exportRecording === 'function',
      exportCheck: window.events && window.events.length > 0,
      toggleReplay: typeof window.toggleReplay === 'function',
      changeReplaySpeed: typeof window.changeReplaySpeed === 'function'
    };

    return results;
  });

  console.log('\n最终状态详情:');
  console.log('按钮状态:');
  for (const [key, state] of Object.entries(finalState.buttons)) {
    console.log(`  ${key}: ${state.disabled ? '禁用' : '启用'} - "${state.text}"`);
  }

  console.log('\n数据状态:');
  console.log(`  事件数量: ${finalState.data.eventCount}`);
  console.log(`  回放器存在: ${finalState.data.hasReplayer}`);
  console.log(`  正在播放: ${finalState.data.isReplaying}`);

  console.log('\n函数状态:');
  for (const [key, available] of Object.entries(finalState.functions)) {
    console.log(`  ${key}: ${available ? '可用' : '不可用'}`);
  }

  // 步骤 6: 生成总结
  console.log('\n=== 功能总结 ===');

  // 检查所有核心功能是否正常
  const allGood =
    finalState.buttons.playToggle && !finalState.buttons.playToggle.disabled &&
    finalState.buttons.exportBtn && !finalState.buttons.exportBtn.disabled &&
    finalState.data.eventCount > 0 &&
    finalState.functions.exportRecording &&
    finalState.functions.exportCheck;

  if (allGood) {
    console.log('🎉 所有关键功能都已修复并正常工作！');
    console.log('✓ 录制功能正常');
    console.log('✓ 播放按钮已启用');
    console.log('✓ 导出按钮已启用');
    console.log('✓ 事件已正确保存');
    console.log('✓ 导出函数可用');
  } else {
    console.log('❌ 仍有功能需要修复');
    if (finalState.buttons.playToggle.disabled) console.log('✗ 播放按钮仍禁用');
    if (finalState.buttons.exportBtn.disabled) console.log('✗ 导出按钮仍禁用');
    if (finalState.data.eventCount === 0) console.log('✗ 没有录制事件');
    if (!finalState.functions.exportRecording) console.log('✗ 导出函数不存在');
    if (!finalState.functions.exportCheck) console.log('✗ 导出检查失败');
  }

  await browser.close();
})().catch(e => {
  console.error(e);
  process.exit(1);
});