I'm now making a Chrome Extension. I want to call JS functions that are defined in the original page (tab), from Chrome Extension. It doesn't matter whether background.html
or Content_Script
calls them.
For example:
Original page (tab)
<html> <head> <title>Original Page</title> <script> function greeting(){ alert("Ohayou!"); // some other codes here } </script> </head> <body></body> </html>
Then I want to call the function "greeting" in the original page, from Google Extensions. How can I do the above?
From Chrome, navigate to Settings > Extensions > Dialpad Extension > Details. Select Extension Options > Use this Dialpad app to place all calls:. You can choose the desktop app, the Chrome app, or the web app. It will then serve as your default choice for placing calls using the click-to-call feature from Chrome.
Chrome extensions can be either packed or unpacked. Packed extensions are a single file with a . crx extension. Unpacked extensions are a directory containing the extension, including a manifest.
The background script should be viewed as "running in the background of the Chrome browser". Your desired effect (running a script for every page) is actually a task for content scripts. To learn more, read https://developer.chrome.com/extensions/overview.html#arch. Follow this answer to receive notifications.
To manage which extensions are pinned to your toolbar, open the Extensions Menu by clicking the puzzle piece icon next to your profile avatar. A drop-down menu will open, showing all of your currently installed Chrome extensions.
In chrome extensions, the code in run in a sandboxed environment, so any event listeners won't apply to the main page. From my understanding, you want a button click to trigger and run a function on the web page. The best way to do this would be to inject code into the page.
You can use most chrome.tabs methods and events without declaring any permissions in the extension's manifest file. However, if you require access to the url, pendingUrl, title, or favIconUrl properties of tabs.Tab, you must declare the "tabs" permission in the manifest, as shown below: ... ...
This in turn provides the injected script access to the local variables and functions. Since Chrome extensions are event-driven because of their architecture, once the injected scripts have access to the page's variables and functions, they can pass it to the content script. The content script then passes the these objects to the background page.
The concept was originally introduced with the initial launch of Chrome, providing isolation for browser tabs. An extension may run in a web page with code similar to the example below. alert(greeting + button.person_name + ".")
You can also simply write in your content script:
location.href="javascript:greeting(); void 0";
For the first part you can use this nice answer: Insert code into the page context using a content script.
To call a function back in your content script is easy. You can create your own event which you can then listen on in your content script. This would work like this:
injected code:
var evt = document.createEvent('Event'); evt.initEvent('myCustomEvent', true, false); // fire the event document.dispatchEvent(evt);
contentscript:
document.addEventListener('myCustomEvent', function() { // do whatever is necessary });
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With