如何调试 Chrome 开发者工具面板扩展？

Question

42

我正在尝试编写Chrome DevTools扩展程序，但是我在调试时遇到了一些问题。

我该如何检查我的面板HTML并调试它的JavaScript代码？

- Yosi

4个回答

3

发现了一个简单的方法，在您扩展程序的Devtools面板中右键单击，在弹出窗口中点击“检查”。它会打开另一个Devtools，专注于您的扩展程序面板HTML。

不需要分离主Devtools。

- Nisim Joseph

是的，先生，那是正确的！ - Lizozom

2

对我而言，这需要分离开发者工具并按下CTRL+SHIFT+i（Windows）。

- Möhre

解释这个回答的存在：我的原始答案在键盘组合方面有误（使用了Alt而不是Shift）。已经进行了修复。 - Xan

0

对我来说，使用 CMDOPTIONi 可以正常工作。

版本号为 104.0.5112.101（官方版本）（arm64）（Apple m1 silicon）。

- vrspiration

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Xan · Accepted Answer

如果你将开发者工具（在右上角的 x 旁边的图标）分离到单独的窗口中，然后在聚焦于开发者工具窗口时按下 Ctrl+Shift+I ，你将会调用该窗口的开发者工具。

据我所知，在停靠配置下是不可能的。