Chrome Extension Keyboard Shortcuts — Developer Guide

4 min read

Keyboard Shortcuts & Commands Guide

Overview

Manifest Configuration

{
  "commands": {
    "_execute_action": {
      "suggested_key": {
        "default": "Ctrl+Shift+Y",
        "mac": "Command+Shift+Y"
      },
      "description": "Open extension popup"
    },
    "toggle-feature": {
      "suggested_key": {
        "default": "Alt+T",
        "mac": "Alt+T"
      },
      "description": "Toggle the main feature on/off"
    },
    "run-scan": {
      "suggested_key": {
        "default": "Ctrl+Shift+S",
        "mac": "Command+Shift+S"
      },
      "description": "Run a page scan"
    }
  }
}

Special Commands

Listening for Commands

chrome.commands.onCommand.addListener((command, tab) => {
  console.log(`Command: ${command} on tab: ${tab?.id}`);

  switch (command) {
    case 'toggle-feature':
      toggleFeature(tab);
      break;
    case 'run-scan':
      runScan(tab);
      break;
  }
});

async function toggleFeature(tab) {
  const enabled = !await getEnabled();
  await setEnabled(enabled);
  chrome.action.setBadgeText({ text: enabled ? 'ON' : '' });
}

Querying Registered Commands

chrome.commands.getAll((commands) => {
  commands.forEach(cmd => {
    console.log(`${cmd.name}: ${cmd.shortcut || '(not set)'} — ${cmd.description}`);
  });
});

Key Combination Rules

Required modifiers

Supported keys

Platform-specific keys

{
  "suggested_key": {
    "default": "Ctrl+Shift+L",
    "windows": "Ctrl+Shift+L",
    "mac": "Command+Shift+L",
    "linux": "Ctrl+Shift+L",
    "chromeos": "Ctrl+Shift+L"
  }
}

Global Shortcuts

{
  "commands": {
    "global-toggle": {
      "suggested_key": { "default": "Ctrl+Shift+1" },
      "description": "Toggle from anywhere",
      "global": true
    }
  }
}

Storing Shortcut Preferences

import { createStorage, defineSchema } from '@theluckystrike/webext-storage';

const storage = createStorage(defineSchema({
  featureEnabled: 'boolean',
  lastCommand: 'string',
  commandCount: 'number'
}), 'local');

chrome.commands.onCommand.addListener(async (command) => {
  await storage.set('lastCommand', command);
  const count = (await storage.get('commandCount')) || 0;
  await storage.set('commandCount', count + 1);
});

Limitations

Common Mistakes

Part of the Chrome Extension Guide by theluckystrike. Built at zovo.one.

← Previous ci-cd-pipeline Next → content-script-frameworks