make indicator larger

README.md

@@ -2,6 +2,8 @@
 
 ## What it does
 
+**Please install [Tree Style Tab](https://addons.mozilla.org/firefox/addon/tree-style-tab/) before installing this extension, because this extension depends on it!**
+
 This addon would like to color tabs based on the parent tab that opened the tab.  
 So say I am at work searching for a solution to a javascript problem on stackoverflow, so I open a bunch of tabs with possible solutions. Then I get distracted, and I start looking for honey badger images on google images, I open a bunch of tabs with honey badger images.  
 Now all my tabs are mixed up with javascript snippets and honey badgers.
@@ -12,4 +14,7 @@ At the moment this is not possible because of Firefox bug [1320585](https://bugz
 
 So this extension **tries** to get the favicon of the newly opened tab, and changes the color of the favicon to match that of the parent.
 
-**Please install [Tree Style Tab](https://addons.mozilla.org/firefox/addon/tree-style-tab/) before installing this extension, because this extension depends on it!**
+But it will not work
+- on pages that don't allow content scripts (amo for example)
+- on pages that dynamically change the favicon
+- a lot of other cases

src/bg.js

@@ -7,11 +7,17 @@ var changeIcon = function(color, currentIcon) {
 	canvas.height = 16;
 	var ctx = canvas.getContext('2d');
 	var img = new Image();
-	img.src = currentIcon;
+
+	if (currentIcon && typeof(currentIcon) !== 'undefined' && currentIcon !== null && currentIcon !== 'undefined') {
+		img.src = currentIcon;
+	} else {
+		img.src = 'data:image/x-icon;base64,AAABAAEAEBACAAEAAQCwAAAAFgAAACgAAAAQAAAAIAAAAAEAAQAAAAAAgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA////AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD//wAA//8AAP//AAD//wAA//8AAP//AAD//wAA//8AAP//AAD//wAA//8AAP//AAD//wAA//8AAP//AAD//wAA';
+	}
+
 	img.onload = function() {
 		ctx.drawImage(img, 0, 0);
 		ctx.fillStyle = color;
-		ctx.fillRect(0, 0, 2, 16);
+		ctx.fillRect(0, 0, 3, 16);
 
 		var link = document.createElement('link');
 		link.type = 'image/x-icon';
@@ -85,6 +91,7 @@ var updateAllColorsOnAllTabs = async () => {
 
 				if (tabs[i].status === 'complete') {
 					let t = getTabParent(tstTabs, tabs[i].id);
+
 					browser.tabs.executeScript(tabs[i].id, {
 						code: '(' + changeIcon.toString() + ')' +
 							'("' + generateRandomColor(t.parentIndex) + '", "' + t.faviconUrl + '")'

src/manifest.json

@@ -2,7 +2,7 @@
   "description": "Color tabs based on their parent.",
   "manifest_version": 2,
   "name": "Color Tab Group",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "homepage_url": "https://git.e.tern.al/s2/tab-groupcolor",
   "icons": {
     "48": "img/icon-48.png"