Chrome extension - Share data between view and the extension

Question

I'm building a chrome extension to debrid and stream a link on my raspberry pi (running Kodi).

So far, it's working well. I can give a link :

and it's debrided + streamed on Kodi.

I would like to make it easier to use.

Instead of pasting the link into the app, I made a little script to search on a given type of page if a link can be debrided via Realdebrid and is so, the script add a button to directly stream it :

The problem here is :
When the user click on the button, how can I pass the link to my extension ? I would like to have it in my extension because I can display the link into history.

I tried something like that :

• from the view :

• from the extension :

But it's not working.

I think I should use messages but I don't understand how.

It's an open source project that you can find on Github . As it's not working yet you won't find the code I shared in the 2 images before. It's just on my computer, not pushed.

Any help would be really appreciated !

Thanks !

EDIT 1 :

When I click on the button injected in the page, I get this error :

Which leads to this line :

EDIT 2 :

If I keep the app open while I click on the button it's working. But I do not want to have to launch the app of course, the goal is to click on the button only.

Answer 1

Popup script is loaded when you open the app by a user action ie clicking on the app icon. Until then, it is not available to you. As such you are getting this error because when you send a request the listener should be available and in your case its not there.

Now, the easiest way to achieve this would be to send the request from the content script to the background page which is available even when the app is not open.

1. Inject the button using the content script and send a message to the background page (called event pages) on click event of the button.

2. Add an event listener in your background page which will listen to the request from the content script and store the link in the local storage.

3. When your app opens just load the link from the local storage and display your links in the history.

I hope this helps.