Show HN: 我做了一个平台,可以通过可视化方式调试 Puppeteer (JS) 崩溃问题
该文章介绍了一个名为 Buglesstack 的平台,用于可视化调试 Puppeteer 崩溃问题,旨在加速生产环境的调试。Buglesstack 提供即时可视化的崩溃信息,包括页面预览、HTML 内容等,帮助用户快速定位和解决问题。文章展示了如何通过代码集成 Buglesstack,捕获错误信息并发送到平台。Buglesstack 处于 Beta 阶段,鼓励用户体验。
重要提示:Buglesstack 处于 Beta 开发阶段。 欢迎成为我们的首批用户!
Buglesstack Documentation Blog Pricing Login
告别数天的 pptr 崩溃调试
通过即时可视化的 Puppeteer 崩溃信息,加速生产环境的调试。
pptr-automation.js
try{
await page.goto('https://www.google.com/search?q=puppeteer');
await page.waitForSelector('[name="q"]');
}
catch(error){
// 准备 Buglesstack 数据
const buglesstackData ={
url: page.url(),
screenshot:await page.screenshot({encoding:'base64'}),
html:await page.content(),
metadata:{},
message: error.message,
stack: error.stack
};
// 从 https://app.buglesstack.com 获取你的 access token
constACCESS_TOKEN='HERE_YOUR_ACCESS_TOKEN';
// 发送错误到 Buglesstack
await axios.post('https://app.buglesstack.com/api/v1/crashes', buglesstackData,{
headers:{
Authorization:`Bearer ${ACCESS_TOKEN}`,
'Content-Type':'application/json'
}
});
// 重新抛出错误以传播它
throw error;
}
说实话,你已经厌倦了这样:
有更好的方法 ↓
来看一看
查看页面预览,了解失败时发生了什么。
调试内容
Buglesstack 自动保存页面的 HTML 内容以供调试。
很简单
安装和调试
确定 Bug
检查页面上的内容,而不是你期望的内容。
减少调试时间
在找到错误的那一刻解决它。