Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>You can execute the external JS file (by injecting it into the DOM (<code>document</code> in the extension)). The external JS file also has access to the local DOM.</p> <p>Not possible is communciation between those two:</p> <ul> <li>User-added Javascript (so non-native) can't be accessed by the extension:<br> The extension's JS doesn't have access to the page's <code>jQuery</code> object, but it does have access to its <code>document.body</code>.</li> <li>The user-added Javascript (the page's JS or your added external JS) doesn't have access to the extension:<br> From the page, you can't access chrome API's, like bookmarks, tabs, browser action etc.</li> </ul> <p>This is done very much intentionally for security reasons.</p> <p>What I was talking about (<code>sendRequest</code> and <code>onRequest</code>) is communication between 'content script' and extension script/background pages. In your case irrelevant =) Sorry.</p> <p><strong>answers</strong> </p> <blockquote> <p>> I cannot call specific functions within the external JS file from the extension because of the lack of communication capabilities between the two</p> </blockquote> <p>That's right.</p> <blockquote> <p>> All I can do is make my extension inject the external JS file into the DOM. This will execute whatever is there to be executed in the external JS file</p> </blockquote> <p>That's right. The ext JS can contain immediate actions and timers etc, like a normally loaded JS (in the webpage itself) would.</p> <blockquote> <p>> The code launching granularity from the extension is at external JS level, not at JS function level</p> </blockquote> <p>What do you mean by <code>JS function level</code>? The extension JS?</p> <p><strong>PS</strong><br> <code>chrome.tabs.executeScript</code> is not quite as cool as you'd think. Basically what it does is execute a script in the page's context (like <code>content_scripts</code>). It has, however, the same limits as <code>content_scripts</code>: it can reach the DOM and native JS functionality, bot not user added JS. An example:</p> <pre><code>// Inside a `background_page`: chrome.tabs.executeScript(null, { "code": "document.body.removeChild(document.body.firstChild);" }); </code></pre> <p>This works, because only access to the page's (always existing) DOM is required. The following won't work (assuming jQuery was included in the webpage itself):</p> <pre><code>// Still inside a `background_page`: chrome.tabs.executeScript(null, { "code": "jQuery('input').remove();" }); </code></pre> <p>This won't work, because <code>jQuery</code> is a foreign, non-native, user-added JS object that's inaccessible to the extension (both <code>background_page</code> and <code>content_scripts</code>).<br> I don't really understand the reason for this last limitation, but it's all about sandboxing and security in Chrome =) Which is a good thing I guess...</p> <p><strong>BTW</strong><br> I think the solution to your problem is quite simple... You can make the <code>browser_action</code> inject external JS into the page's DOM. That's enough, right? The external JS contains logic AND the actual function call. Better solution all around, because the external JS is only loaded when the <code>browser_action</code> (button) is pushed/triggered. One very slight downside: a very short delay (= downloading the external JS after pushing the <code>browser_action</code>).</p> <p>Might I suggest again: put all your extension JS into the extension. This will allow offline functionality and never require a(nother) connection to a third party server.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload