使用快捷键打开Chrome侧边面板报错：sidePanel.open()仅响应用户手势调用

问题 #

使用快捷键打开Chrome扩展侧边面板时触发报错：

Uncaught (in promise) Error: sidePanel.open() may only be called in response to a user gesture

问题根源 #

当前代码在chrome.commands.onCommand回调中执行了异步的chrome.tabs.query操作，这个异步步骤会丢失用户手势的上下文，导致后续调用chrome.sidePanel.open()时违反Chrome的安全限制。

修复方案 #

修改background.js，移除异步查询标签的逻辑，直接调用chrome.sidePanel.open()——该方法默认会作用于当前激活的标签页：

chrome.commands.onCommand.addListener((command) => {
  console.log(`Command "${command}" called`);
  chrome.sidePanel.open();
});

如果需要针对特定标签页打开侧边面板，可以通过同步方式获取标签ID，但在大多数场景下，直接调用无参的chrome.sidePanel.open()即可满足需求。

验证 #

重新加载扩展后，按下设置的快捷键（Ctrl+Shift+Y 或 Command+Shift+Y），侧边面板即可正常打开，不会再出现报错。

内容的提问来源于stack exchange，提问作者Weili