Apologies if this has been answered elsewhere (I did look around, but didn't find a clear answer)... **I'd like to programmatically inject a React component into a host page only when users click the extension icon. **Anyone else have any success? I tried the following hack with limited success: 1. Added a config export with the same entries for

matches

and

exclude_matches

to avoid the content script from automatically being injected into

<all_urls>

2. Created a background script with a call to

chrome.scripting.executeScript

on extension click:

import reactRoot from 'url:./react-component';

chrome.action.onClicked.addListener((tab: chrome.tabs.Tab) => {
  chrome.scripting.executeScript(
    {
      target: { tabId: tab.id },
      files: [reactRoot.replace(/chrome-extension:\/\/[a-z]*\/([^?]*)\?.*/i, '$1')], // I think executeScript expects a path that is relative to the extension root...
    }
  )
});

Thread automatically created by andrewpawson in #978320682985349130