Chrome extension can not access custom window properties - google-chrome

Im trying to write a Chrome extension that has a dev tools panel. This extension needs to call functions defined on a property on window in a webpage that I also have made. In other words, the extension is only for my own web page and I control both. Example:
// This script is added in my own webpage application when it loads
window.myTest = () => { /* do something */ }
I want to be able to call the function window.myTest from my Chrome extension. I need to make similar functionality like https://github.com/zalmoxisus/redux-devtools-extension.
It seems that I need to do this by inject script/code from my backend page. I have all working, extension with backend page that gets invoked and I can see that the code that I inject gets called in the page context (testing by console.log gets written to the console output of the page).
Here is my code:
manifest.json
{
"manifest_version": 2,
"name": "MyTest",
"description": "MyTest",
"version": "0.0.1",
"minimum_chrome_version": "10.0",
"devtools_page": "devtools.html",
"background": {
"scripts": ["background.js"]
},
"content_scripts": [{
"matches": ["<all_urls>"],
"js": ["testscript.js"]
}],
"permissions": [
"tabs",
"<all_urls>"
]
}
testscript.js
window.myTest(); // myTest is undefined in the context of the injected script
background.js
// empty, but here to be able to open background page
I also have a pannel that sends a message to the background page when a button is clicked. I know that the panel and sending the message also work. But window.myTest is still undefined.
Edit
Removed the injection from background.js, because I did not use it and have same issue as described.

Finally, I got the specs on this. Mozilla and Chrome follow the same specs for extensions.
Content scripts get a "clean" view of the DOM. This means:
Content scripts cannot see JavaScript variables defined by page
scripts.
If a page script redefines a built-in DOM property, the
content script sees the original version of the property, not the
redefined version.
https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Content_scripts

Related

Binding extension content scripts to Chrome's start page?

Is there any way to bind a content script to Chrome's start page?
I tried setting matches to "*", but it doesn't even run. With "*://*/*" it does not bind.
No, you cannot*. Technically, the start page is chrome://newtab/, and Chrome Extensions cannot access chrome:// pages for security reasons, not even with the widest "<all_urls>" permission.
Your only hope is to make your own New Tab page, though it would be hard to replicate all of the default functionality (e.g. thumbnails of top sites).
* One can enable this with Chrome Flags: chrome://flags/#extensions-on-chrome-urls But this is only applicable if the extension is for personal use and is a potential security risk.
Yes! Chrome's Start page (¿now?) has the hidden URL of the form:
https://www.google.com/_/chrome/newtab?espv=2&ie=UTF-8
And extensions with manifest.jsons like:
{
"manifest_version": 2,
"content_scripts": [ {
"js": [ "HelloWorld.js" ],
"matches": [ "*://*/_/chrome/newtab*" ]
} ],
"name": "Chrome start test",
"description": "Runs on the Chrome Start page",
"version": "1"
}
...run perfectly well on the Start page.

Chrome Packaged app communication with webpage

I have used chrome packaged app that Chrome-Serial-App-master
enter link description here
Manifest
"app": {
"background": {
"scripts": [
"main.js"
]
}
},
"permissions": [
"serial"
]
I want to receive value from packaged app to my website at text box area
Can I access my webpage Dom ?
or use message passing?
Not sure I understand the question, but you can use XMLHttpRequest to read the HTML of any webpage and then display that by setting the innerHTML property of some element.
You can use message passing. You can use chrome.runtime.onMessageExternal or chrome.runtime.onConnectExternal chrome APIs for this purpose.

Create an alert every page load with Chrome extension

