Search code examples
javascriptgoogle-chromegoogle-chrome-extension

Chrome Extension Shortcuts


I'm writing a simple extension that has a .js file with only 2 functions and a listener (which only writes to Console - but I can't see it and not sure it catches anything).

I'd like to have shortcuts assigned, let's say Ctrl+Shift+1 and Ctrl+Shift+2 to both functions.

I'm not exactly sure how to do it, and if it's possible. The data I've been able to gather online didn't cover what I'm looking for.

I have no need for html popup. All I want is to press the shortcut and have the correspondent javascript function execute.

This is how my manifest.json file looks like:

{
  "manifest_version": 2,

  "name": "Simple Extension",
  "description": "This extension barely does anything.",
  "version": "1.0",

  "browser_action": {
    "default_icon": "icon.png",
    "default_popup": "popup.html" //not sure I even need this
  },

  "background": {
    "scripts": ["popup.js"]
  },

  "commands": {
      "funcA": {
        "suggested_key": {
          "default": "Ctrl+Shift+1"
        },
        "description": "Executes Func A"
      },
      "funcB": {
        "suggested_key": {
          "default": "Ctrl+Shift+2"
        },
        "description": "Executes Func B"
      }
   }
}

After installing the extension I saw on 'Keyboard Shortcuts' on the Extension tab that the shortcuts assignment worked well, but it's unclear to me what binds the shortcut to the javascript function itself.

Do I have to use a listener and then do the call manually ?

Edit:

This is the listener in my .js file:

chrome.commands.onCommand.addListener(function(command) {
        console.log('Command:', command);
});

Solution

  • Register an event listener for the chrome.commands.onCommand event in the background or event page.

    chrome.commands.onCommand.addListener(function(command) {
        // Now, do whatever you want when the shortcut is triggered.
        // e.g. if (command == 'funcA') ...
    });