前端开发利器 Web Replay

前端开发人员收到测试发来的 bug 后,通常比较头疼复现的问题。
即使测试人员录了视频,照着一步步操作也不一定能复现,例如bug是与当时的数据相关的。

为了解决这个问题,Firefox 推出了一个重磅新功能:web reply。
看名字就知道它的功能是“页面回放”,这个回放可不是像录屏一样,而是完全真实的回放:
JavaScript、DOM、CSS 的行为都完全像录制时一样重播。

而且在重放时,你可以随意检查页面上的各种元素、查看 console 日志、断点调试。
想象一下,测试把页面过程录下来,发给前端,前端导入进行回放,随意的调试,这是多么的高效。


就像时间旅行一样,所以对于前端本地开发,或者bug修复,是极其便利的。
目前是测试版,只支持 MacOS,官方说等稳定后才会支持跨平台。
想体验的话需要下载 nightly 版本,下载地址:
https://www.mozilla.org/zh-CN/firefox/channel/desktop/#nightly
我体验了一下,不稳定,非常消耗内存,将近700M。
期待正式发布,到时将会大幅提升前端开发效率。
快点通知你的前端小伙伴吧,早点了解一下这个很酷的功能。
项目地址:

前端开发利器 Web Replay的更多相关文章
- 前端开发利器—FIDDLER 转
http://www.cnblogs.com/yuzhongwusan/archive/2012/07/20/2601306.html 前端开发利器—FIDDLER 1.Fiddler相对其他调试工具 ...
- 前端开发利器-Brackets IDE
是什么? http://brackets.io/ A modern, open source text editor that understands web design. 现代, 开源的文本编辑器 ...
- 移动前端开发和 Web 前端开发的区别
http://www.itcast.cn/news/20180125/16033584753.shtml 1,普通PC端开发与移动端开发区别. 先说背景,我大言不惭的说一下,我pc端的前端开发干了有快 ...
- 移动前端开发和 Web 前端开发的区别是什么
可以分成两部分理解1.服务器端开发,也叫后台开发,这是唯一的,对应不同的平台,他负责数据的分发与存储,和一些逻辑的处理.逻辑处理的多少由业务的复杂程度决定.服务端相对独立,与平台没啥关系. 2..1中 ...
- 前端开发利器 Emmet 介绍与基础语法教程
在前端开发的过程中,编写 HTML.CSS 代码始终占据了很大的工作比例.特别是手动编写 HTML 代码,效率特别低下,因为需要敲打各种“尖括号”.闭合标签等.而现在 Emmet 就是为了提高代码编写 ...
- [转] 前端开发利器--Brackets 的七种武器和旁门左道
转自:http://www.jianshu.com/p/ff7798aa4548 Brackets是Adobe开发的web编辑器,是一款免费开源.多平台支持的软件,并在于GitHub上维护.Brack ...
- 前端开发利器 Sublime Text 3 使用技巧和总结笔记
这篇文章是本人在使用该工具进行前端开发的自我总结,思路也许不是很清楚,不过还是希望对读者的你有所帮助,千万别把这边文章收藏起来发霉哦,无论背多少次快捷键,还不及自己多实际操作几次. 目前官方版正式版 ...
- 葡萄城首席架构师:前端开发与Web表格控件技术解读
讲师:Issam Elbaytam,葡萄城集团全球首席架构师(Chief Software Architect of GrapeCity Global).曾任 Data Dynamics.Inc 创始 ...
- 前端开发利器webStorm
这里推荐一个前端开发工具webStorm.用了大概快半年了,发现所有其他工具无出其右的.目前最新版本已经到4.0.2,半年前还是2.X 相比aptana.dreamweaver.sublime和vim ...
随机推荐
- 闲来无事写一个jquery计算器,没有进行封装......
<!doctype html> <html> <head> <meta charset="utf-8" /> <title&g ...
- Weblogic/WAS之Full GC监控与计算
在网上看到关于内存回收机制,同大家一起分析探讨.堆内存划分为Eden.Survivor 和 Tenured/Old 空间,如下图所示: Minor GC 会清理年轻代的内存,Major GC 是清理老 ...
- spring的69个问题
1.什么是Spring? Spring是一个开源的Java EE开发框架.Spring框架的核心功能可以应用在任何Java应用程序中,但对Java EE平台上的Web应用程序有更好的扩展性.Sprin ...
- git 上传当前分支
因为我现在的分支是的名很长,每次需要上次当前分支需要写很多代码,是不是有很简单方法上传当前分支. 如果要上传一个分支到仓库 origin 那么就需要使用下面的命令 git push origin 分支 ...
- clickhouse创建视图SQL 错误 [47]: ClickHouse exception, code: 47
使用clickhouse创建视图时报错 SQL 错误 [47]: ClickHouse exception, code: 47, host: localhost, port: 8123; Code: ...
- 驾驭git merge——git merge的规范化操作
这两天负责将一个开发了较长时间,代码量数万行的C语言项目(A项目)的代码分支合并到主线.由于之前参与过一些其他项目分支收编时采用git merge引入问题的修改,个人从心理上对git merge有所抵 ...
- mysql主从之binlog的工作模式
一 三种模式介绍 1.1 查看mysql主库的binlog格式 binlog仅在主库设置即可,从库无需设置 binlog的默认方式为STATEMENT ( show variables like '% ...
- 【题解】Comet OJ 国庆欢乐赛 简要题解
[题解]Comet OJ 国庆欢乐赛 简要题解 A 直接做 B 直接做,结论: \[ ans=\max([Max\ge \mathrm{sum}] Max,s[n]/2) \] C 考虑这样一个做法: ...
- 爬虫 -- JS调试
开发者工具(F12) 其中常用的有Elements(元素面板).Console(控制台面板).Sources(源代码面板).Network(网络面板) 找 JS 文件的几种方法 1.找发起地址 2.设 ...
- React Hooks 完全指南,读React作者博文感悟(2W字精华)
阅读 facebook大佬:Dan Abramov 的文章颇有感悟 大佬 github地址 https://github.com/gaearon 重点总结 useEffect 是同步的 状态是捕获的当 ...