Google chrome 如何为Chrome扩展禁用（灰显）页面操作？

我希望所有页面上的Chrome扩展图标都被禁用（灰显），除了docs.google.com上的页面。这是我在background.js中的代码

'use strict';

chrome.runtime.onInstalled.addListener(function() {
  chrome.declarativeContent.onPageChanged.removeRules(undefined, function() {
    chrome.declarativeContent.onPageChanged.addRules([{
      conditions: [new chrome.declarativeContent.PageStateMatcher({
        pageUrl: { urlContains: 'docs.google' },
      })
      ],
          actions: [new chrome.declarativeContent.ShowPageAction()]
    }]);
  });
});

从文档中可以看出，除了URL中有docs.google的页面外，所有页面上的扩展图标都应该是灰色的。但图标在所有页面上都处于活动状态（未灰显）。在非docs.google页面上点击它会导致它什么都不做，但我首先希望它变灰

对此有什么想法吗？

这是一个问题，目前还不清楚是否可以解决

同时，您可以自己维护图标：

在任何图像编辑器中创建图标的灰度版本，并单独保存

在manifest.json中指定灰色图标：

“页面操作”：{
“默认_图标”：{
“16”：“icons/16 gray.png”，
“32”：“icons/32 gray.png”
}
}

使用以下操作设置正常图标：

chrome.declarativeContent.onPageChanged.removeRules（异步（）=>{ chrome.declarativeContent.onPageChanged.addRules([{ 条件：[ 新chrome.declarativeContent.PageStateMatcher({ pageUrl:{hostPrefix:'docs.google.'}， }), ], 行动：[ 新chrome.declarativeContent.SetIcon({ 图像数据：{ 16：等待loadImageData（'icons/16.png'）， 32：等待loadImageData（'icons/32.png'）， }, }), 新建chrome.declarativeContent.ShowPageAction（）， ], }]); }); //SVG图标还不受支持 异步函数loadImageData（url）{ const img=await createImageBitmap（await（await-fetch（url））.blob（））； 常数{宽度：w，高度：h}=img； const canvas=新的离域画布（w，h）； const ctx=canvas.getContext（'2d'）； ctx.drawImage（img，0，0，w，h）； 返回ctx.getImageData（0,0,w,h）； }

这是一个问题，目前还不清楚是否可以解决

同时，您可以自己维护图标：

在任何图像编辑器中创建图标的灰度版本，并单独保存

在manifest.json中指定灰色图标：

“页面操作”：{
“默认_图标”：{
“16”：“icons/16 gray.png”，
“32”：“icons/32 gray.png”
}
}

使用以下操作设置正常图标：

chrome.declarativeContent.onPageChanged.removeRules（异步（）=>{ chrome.declarativeContent.onPageChanged.addRules([{ 条件：[ 新chrome.declarativeContent.PageStateMatcher({ pageUrl:{hostPrefix:'docs.google.'}， }), ], 行动：[ 新chrome.declarativeContent.SetIcon({ 图像数据：{ 16：等待loadImageData（'icons/16.png'）， 32：等待loadImageData（'icons/32.png'）， }, }), 新建chrome.declarativeContent.ShowPageAction（）， ], }]); }); //SVG图标还不受支持 异步函数loadImageData（url）{ const img=await createImageBitmap（await（await-fetch（url））.blob（））； 常数{宽度：w，高度：h}=img； const canvas=新的离域画布（w，h）； const ctx=canvas.getContext（'2d'）； ctx.drawImage（img，0，0，w，h）； 返回ctx.getImageData（0,0,w,h）； }

---

如果您使用清单版本2，只需要在page_操作中声明彩色图标，而不是灰色图标

// manifest.json
 "manifest_version": 2
 "page_action": {
   "default_icon": "icon-color.png"
 },

然后，该图标将在URL中显示为灰色的权限和匹配项。 您可以在中查看描述

---

但是在manifest v3中，上面的配置似乎不再有效。

如果使用manifest版本2，只需要在page_action中声明彩色图标，而不是灰色图标

// manifest.json
 "manifest_version": 2
 "page_action": {
   "default_icon": "icon-color.png"
 },

然后，该图标将在URL中显示为灰色的权限和匹配项。 您可以在中查看描述

---

但是在manifest v3中，上面的配置似乎不再有效。

我阅读了错误描述和注释：这个错误可能什么时候解决？对我来说，它在“等待”-未捕获的语法错误：意外标识符上崩溃。是因为清单v2吗？您没有正确复制代码。是的，在“chrome.action.onClicked”中调用“chrome.action.setIcon（someAnotherIcon）”之后，我错过了“async（）=>{”，感谢您停止了工作（图标不再改变，someAnotherIcon显示）为什么会这样？---我阅读了错误描述和注释：这个错误什么时候可能会被解决？对我来说，它崩溃在“等待”-未捕获的语法错误：意外的标识符上。是因为清单v2吗？你没有正确复制代码。是的，我错过了“async（）=>{”，感谢你在中调用了“chrome.action.setIcon（someAnotherIcon）”“chrome.action.onClicked”它停止工作（图标不再改变了，有人告诉我）为什么会这样-