1

I am developing a Chrome DevTools extension, and I can't find how to debug a script running in the background page.

I declared a DevTools background page in manifest.json:

"devtools_page": "devtools-background.html"

That HTML page runs a script:

<script src="devtools-background.js"></script>

The script adds a panel:

chrome.devtools.panels.create('My Extension', '', 'index.html')

I can run my extension by opening DevTools on any page, and that works great, I see the panel. I can debug my panel's Elements and Scripts by opening the DevTools on the DevTools page (or going through chrome://extensions developer mode). I can even connect an external debugger from VS Code to the extension panel.

But I can't connect a debugger to the devtools-background.js from the background page. I can't use console.log or step debugging to understand what's going on in the background. The only thing I have is Errors from the chrome://extensions developer mode if an error occurs in that script. But no console or debugger.

LodeRunner
  • 7,975
  • 3
  • 22
  • 24

1 Answers1

2

When you click "service worker", you can find background of console log.

enter image description here

Nori
  • 2,340
  • 1
  • 18
  • 41