I got tired of reading CSS bugs in a tiny overlay, so I made my debugger print a report
说明与用途
BeeLadybug 的 exportReport 将所有调试数据合并为单个可读报告,简化 CSS 错误排查。
问题
The debug overlay was too small to read comfortably and too large to avoid covering the page, making CSS bug inspection tedious.
结果
The new exportReport feature consolidates all debug data into a single, readable report, improving debugging efficiency and revealing bugs in the debugger itself.
工作流
- 1. Install bee‑ladybug via npm or load via CDN in console.
- 2. Create BeeLadybugCore instance and attach adapters (e.g., WebDOMAdapter, CSSAdapter).
- 3. Call exportReport(bee, {format:'html'}) or press F8 to trigger export.
- 4. The function gathers snapshots from each adapter, compiles rows, and downloads report-YYYYMMDD-HHMM.html.
- 5. Optionally open the file, press Ctrl+P to print PDF, or parse JSON/CSV output.
证据
Press F8, or the EXPORT button, and you get report-YYYYMMDD-HHMM.html
It’s plain HTML with a dark theme. Ctrl+P turns it into a PDF. You can also get json (for CI or an AI agent) or csv (for a spreadsheet).
In headless mode (ui: false) nothing is downloaded. The function just returns the data, so it works in Node and in bots too.
- 记录日期: 2026-10-26T23:11:16.512Z