一线大厂高级前端编写,前端初中阶面试题,帮助初学者应聘,需要联系微信:javadudu

Chrome113 支持修改 Header 和隐藏错误堆栈

Chrome113 支持修改 Header 和隐藏错误堆栈

DevTools 支持修改响应头,包括修改响应头的值、删除和添加响应头。

要修改某个响应头的值,可以通过导航到 Network > Headers > Response Headers,将鼠标悬停在头部信息的值上,然后单击编辑并进行修改。

Chrome113 支持修改 Header 和隐藏错误堆栈

你也可以添加一个自定义 Header:

Chrome113 支持修改 Header 和隐藏错误堆栈

要在一个地方编辑所有的修改信息,可以编辑 Sources > Overrides 下的 .headers 文件。在那里,您还可以单击“Add override rule”以使用通配符 (*) 覆盖多个请求。

Chrome113 支持修改 Header 和隐藏错误堆栈

个人认为,这个新特性对于临时改动某个请求的 Header 比较有用,如果是集中管理 Header 的修改,其实并不方便,操作链路比较长。

错误堆栈隐藏

该特性目前包括:Nuxt、Vite 和 Rollup

为了帮助您在调试期间更快地确定问题,增强的堆栈跟踪隐藏了来自 Nuxt 3.3 或更高版本生成的源代码中的错误栈。对于一个报错,我们通常更关注报错堆栈中业务代码的报错,其中的第三方框架的报错大多数情况下我们不需要关注,所以隐藏这些错误堆栈更有利于我们快速定位问题。

Chrome113 支持修改 Header 和隐藏错误堆栈

Recorder 支持断言

点击开始录制后,Recorder 开始录制你的操作行为,通过点击“Add assertion”可以设置断言。看个 coffee 示例,如果断言不通过会报错:

Chrome113 支持修改 Header 和隐藏错误堆栈

Elements > Styles 中的 CSS 改进

无效的 CSS 属性和值

为了更快地诊断 CSS 问题,Styles 面板中的代码将被用横线划掉:

Chrome113 支持修改 Header 和隐藏错误堆栈

CSS 动画增加快捷跳转

Chrome113 支持修改 Header 和隐藏错误堆栈

总结

文中介绍的新特性是我们可能会经常用到的,还有其他特性可以参考这里。前两个对于我们日常开发还是很有帮助的,不过在体验上可能还有待改进,比如:

  • 对于修改响应头,哪些请求的响应头被修改了没有标明出来,如何让集中管理更方便;

  • 对于堆栈隐藏,能否通过代码配置堆栈的隐藏等。

如果想体验这些新特性,可以下载 chrome canary 试用。

欢迎留言交流,如果对你有价值,欢迎点赞关注😄

参考

developer.chrome.com/blog/new-in…

原文链接:https://juejin.cn/post/7222952967459799097 作者:探险家火焱

(0)
上一篇 2023年4月18日 上午10:52
下一篇 2023年4月18日 上午11:02

相关推荐

发表评论

登录后才能评论