Chrome DevTools 小贴士

22. 使用 Sources 面板 Threads 调试

2021-03-18  本文已影响0人  阿啦啦啦啦啦
debug-per-thread.gif

如果您正在使用利用多个线程的JavaScript功能(例如Service Worker或Web Workers),则Sources Panel会考虑到这一点。

由于每个线程都有其自己的全局脚本上下文,因此您可以选择一个特定的线程进行调试(例如,在其上设置断点)。只需在Sources面板中打开Threads 窗格即可。您应该看到主线程以及所有可用的其他线程。

补充

image.png

这个是Chrome 89的截图,web worker是直接显示在左边的可以找打对应的文件打断点。右边只是一个指示器,告诉我们断点处在哪个线程
这里还可以看到 Content Scripts 面板 ,Chrome拓展开发的时候会用到这个,他能共享DOM

在V3版本的Chrome拓展开发中 Service Worker 也替代了 background.js
Service Worker的调试 还有系统通知等等的调试可以看Application面板


image.png
上一篇 下一篇

猜你喜欢

热点阅读