chrome.cookies.getAll returns an empty array

Question

I'm working on a simple chrome extension that will delete all cookies from a domain with one click but for some reason, it's not working. When I try to get all the cookies from the domain, it returns an empty array. What am I doing wrong? Here's the js script:

$("#fixTheCookiesButton").click(() => {
  // delete the cookies
  chrome.cookies.getAll({domain: "https://www.youtube.com"}, (cookies) => {
    console.log("deleting " + cookies.length + " cookies")
    for(var i = 0; i < cookies.length; i++){
      console.log(i + " deleted")
      chrome.cookies.remove({
        url: "https://www.youtube.com" + cookies[i].path,
        name: cookies[i].name
      })
    }
    
    // some other stuff that isn't relevant here
}

and here's my manifest:

{
  "manifest_version": 2,
  "name": "FixYT",
  "version": "1.0",
  "description": "Fixes that YT cookie bug with one click",
  "browser_action": {
          "default_title": "FixYT",
          "default_popup": "popup.html"
  },
  "permissions": [
    "cookies",
    "https://www.youtube.com/",
    "*://www.youtube.com/",
    "tabs",
    "*://*/"
  ]
}

I've tried looking around the internet but I can't find any solutions to this.

Answer 1

you should call this code block in background.js

    chrome.cookies.getAll({
  domain: ".youtube.com"
}, function (cookies) {
  for (var i = 0; i < cookies.length; i++) {
    console.log(cookies[i] + "deleted");
    chrome.cookies.remove({
      url: "https://" + cookies[i].domain + cookies[i].path,
      name: cookies[i].name
    });
  }
});

Answer 2

As isa says, chrome.cookies is only defined in background.js

Add to manifest so we have access to chrome.cookies in background.js  

 "permissions": [
      ...
       "cookies",
     ],

background.js

...
chrome.cookies.getAll({
    }, function (theCookies) {
        cookies = theCookies
        console.log(cookies)
    });

Sending Cookies from background.js to other views

(Not required, but still useful)

Add to panel.js to search for cookies. [This will fire when you open your extension ie (puzzle piece icon) -> click on your extension]

chrome.runtime.sendMessage({ command: "GetCookies"}, 
      function(response) {
            console.log("I received cookies!")
            console.log(response)
      }
);

Add to background.js logic to get cookies from the browser and check for known cookies

chrome.runtime.onMessage.addListener(function (message, sender, callback) {
    if (message.command === 'GetCookies') {
        checkKnownCookies()
    }
});
let cookies = [] // Hold IDs of recognized cookies
function checkKnownCookies() {
    chrome.cookies.getAll({
    }, function (theCookies) {
        cookies = theCookies
        console.log(cookies)
        callback(theCookies)
    });
}
 

https://developer.chrome.com/docs/extensions/reference/cookies/#method-getAll

To view console for background.js go to (puzzle piece icon) -> manage extensions and click on the href link to background.html for your extension