0

I have created a chrome extension using react and typscript.

It all works fine with dummy data, and now I want to render the data based on the current url tab that is open.

How can I pass data from background.js to the main App component?

I want to use the current url where the chrome extension is open.

I have successfully managed to log the current url in the service worker console through the background.js, and now I want to simply pass it to the App.tsx to be used there.

Is there any way to establish this connection?

Is there another way where I can get the current url to be used in the App component?

user22368560
  • 11
  • 2
  • Have you looked at listeners? `chrome.runtime.sendMessage` and `chrome.runtime.onMessage.addListener` can be used for exactly this. I can write up an answer if you like. – Joe Moore Aug 29 '23 at 09:29
  • Thanks @JoeMoore, I have tried it, but the connection is unsuccessful. I'd love to see an answer please! – user22368560 Aug 29 '23 at 09:51
  • Another option that I think of - is passing the url from the iframe that is being generated inside the background - to the App.tsx. Is it possible? – user22368560 Aug 29 '23 at 10:39
  • There's no need for messaging: you can get the tab url directly in the popup by using chrome.tabs.query({active: true, currentWindow: true}) – wOxxOm Aug 29 '23 at 11:23

0 Answers0