How to debug Google Chrome background script?

JavascriptDebuggingBackgroundGoogle Chrome-Extension

Javascript Problem Overview


I have very simple extension:

manifest.json

{
  "name": "historyCleaner",
  "version": "0.1.1",
  "manifest_version": 1,
  "description": "This is my first Chrome extension",
  "background": {
    "scripts": ["cleaner.js"]
  }, 
  "permissions": [
    "history"
  ]
}

cleaner.js

chrome.history.onVisited.addListener(function(HistoryItem result) {

  console.log("it works!");
  alert("it works!");

});

I've loaded it in Google Chrome, it is turned on and... it doesn't work. It doesn't log anything in console, it doesn't alert anything and what is worse, I can't find it in developers tools "Scripts" tab. How can I find why it doesn't work?

//edit

I've changed manifest.json to this one:

{
  "name": "historyCleaner",
  "version": "0.1.5",
  "manifest_version": 1,
  "description": "This is my first Chrome extension",
  "background_page": "background.html",
  "permissions": [
    "history",
    "background"
  ]
}

And embeded JavaScript in background.html

Javascript Solutions


Solution 1 - Javascript

enter image description here

and also if your console.log("it works!"); does not show up, then that's mean chrome.history.onVisited is not fired yet.

ps: For function(HistoryItem result), you may want to change it to function(result).

Solution 2 - Javascript

This response might be late but would help the rest. if your background.html has javascript errors then the page will not load (to inspect).

To find out whats wrong with your background.html, under chrome://chrome/extensions/ (i.e., manage extensions), click on the background.html link. This will load the developer tools but without background.html. At the botton-right of the window, you will see a red error symbol, and clicking on it will provide line numbers that needs to be fixed.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionciemborView Question on Stackoverflow
Solution 1 - JavascriptDerek 朕會功夫View Answer on Stackoverflow
Solution 2 - JavascriptStackRoverView Answer on Stackoverflow