4

I ran into some trouble when upgrading to manifest v3, and would greatly appreciate your help and input.

Background:

  • Using manifest v3
  • Using ShowAction() instead of ShowPageAction() which is deprecated
  • Used to work with manifest v2 and ShowPageAction()
  • Already read this post which did not apply to manifest v3 (or seemed like it didn't apply)
  • Also followed this google guide for upgrading from ShowPageAction to ShowAction

After following chrome's tutorial, which is reposted below:

    // background.js

    // Wrap in an onInstalled callback in order to avoid unnecessary work
    // every time the background script is run
    chrome.runtime.onInstalled.addListener(() => {
      // Page actions are disabled by default and enabled on select tabs
      chrome.action.disable();
    
      // Clear all rules to ensure only our expected rules are set
      chrome.declarativeContent.onPageChanged.removeRules(undefined, () => {
        // Declare a rule to enable the action on example.com pages
        let exampleRule = {
          conditions: [
            new chrome.declarativeContent.PageStateMatcher({
              pageUrl: {hostSuffix: '.example.com'},
            })
          ],
          actions: [new chrome.declarativeContent.ShowAction()],
        };
    
        // Finally, apply our new array of rules
        let rules = [exampleRule];
        chrome.declarativeContent.onPageChanged.addRules(rules);
      });
    });

I noticed that the icon on my extension grey's out on sites that don't match the specified pattern, and has color on sites that do match the url pattern (expected behavior). However, when I click on the extension on sites that match the url pattern, the extension remains disabled.

Question: Has anyone been able to get this sample code to work? How would one make a chrome extension work only when user is on specific site, and has clicked on the extension?

Thanks in advance!

river
  • 41
  • 1
  • 2
  • Sounds like a bug in MV3. As a workaround, instead of disable(), you can set a gray icon by default (in manifest.json) and set a color icon in `actions` as shown [in this answer](https://stackoverflow.com/a/64475504). – wOxxOm Feb 07 '22 at 10:05
  • I see, thanks! I tried the given example, but it seems that it's only greying out the icon. I was hoping to disable the extension entirely. – river Feb 09 '22 at 03:15
  • I think my question was wrongly scoped, I have an extension that will display a popup when the icon is clicked on. I was hoping to have the popup show up only on certain urls, which worked perfectly in manifest 2 by using ShowPageAction() – river Feb 09 '22 at 03:40
  • I would argue that not showing any popup when clicking the icon on an unsupported site is confusing for a user because it shows the absolutely irrelevant and useless context menu. It's a design flaw of this API. I suggest that you check the tab's URL inside the popup and show a notice that the current URL is unsupported explicitly in such cases when people click a grayed out icon, which implicates they didn't understand the concept. – wOxxOm Feb 09 '22 at 11:02
  • @wOxxOm But doesn't this mean that to check the tab's URL, the extension would need permissions it normally doesn't need? (which is the motivation to use declarativeContent in the first place) – Remko Jul 13 '22 at 19:58
  • @Remko, no, the URL will be available only on sites that are already allowed by permissions. – wOxxOm Jul 14 '22 at 04:51

1 Answers1

2

You just need to add "declarativeContent" into manifest.json permissions.

 "permissions": [
     "declarativeContent"
],
Anton
  • 21
  • 2
  • This was already added, and did not solve the problem. The workaround suggested by @wOxxOm worked. – river Feb 10 '23 at 23:06