Why don't I see my extension's content scripts in the Debugger pane

I was seeing the following error message appearing at the top of the browser window:

Luckily, when clicking on the button ‘Debug Script’, I was pointed to the line causing the problem in my content script.

I think I found a fix, but when I now visit the Debugger pane, I don’t see any of the extension’s content scripts. Where can I see the loaded content scripts?

Firefox debugger is a bit buggy at times, especially if you start debugging.
Usually you’ll have to restart Firefox to fix it.

Hi Juraj, thank you for your quick answer. I can’t seem to get it to work! I’m using Firefox Developer Edition 130.0b9 (64-bit). The Console logs show me that the content script is loaded, but the script fails to show up in the Debugger pane.

I see you are using Mac, so I’m not sure you know, but closing a Firefox most likely requires right click on the Firefox icon / Exit (or something like that).
Maybe also clicking the Firefox main menu / Exit would do the trick.

At least this is what I had to do often when I was developing addons for Safari.

Yes, CMD+Q also doess the trick, but I’m still without luck!

There are two ways you can view a content script even if it doesn’t show up in the list of sources in the debugger: a console.log() statement or debugger statement.

If you log a message, you can click the filename of the content script in the console to jump to the file and line where that statement was logged. From there, you can add breakpoints and such to your content script.

If you add a debugger statement to the file, it will basically act like a static breakpoint in your script. And since it will pause in the middle of execution, that may give you more chance to debug the script. This approach can be useful to pause execution at points when you wouldn’t be able to otherwise using breakpoints in developer tools.

2 Likes