I tried to inject simple Content Script which adds wide border to web-page. The addon works on most sites but on Gogle Maps it does not inject any code. I also tried Content Script which should send message when command ctrl+shift+N is activated and no message is send. In Toolbox I see the content script is injected but why nothing happens? You can try the borderify.js example
Hello,
I do not know if this is the solution. When I wanted to create my first addon, I followed the same example. And I was in the same case. My old message keeps trace. I found the solution by removing the addon installed. In fact it is one of this addon, which blocks.
cordially
I don’t think this is the case of borderify.js . Maybe it adds the border but it is not visible. There are some elements which width is maximum of the client area, the border could be hidden under the elements. So I tried to delete the elements and I removed the styles of body tag. But I still do not see the border from borderify.js
{
"description": "Adds a solid red border to all webpages matching mozilla.org. See https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Examples#borderify",
"manifest_version": 2,
"name": "Borderify",
"version": "1.0",
"homepage_url": "https://github.com/mdn/webextensions-examples/tree/master/borderify",
"icons": {
"48": "icons/border-48.png"
},
"applications": {
"gecko": {
"id": "borderify@mozilla.org",
"strict_min_version": "45.0"
}
},
"content_scripts": [
{
"matches": ["*://maps.google.com/*"],
"js": ["borderify.js"]
}
]
}
I would welcome if I could somehow to suspend the scripts from google to test why no response. But I am not sure if it would help to find the problem. I think the web page would need to be updated or there is now way how to command the Firefox to reconnect / try once more to inject the content script… or to reload the addon connected the the page.
If you install a WebExtension, the content scripts are not applies to existing pages, you have to reload the pages for that to happen.
To immidiatly attach them, you can include this in your background.js:
chrome.tabs.query({ }, tabs => {
chrome.runtime.getManifest().content_scripts.forEach(({ js, css, matches, exclude_matches, }) => {
const includes = (matches|| [ ]).map(p => p === '<all_urls>' ? (/./) : matchPatternToRegExp(p));
const excludes = (exclude_matches|| [ ]).map(matchPatternToRegExp);
chrome.tabs.map(({ id, url, }) => {
if (!url || !includes.some(exp => exp.test(url)) || excludes.some(exp => exp.test(url))) { return; }
css && css.forEach(file => chrome.tabs.insertCSS(id, { file, }));
js && js.forEach(file => chrome.tabs.executeScript(id, { file, }));
});
});
});
function matchPatternToRegExp(pattern) {
const [ , sheme, host, path, ] = matchPattern.exec(pattern);
return new RegExp('^(?:'+
(sheme === '*' ? 'https?' : escape(sheme))
+':\/\/'+
escape(host).replace(/\\\*/g, '[^\/]*')
+'\/'+
escape(path).replace(/\\\*/g, '.*')
+')$');
}
And if you still think your scripts are not attached, then you should try something really basic, like putting a single alert('Hello World!'); in your content.js
Hi,
thank you for the answer, and sorry for my poor english
In my case the problem was ghostery
After removing ghostery, borderify working fine
What do you mean by ghostery? Can you write the original word in your native language?
Of sure. This is what I usually do with all pages and any addon.
Thanks for your code. I have tested it for two sites, for Gogle maps and local search site. For the second the Hello World example works. It is great to see that it auto works. Please, can you describe how your code/function works?
However this is not the case of Gogle maps, it does not work still. So I specified the “matches” to fit requested site and then it should be auto displayed. I believe they must loaded some script which is in collision with webextensions.
ghostery is an addon that I use with Firefox.
The removal addon ghostery, allowed me to use borderify.js
But I have not tested it as much as you, just a few pages Standard
My response was to say that addons can interfere with each other.
Without claiming that this was the solution.
cordially
I have tested two more sites from gogle: picasa and forms and here my example script “Hello World” works, but not on maps.
I would like to know how to suspend the scripts which were loaded by Gogle.
OK, but Gogle maps is not addon, but regular web-page.
Thanks for the information.
It’s a shame from tonight, I have no more internet, otherwise I would have watched more.
In October I will look at two things:
The first is open https://www.openstreetmap.org/#map=5/51.500/-0.100 , A site occupying the weekend my friends and sometimes mine.
Secondly what is regular web-page ? I just post a part of my addon http://www.letime.net/lecjo/MT/ and I think there are many features far from a simple HTML page. Foo google it’s probably the same with hidden code.
The subject interested me really, I test it all in October
cordially
New findings
There is some problem with the example code borderify. I have set
"matches": ["*://*.*.*/*"],
but the border which is in borderify.js:
document.body.style.border = "8px solid blue";
is not visible on any map page.
But when I use my new addon (which is not published) so there is border in the gogle maps!
So I must investigate it more. I needed to delete the body tags to see the border. I also can track messages when I use hotkeys (commands). So gogle maps works definitely.
I mean that the site google is very often used by users (common/ordinary/regular). Favourite page.
The gogle maps problem is that they make the size of the elements so wide that the border is not visible.
I found similar problem on one local map where they have set the z-index. So if I add a toolbox or tooltip into the page, it must have css style z-index: auto; otherwise it will be under the elements of the map.
thank you for the definition
look when I try
https:// (not folo) www.google.fr/maps/@43.6034403,3.8938545,13z
https:// (not folo)
www.google.fr/maps/place/Montpellier/@43.6101248,3.8039502,12z/data=!3m1!4b1!4m5!3m4!1s0x12b6af0725dd9db1:0xad8756742894e802!8m2!3d43.6107564!4d3.8767147
in each acte; the address in the taskbar changes
I tried to correct it but are too numerous and different.
“matches”: ["://maps.google.com/"],
“matches”: ["://google.maps.com/"],
I’ve added the function attachAllContentScripts() to my web-ext-utils project, which is now on npm too. It has a proper description now and you can use it under the MPLv2 license.
Regarding the original topic of this thread:
I downloaded the borderify example, changed the matches key to ["*://*/*"], added it to chrome and visited https://www.google.com/maps/.
And it works: If you open the dev tools, you will see that the body has a red border applied to it. You just won’t see it due to the page layout.
Your address does not follow the rules needed for pattern match
Try:
“matches”: ["://../"],
or
"matches": ["://.google./*"],
Edit: The formating does not work here.
left bracket, "star :// star dot star dot star / star"
or:
left bracket, “star :// star dot star dot fr / star”
Thanks for confirmation.
hello with the two proposals I can not install the addon borderify.js
I tried to
"matches": [":///google*"], …
this done the selft, I can not install the addon (mode debugging)