阅读 373

Chrome 75 开发者工具新特性

  • 文档说明
    • 作者：西楼听雨
    • 禁止转载
    • 本文同时发布于幕布平台：https://mubu.com/doc/7FnUFrgDKM
  • 新特性一：增强了自动补全功能
    在自动补全需要传入参数的 CSS 函数时，将会给出一个有意义的参数值作为参考，这样我们就可以实时预览这个值对 DOM 节点的作用效果
    • Chrome 75 之前的效果
    • Chrome 75 之后的效果
  • 新特性二：新增 Clear Site Data 命令
    我们可以直接在命令菜单（Command Menu）中通过该命令清除与当前站点相关的所有数据（包括：localStorage、sessionStorage、IndexedDB、WebSQL、Cookies、Cache、Application Cache、Service worker）
    • 按 Control+Shift+P 或者 Command+Shift+P (Mac) 打开命令菜单，然后执行 Clear Site Data 命令：
  • 新特性三：支持查看当前页面中的所有（包括 iframe 的）IndexedDB 数据库
    在 Chrome 75 之前是不能查看 iframe 中的 IndexedDB 数据库的
    • Chrome 75 之前的效果
    • Chrome 75 之后的效果
  • 新特性四：在 Network 面板中，当鼠标悬停在某条请求的 Size 列上时，在悬停的 tips 中将新增展示该资源未经压缩的体积信息
    在 Chrome 75 之前，只能在大行视图中查看到未经压缩的体积
  • 新特性五：在断点面板中将列出所有行内断点
    • Chrome 75 之前的效果
    • Chrome 75 之后的效果
      • 每个行内断点都可以在右侧的断点面板中单独进行管理
  • 新特性六：在 IndexedDB 和 Cache 面板中，将在状态栏展示当前数据库/缓存的条目数量
  • 新特性七：新增设置项，以支持禁用详细的 Inspect 提示
    • Chrome 73 时引入了详细的 Inspect 提示气泡
    • Chrome 75 中可以通过设置项来禁用这个详细提示
      • 设置项路径： “Settings > Preferences > Elements > Show Detailed Inspect Tooltip”
  • 新特性八：新增设置项，以支持是否在 Sources 面板的编辑器中启用/关闭 Tab 键缩进
    在 Chrome 75 之前，如果你用键盘的 Tab 键导航进入了编辑器中，就无法再通过 Tab 键跳出编辑器了，因为 Tab 键在编辑器中的行为是对代码进行缩进​
    ​
    • 设置项路径：Settings > Preferences > Sources > Enable Tab Moves Focus.