AB7zz Posts - Answer Overflow

AB7zz

•Created by AB7zz on 9/5/2023 in #👾extension

How do I message from background to my content script?

background.tsx

chrome.webNavigation.onCompleted.addListener(async(details) => {
    if(details.frameType == "outermost_frame"){
        console.info("The user has loaded my favorite website!");
        console.log(details)
        const tabId = details.tabId
        chrome.tabs.sendMessage(tabId, {message: "Message from background script"}, function (response) {
            if (chrome.runtime.lastError) {
                console.error(chrome.runtime.lastError);
            } else {
                console.log('Message sent to content script:');
            }
        });
    }
}, filter);

chrome.webNavigation.onCompleted.addListener(async(details) => {
    if(details.frameType == "outermost_frame"){
        console.info("The user has loaded my favorite website!");
        console.log(details)
        const tabId = details.tabId
        chrome.tabs.sendMessage(tabId, {message: "Message from background script"}, function (response) {
            if (chrome.runtime.lastError) {
                console.error(chrome.runtime.lastError);
            } else {
                console.log('Message sent to content script:');
            }
        });
    }
}, filter);

content.tsx

const handleMessage = (message, sender, sendResponse) => {
    console.log('Message received in       content.jsx:', message);
    sendResponse({message: "Response from content.jsx"})
}
React.useEffect(() => {
    console.log('content is loaded')
    chrome.runtime.onMessage.addListener(handleMessage)
    return () => {
      chrome.runtime.onMessage.removeListener(handleMessage);
    };
  }, [])

const handleMessage = (message, sender, sendResponse) => {
    console.log('Message received in       content.jsx:', message);
    sendResponse({message: "Response from content.jsx"})
}
React.useEffect(() => {
    console.log('content is loaded')
    chrome.runtime.onMessage.addListener(handleMessage)
    return () => {
      chrome.runtime.onMessage.removeListener(handleMessage);
    };
  }, [])

I want to send the tab details from my background to the content script. Any help is really appreciated. I'm so tired of trying to do this.

18 replies

PD🧩 Plasmo Developers

•Created by AB7zz on 7/5/2023 in #🔰newbie

Why isn't React router dom working in my popup.tsx?

return (
    <>
      <BrowserRouter>
        <Routes>
          <Route path="/" element={<Table data={data} />} />
          <Route path="/similiar" element={<Similiar />} />
        </Routes>
      </BrowserRouter>
    </>
  )

return (
    <>
      <BrowserRouter>
        <Routes>
          <Route path="/" element={<Table data={data} />} />
          <Route path="/similiar" element={<Similiar />} />
        </Routes>
      </BrowserRouter>
    </>
  )

2 replies

Gaming

Programming