This is my first time messing around with extensions and what I am trying to do is very simple yet I can't seem to get it to work.
I simply want an alert to be called every time a page on google is loaded.
In my manifest.json I have:
{
"name": "Bypass shib",
"version": "1.0",
"content_scripts": [
{
"matches": ["http://www.google.com/*"],
"js": ["secondScript.js"]
}
],
"manifest_version": 2
}
Okay now in my secondScript.js I have:
chrome.tabs.executeScript(null, {code: "alert('test')"});
Shouldn't this execute the alert whenever a page is loaded? If not can somebody explain why it's not?
The console reveals the following message:
Uncaught Error: "executeScript" can only be used in extension processes.
See the content scripts documentation for more details.
This post suggests "Chrome extension functions cannot be used in content scripts," which could be what you're running into.
For completeness, the secondScript.js that worked for me was as follows:
console.log("test");
//chrome.tabs.executeScript(null, {code: "alert('test')"});
alert("test");
Content scripts do not have access to any of the chrome.tabs.* API methods.
To display an alert on every page, remove the chrome.tabs.executeScript method, and let your secondScript.js just contain:
alert('Test');
In a Chrome extension, there are three different kinds of scopes in which JavaScript can run. The understanding of this separation is essential for writing Chrome extensions, see this answer.

"exclude_matches" in manifest.json does nothing?

I'm having a problem controlling what pages my content scripts are injected into. The chrome extension developer guide specifies that I can use an "exclude_matches" directive in my manifest.json to exclude certain pages from injection.
However, this doesn't seem to have any effect. My content script still executes on pages that I have specified as ignored.
I have put the steps to reproduce in a Gist. The code is also available on Github.
Any ideas what I'm doing wrong?
manifest.json
{
"name": "Testing Extension",
"version": "1.0",
"description": "Test the chrome extensions exclude_matches.",
"content_scripts": [{
"matches": ["http://*/*", "https://*/*"],
"exclude_matches": ["http://news.ycombinator.com/"],
"js": ["content.js"]
}]
}
content.js
console.log("hello from the content script");
This is Bug #100106. exclude_matches do not function properly.
To solve the problem, use exclude_globs instead of exclude_matches.
Also, your exclude_matches rule does only match http://news.ycombinator.com/.
Suffice the pattern with an asterisk to match the whole site: http://news.ycombinator.com/*.
See also: Match patterns.

How can i create a new tab via browserAction and then execute a script

I want to create a tab by clicking on the browser action button and then insert a content script or execute a script. So far, its not working well.
Background.html
chrome.browserAction.onClicked.addListener(function(tab)
{
chrome.tabs.create({url: "Dreamer.html"}, function(tab) //Dreamer.html is a file in my extension
{
//Add a script
chrome.tabs.executeScript(tab.id, {file:'Dreamer.js'});
});
});
Manifest.json
{
"name" : " Dreamer",
"version" : "0.1",
"description" : "My extensionr",
"browser_action" : {"default_icon" : "App/AppData/Images/icon.png", "default_title":"Start Dreamer" },
"background_page" : "App/AppData/background.html",
"content_scripts" :[{"matches":["http://*/*"],"js":["app/view/UIManager.js"]}],
"permissions": [ "cookies", "tabs", "http://*/*", "https://*/*" ]
}
i get this error in the background page
Error during tabs.executeScript: Cannot access contents of url "chrome-extension://femiindgnlfpdpajimkmldpgpccngfmd/Dreamer.html". Extension manifest must request permission to access this host.
I would really like to know how to create a tab(new tab) and run a script immediately
EDIT:
The kind of application i am creating requires the following actions:
-Allow user to create new tab by clicking the browserAction button
-On creation of the new tab, a file in my extension (Dreamer.html) is opened
-Add a content script or execute a script in the new tab
Thanks
Is there any particular reason you need to inject the script? Since both Dreamer.html and Dreamer.js seem to be hardcoded, you could just include <script type="text/javascript" src="Dreamer.js"></script> in the former, right?
As a side benefit, if you need it to send info to the background page, you can access it directly with chrome.extension.getBackgroundPage() instead of setting up complex listeners that usually come with content scripts, too.
Injecting content scripts is for injecting scripts outside the extension sandbox. Dreamer.html, however, is a part of the extension.
Edit
If you do want an (unwieldy) example of how to execute a script in an extension page, see here:
http://code.google.com/p/chromium/issues/detail?id=30756#c11
I don't think it applies to your case, however.