feat: enhance web extension with export functionality and utility improvements

- Add export functionality to SessionList and Player pages
- Add new utility modules: dataOperations, format, path, settings
- Update manifest with export and download permissions
- Enhance storage utility with new data operations
- Add various test scripts and documentation files

check-after-record.js

@@ -0,0 +1,90 @@
+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']
+  });
+
+  const page = await browser.newPage();
+
+  await page.goto('file:///C:/Users/xgp/projects/rrweb/index.html', {
+    waitUntil: 'networkidle2',
+    timeout: 120000
+  });
+
+  await new Promise(r => setTimeout(r, 2000));
+
+  // Step 1: Start recording
+  console.log('1. Starting recording...');
+  await page.click('#start-btn');
+  await new Promise(r => setTimeout(r, 1000));
+
+  // Step 2: Perform actions
+  console.log('2. Performing actions...');
+  await page.evaluate(() => {
+    document.querySelector('button[onclick="changeColor()"]').click();
+    document.querySelector('button[onclick="addCounter()"]').click();
+  });
+  await new Promise(r => setTimeout(r, 1000));
+
+  // Step 3: Stop recording
+  console.log('3. Stopping recording...');
+  await page.click('#stop-btn');
+  await new Promise(r => setTimeout(r, 3000)); // Wait longer for replay to initialize
+
+  // Step 4: Check state after recording
+  console.log('4. Checking state after recording...');
+  const afterRecordState = await page.evaluate(() => {
+    const playBtn = document.getElementById('play-toggle-btn');
+    const timeline = document.getElementById('timeline');
+    const speedBtns = document.querySelectorAll('.speed-controls button');
+    const exportBtn = document.querySelector('button[onclick="exportRecording()"]');
+    const replayContainer = document.getElementById('replayer');
+    const events = window.events || [];
+
+    return {
+      status: document.getElementById('status-bar').textContent,
+      playBtnDisabled: playBtn ? playBtn.disabled : null,
+      playBtnText: playBtn ? playBtn.textContent : null,
+      timelineDisabled: timeline ? timeline.disabled : null,
+      timelineMax: timeline ? timeline.max : null,
+      timelineValue: timeline ? timeline.value : null,
+      speedBtnsDisabled: Array.from(speedBtns).map(btn => btn.disabled),
+      exportBtnDisabled: exportBtn ? exportBtn.disabled : null,
+      eventCount: events.length,
+      replayChildren: replayContainer ? replayContainer.children.length : 0,
+      hasIframe: replayContainer ? !!replayContainer.querySelector('iframe') : false
+    };
+  });
+
+  console.log('After Recording State:', JSON.stringify(afterRecordState, null, 2));
+
+  // Step 5: Test if we can click buttons
+  console.log('\n5. Testing button clicks...');
+
+  if (afterRecordState.playBtnDisabled === false) {
+    console.log('✓ Play button enabled, testing click...');
+    await page.click('#play-toggle-btn');
+    await new Promise(r => setTimeout(r, 1000));
+  } else {
+    console.log('✗ Play button still disabled');
+  }
+
+  if (afterRecordState.exportBtnDisabled === false) {
+    console.log('✓ Export button enabled, testing click...');
+    // Just check if the function exists without triggering download
+    const exportWorks = await page.evaluate(() => {
+      return typeof window.exportRecording === 'function' && window.events.length > 0;
+    });
+    console.log('✓ Export function exists and has data:', exportWorks);
+  } else {
+    console.log('✗ Export button still disabled');
+  }
+
+  await browser.close();
+})().catch(e => {
+  console.error(e);
+  process.exit(1);
+});