make it work somehow

src/bg.js

@@ -1,16 +1,19 @@
-var getFavicon = function(){
+const kTST_ID = 'treestyletab@piro.sakura.ne.jp';
-	var favicon = undefined;
+const MY_EXTENSION_NAME = 'tab-groupcolor';
-	var nodeList = document.getElementsByTagName("link");
-	for (var i = 0; i < nodeList.length; i++)
-	{
-		if ((nodeList[i].getAttribute("rel") == "icon") || (nodeList[i].getAttribute("rel") == "shortcut icon")) {
-			favicon = nodeList[i].getAttribute("href");
-		}
-	}
-	return favicon;
-}
 
 var changeIcon = function(color) {
+	var getFavicon = function(){
+		var favicon = undefined;
+		var nodeList = document.getElementsByTagName("link");
+		for (var i = 0; i < nodeList.length; i++)
+		{
+			if ((nodeList[i].getAttribute("rel") == "icon") || (nodeList[i].getAttribute("rel") == "shortcut icon")) {
+				favicon = nodeList[i].getAttribute("href");
+			}
+		}
+		return favicon;
+	};
+
 	var canvas = document.createElement('canvas');
 	canvas.width = 16;
 	canvas.height = 16;
@@ -28,7 +31,7 @@ var changeIcon = function(color) {
 		link.href = canvas.toDataURL("image/x-icon");
 		document.getElementsByTagName('head')[0].appendChild(link);
 	}
-}
+};
 
 var generateRandomColor = function(seed) {
 	var selectColor = function (colorNum, colors){
@@ -39,6 +42,69 @@ var generateRandomColor = function(seed) {
 	}
 
 	return selectColor(seed, 8);
-}
+};
 
-changeIcon(generateRandomColor(1));
+var registerToTST = async function() {
+	try {
+		var success = await browser.runtime.sendMessage(kTST_ID, {
+			type: 'register-self',
+			// The name of your addon (string, optional)
+			name: MY_EXTENSION_NAME
+		});
+	} catch (e) {
+		// TST is not available
+	}
+};
+
+//returns the index of the tabs array object that contains the tab with the passed id
+var getTabParent = (tabs, id, currentTopLevelTabPos) => {
+	for (let i = 0; i < tabs.length; i++) {
+
+		//on a root node because there is no opener
+		if (typeof(tabs[i].openerTabId) === 'undefined' || tabs[i].openerTabId === tabs[i].id) {
+			currentTopLevelTabPos = i;
+		}
+
+		if (tabs[i].id === id) {
+			return currentTopLevelTabPos;
+		} else {
+			if (tabs[i].children && tabs[i].children.length > 0) {
+				let ret = getTabParent(tabs[i].children, id, currentTopLevelTabPos);
+				if (ret) {
+					return ret;
+				}
+			}
+		}
+	}
+};
+
+//events
+//register to tst
+browser.runtime.onMessageExternal.addListener((aMessage, aSender) => {
+	if (aSender.id === kTST_ID) {
+		switch (aMessage.type) {
+			case 'ready':
+				registerToTST(); // passive registration for secondary (or after) startup
+				break;
+		}
+	}
+});
+
+//when a tab is created
+browser.tabs.onUpdated.addListener(async (tabId, changeInfo, tab) => {
+	var tstTab = await browser.runtime.sendMessage(kTST_ID, {
+		type: 'get-tree',
+		window:  tab.windowId
+	});
+
+	if (tab.status === 'complete') {
+		console.log(changeIcon.toString() + '(' + generateRandomColor(getTabParent(tstTab, tab.id)) + ')');
+
+		browser.tabs.executeScript(tab.id, {
+			code: '(' + changeIcon.toString() + ')("' + generateRandomColor(getTabParent(tstTab, tab.id)) + '")'
+		});
+		changeIcon(generateRandomColor(getTabParent(tstTab, tab.id)));
+	}
+});
+
+registerToTST(); // aggressive registration on initial installation

src/manifest.json

@@ -1,7 +1,19 @@
 {
   "description": "color tabs based on their parent.",
   "manifest_version": 2,
-  "name": "colortabgroups",
+  "name": "tab-groupcolor",
   "version": "0.0.1",
-  "homepage_url": "https://git.e.tern.al/s2/colortabgroups",
+  "homepage_url": "https://git.e.tern.al/s2/tab-groupcolor",
+  "applications": {
+    "gecko": {
+      "id": "tab-groupcolor@31337.it",
+      "strict_min_version": "57.0"
+    }
+  },
+  "background": {
+    "scripts": ["bg.js"]
+  },
+  "permissions": [
+    "<all_urls>"
+  ]
 }