Open popup and change the icon in a Google Chrome Extension - google-chrome

So, I'm trying to do a simple extension for Google Chrome.
What I'm trying to do is: When I click at the icon of my extension it will apppear (the popup.html) and change the icon to default.png.
What I've done so far:
$(document).ready(function() {
chrome.browserAction.onClicked.addListener(function(tab)
{
chrome.browserAction.setIcon({path:"default.png"});
});
});
The problem is... it only shows up the popup.html... the icon doesnt change. :(
May somebody help me??
Thanks in advance

This sample extension on developer.chrome.com does exactly what you want.
A browser action which changes its icon when clicked.

Related

Google Translate shows blank screen in Chrome

Google Translator has stopped working in Chrome 85.0.4183 (also in Canary, Opera, Edge).
For example, after pressing "Translate" button at https://colnect.com/en/collectors/collector/teleawe
it shows "about:blank#blocked". The Translate button itself has "about:invalid#zClosurez" link.
The xhr request to https://translate.googleapis.com/translate_a/t?anno=... is shown as cancelled in devtool console.
Also here is notice about cross-site cookies affected to https://translate.google.com/translate_a/element.js?cb=googleSectionalElementInit&ug=section&hl=en request.
The same link works well in Firefox.
Also https://codepen.io/paul/pen/ZZzEpQ sample works, it's without callback but also shows the translation service still working.
Could you please help me how to fix this issue?
I have the same problem.
I fix it with the following code :
$(document).ready(function(){
setTimeout( function() {
$(".goog-te-gadget-link").click(function(){
$(this).attr('href', 'javascript:;');
});
}, 2000);
});
If you have a better solution, I'll take it :)
Regards
I had same few days ago and fixed by evt.preventDefault(). Just add this to google-translate link. After this translate will work by clicking at link
somePlaceWithThsProblem.$el.on('click', '.goog-te-gadget-link', (event) => {
event.preventDefault();
});

Change the behavior of the bookmark star in Google Chrome?

is there any way for a Chrome Extension to change the behavior of the Google Chrome Bookmark Star Button?
What I want to do:
I want to change the icon of the star (both, the white and the filled yellow version)
When new star button is clicked, it should add a bookmark to Google Chrome just like the original way the button works, but display a custom form instead of Googles default form.
Is that possible? I have not found any way to alter "built-in" functionality in Google Chrome.
However, Google itself does exactly what I want with this extension: https://chrome.google.com/webstore/detail/bookmark-manager/gmlllbghnfkpflemihljekbapjopfjik
By now, I have only found a way to alter the "bookmarks" page itself (https://developer.chrome.com/extensions/override)
Any hints on how to do that?
Thanks!
The Bookmark Manager App added this to its manifest:
"chrome_ui_overrides" : {
"bookmarks_ui": {
"remove_button": "true",
"remove_bookmark_shortcut": "true"
}
},
(as outlined here: https://developer.chrome.com/extensions/ui_override)
However, that seems to work only in Dev channel Chrome with --enable-override-bookmarks-ui=1 start argument or for the Google Bookmark extension itself.

chrome goes back 2 times instead of one time when using history.pushState/location.hash

open a new tab in Chrome (opens http://google.com for example)
open a testpage.htm containing history.pushState({},"test","#lightbox");
which changes the url to testpage.htm#lightbox
if you hit the back button of your chrome the url is changed to http://google.com, which is two states back, not one
firefox and msie10 work both good, so it's a chrome issue
how can i fix this? is there a workaround?
thank you in advance
(feel free to give my question a better title and feel free to correct my english)
notes:
on step 2 you can also use window.location.hash = "#lightbox" but does the same issue
on step 3 you can simulate the back button from within your code, using history.back() and in this very case the url is switched to the correct one testpage.htm, so this is related only to the back button of Chrome's gui
I also tried
window.addEventListener("popstate", function(ev){ ev.preventDefault(); });
window.addEventListener("hashchange", function(ev){ ev.preventDefault(); });
without success :(
Update 2: does the same using History.js

How to detect when the chrome devtools is closed and trigger a function in background.js

I'm currently writing a chrome extension that has it's own panel in the Devtools. Although I'm facing an issue. I'm trying to trigger some action in the background page when the Devtools panel of a specific tab is closed.
I tried adding this to devtools.js :
window.onbeforeunload = function(event) {
port.postMessage({action: 'disableTab', tabId: tabID});
return "Are you sure you want to navigate away?";
};
Although the confirmation is never displayed and the message is never posted.
I think that it's because my devtools.html / devtools.js file isn't the one that is handling the main Devtools panel. it' only appended to it, something like that.
I'm still searching for an answer, anyone knows how I could achieve that ?
Edit:
I just noticed that this app is doing exactly what I want! https://developers.google.com/speed/pagespeed/insights_extensions
Run an analysis, then try closing the devtools, you'll be prompted.

Auto Load a Link

I have this project that I need a modal box to appear when they login for the first time.
I'm using a class called superbox which works well but it's activated by clicking links with href and rel attributes attached.
So I was wondering if there was a way of auto clicking the link on page load.
This is the link below:
Open
Any help would be appreciated,
Thanks.
Okay basically, auto clicking literally doesn't exist. But you can activate the box on pageload.
$(document).ready(function () {
//alert('page was loaded!');
SomeSuperBoxOpeningFunction('content', '470x225');
});
EDIT
But since there is no such feature in superbox plugin. Then lets make a totally alternative fix for that:
http://jsfiddle.net/hobobne/8FLkx/
This is a very very simple idea behind showing some boxes.
I checked the sourcecode of your superbox and found the the following function:
function showBox(curSettings, $elt)