标签: firefox-developer-tools

如果您转到 chrome 的检查器，顶部有一个“适合”按钮，这在响应式设计中非常方便。它尝试使用您设置的任何屏幕分辨率在 chrome 中适应视口。firefox 有这样的功能吗？我该如何使用它？

我有一个 div，我将其宽度和高度设置为固定值，因为我想仅当其内容溢出其大小时才向其添加垂直滚动。

这是我所做的：

站点.html

element {
}
#foo {
    max-width: 180px;
    max-height: 200px;
}
.verticalScrollIfNeeded {
    overflow-y: auto;
}
.hasContentToItsRight {
    margin-right: 4px;
}
*, *::before, *::after {
    box-sizing: border-box;
}
body {
    font-family: Lato,sans-serif;
    font-size: 14px;
    line-height: 1.6em;
}
body {
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 14px;
    line-height: 1.42857;
    color: #333;
}
html {
    font-size: 62.5%;
}
html {
    font-family: sans-serif;
}

<div id = "foo" class = "verticalScrollIfNeeded">
      Foo bar har zar dar mar gar har par yar lar …

在 Mozilla Firefox web dev 的样式编辑器中，我将 Keybindings 设置为“Vim”（首选）。问题出在样式编辑器内部，我无法退出插入模式；我通常会在任何 Vim 编辑器中按 Esc 键来执行此操作，但是在 Mozilla 中，这绑定到“打开控制台”的快捷方式。如何退出插入模式或更改 Firefox 中的键绑定？

我得到了以下公式来测量第一个字节的时间 (TTFB)、TTFB 到 DOM 就绪和页面加载。

TTFB

window.performance.timing.responseStart - window.performance.timing.navigationStart

TTFB 到 DOM 就绪

window.performance.timing.domComplete - window.performance.timing.navigationStart

页面加载

window.performance.timing.loadEventStart - window.performance.timing.navigationStart

这些公式正确吗？我如何才能检查它们？我听说您可以在 Firebug 的网络面板中测量它们，但检索这些值似乎很麻烦。不确定您在 Chrome 中从何处获得这些值。

那么，如何确定这些测量值呢？

我正在尝试调试（其他人的）站点，其中有一个按钮可以打开一个导致 404 的新浏览器窗口。我正在尝试确定是否使用 POST 打开新窗口，但旧窗口的开发网络工具不'不显示请求，因为它出现在新窗口中。当我在新窗口中打开开发工具时，请求已经发出并且没有出现。

如何在开发工具中查看此网络请求？

多年来，我一直使用捆绑 Webpack 的 Vue-CLI 构建应用程序。我看到这个前缀（协议？），webpack://但我实际上不知道它意味着什么。

例如，在为 app.xxx.js.map 生成的源映射中，我看到：

{"version":3,"sources":["webpack:///webpack/bootstrap","webpack:///./src/App.vue?797c",...

那么这webpack://到底是什么意思呢？这显然不是浏览器可以解析的真正协议。那么解决了吗？如何？

我遇到的具体问题导致我想要理解这一点，我生成的内容是chunk-vendors.8c348425.js.map这样开始的：

{"version":3,"sources":["webpack:///js/chunk-vendors.68249437.js"],...

在这种情况下，任何地方都没有生成的chunk-vendors.68249437.js文件。应该有吗？或者这是一个抽象生成的名称，实际上并不引用真实的文件？

我在 FireFox 中看到一些错误，但我在解释时遇到了一些困难：

我认为它是说它（以某种方式）运行不存在的 chunk-vendors.68249437.js 文件，并且无法获取某些（身份不明的）资源？

我需要一种方法来获取YouTube直播的网址,理想情况是每种网站的网址(即240p,360p).

到目前为止我尝试了什么:

1. 使用Wireshark(不知道如何应用适当的过滤器)
2. 使用urlsnoopers(找不到任何适用于Linux的东西)
3. 从页面源获取m3u8 URL(无法控制质量)
4. 使用Firefox开发人员工具分析网络(不会获得某些链接的m3u8 URL)

另一方面,我注意到一些低质量的流URL链接似乎在几秒钟之后就会卡住.知道为什么吗？

如何清除 Firefox 的 JavaScript 控制台的命令历史记录？清除所有历史记录、cookie、缓存等不会清除 JavaScript 控制台历史记录，clear().

如何查看 Firefox 扩展发出的请求和错误？它们不会显示在常用的选项卡检查器工具中。

在 Chrome 中，它是

chrome://extensions/ > Details > Inspect Views (background page)

这将打开 Chrome 扩展的 DevTools。我在 Firefox 中没有看到此选项。

任何人都可以解释为什么,在任何页面上调试,我看到Firefox DevTools,Firebug和Chrome DevTools在传输文件大小方面总是有很大差异吗？例如,通过Stack Overflow的主页,我看到:

• Chrome DevTools:282 KB

• 萤火虫:246 KB

• Firefox DevTools:873 KB

真相是什么？