Chrome extension - Share data between view and the extension - javascript

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.

Popup script is loaded when you open the app by a user action i.e 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.
Inject the button using the content script and send a message to the background page (called event pages) on click event of the button.
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.
When your app opens just load the link from the local storage and display your links in the history.
I hope this helps.

Related

How to inject text from browser extension to web page?

I am creating a Firefox extension with React.js and want to inject a text into the active website. The permissions, content_script and background script are set in manifest.json but the problem is I do not understand the concept how it should work.
So far I tried to add content script but that runs a script at page load and thats it. The background does not seem to interact with the page.
I need a script that listen for an event, when I click on a button in the extension popup, it should send the text from the React app to update the site. Basically like a password manager when you injecting the password into the form field.
Can someone tell me the concept as I do not get what case relevant to my problem after checking in and out the web extension documentation?

Override Behavior: Clicking a .ipynb notebook on the Jupyter Dashboard, serves (opens) the notebook

By default, when a .ipynb notebook is clicked on the Jupyter Dashboard, it opens the notebook in a new tab.
I would like to override this behavior, so, clicking the .ipynb file should just send the notebook link (that was supposed to be opened) to custom.js without serving (opening) the notebook.
Once the link is available in custom.js, I send it to C++ using a wink Request, which then opens the link in a different browser.
Help Needed: getting the link in custom.js and stopping the notebook from executing
I am able to get the link in custom.js using something hacky: $('a')[1]
But I still have no idea on how to stop Jupyter from serving the notebook.
Is this possible? Digging through the docs, I found this extra_services but can I create a handler for this purpose?
Any help is appreciated, thanks.
I couldn't find a way to officially do this, no answers on here or on Jupyter Community Forum.
I got it working using a not so efficient hacky solution, which I am sharing here.
The process
Set the target for all Jupyter open functions to _self instead of _blank (ensures links open in same tab, instead of new tab)
Using document.referrer, get the URL of the previous page
Using $('a').href get the link to the current page
Send the link to the current page and the link to the previous page to Cpp
Load the curr page link in a new browser using cpp, set the old browser tab to the prev link.

Make Google Bot detect AJAX contents

I'm developing a site (not mine) and I encountered a big trouble!
In this website I've got some modals that will open after a user clicks on a product, but I need to do so Google Bot detects these modals like pages. When a modal opens, a JS Function adds a # parameter to the URL like "#abc=modal_one".
I want that in Google Result appears this page as "www.test.com/page.php?#abc=modal_one". I've tried (and I'm trying) to render the page like Google Bot in Google Search Console, but GSC opens only the page and not the modal. I also added a ES6 (JS) code that just edits the page title when the modal is showing to the user (after user clicks to open the modal) but nothing, Google does not detect the page title set after the page is loaded.
If you can't understand something just tell me and I will try to explain my trouble newly.
Thanks in advance to all the StackOverflow community :)
Try exporting the various pages to a dynamic sitemap that Google can read.
View the Categorize parameters with the URL Parameters tool page for more information.

Chrome extension- Inject script on multiple pages

I am a newbie to extensions. i want to create a extension, when clicked on the icon it should open up the www.gmail.com, input my user name and password and login automatically,click on the first mail. Your help is highly appreciated. I tried many things like chrome inject api but did't work out.
Like said in comments, go have a look to documentation sample codes, it's a good start.
For your extension you should do something like this :
Open a tab with the gmail.com url.
in the callback, inject a content script in the newly created tab
In the content script put the login and the password in page input and then simulate a submit button click.
Try to do this for a first try. When you get it work, You can try to open the latest email received. Look for tabs and runtime message api to send data or event between injected scripts and background script.

How can I get opened URL in browser-action panel

I am creating a browser-action button on the right side of toolbar so that I can show deals on my extension depending upon the opened URL in tab.
Upon going through SDK documentation I found this: https://developer.mozilla.org/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_toggle#Attaching_panels_to_buttons but it says that it's supported only for Firefox 30 onwards which is an issue.
To achieve this thing, I used browser-action lib by Rob-W (source: https://github.com/Rob--W/browser-action-jplib)
Here is how it works:
Let's say, I have opened www.example.com, and it has 20 deals on my server. If I click on my browser-action button, it would open a panel showing deals depending upon the opened URL (with the help of an AJAX request)
Now the problem is:
The browser-action button (upon click) opens popup.html, and in my popup.html I have included popup.js. This is the file where I want access to the opened tab URL, so that I can perform the AJAX request. I do not get how can I pass the opened tab URL from main.js to popup.js.
sdk/tabs give you the access to current tab and from there you can get the location.
https://developer.mozilla.org/en-US/Add-ons/SDK/High-Level_APIs/tabs
I do not get how can I pass the opened tab URL from main.js to
popup.js.
Have you tried to use the port system.
to emit a message from a content script:
self.port.emit("myContentScriptMessage", myContentScriptMessagePayload);
To receive a message from the add-on code:
self.port.on("myAddonMessage", function(myAddonMessagePayload) {
// Handle the message
});
You can also use widget instead of the new UI module if you really want to target browsers before version 30, however it is depreciated and will probably be removed within the next few releases.

Categories

Resources