Chrome page action not open popup on click

Question

I have this code to activate an extension only if a certain website is visited. I've noticed that the extension icon will be always clickable and will be not grey if the url isn't mathcing with the condition setted and when the desired website is visited and the url match, if the user click on the extension icon, the popup will not be opened. How I can fix?

chrome.runtime.onInstalled.addListener(function() {
  chrome.declarativeContent.onPageChanged.removeRules(undefined, function() {
    chrome.declarativeContent.onPageChanged.addRules([
      {
        conditions: [
          new chrome.declarativeContent.PageStateMatcher({
            pageUrl: { hostEquals: 'www.example.com/video/*', schemes: ["https"] },
          })
        ],
        actions: [ new chrome.declarativeContent.ShowPageAction() ]
      }
    ]);
  });
});

chrome.pageAction.onClicked.addListener( () => {
  chrome.windows.create({
    url: chrome.runtime.getURL('popup.html'),
    width: 500,
    height: 295,
    type: 'popup'
  });
});

Answer 1

Your rule for hostEquals will never match anything because per the documentation it's compared against the host part of a URL eg simply www.example.com so it can't have / or * . Note that chrome.declarativeContent uses its own filtering system, it does not support any of the usual matching patterns used by content_scripts or webRequest.

Solution 1:

{ hostEquals: 'www.example.com', pathPrefix: '/video/', schemes: ['https'] }

Solution 2:

{ urlPrefix: 'https://www.example.com/video/' }