Feature: Use icon url of browser (#11)

Author: sheepzh

src/background/index.ts

@@ -27,7 +27,7 @@ setInterval(() => {
                             const url = tab.url
                             if (!url) return
                             if (isBrowserUrl(url)) return
-                            const host = extractHostname(url)
+                            const host = extractHostname(url).host
                             if (host) {
                                 hostSet.add(host)
                                 isFocusWindow && tab.active && (focusHost = host)
@@ -63,9 +63,13 @@ chrome.webNavigation.onCompleted.addListener((detail) => {
         return
     }
     chrome.tabs.get(detail.tabId, tab => {
-        const domain = extractHostname(tab.url)
-        const iconUrl = tab.favIconUrl
-        if (!domain || !iconUrl) return
+        const url = tab.url
+        if (!url) return
+        const hostInfo = extractHostname(url)
+        const domain = hostInfo.host
+        const protocol = hostInfo.protocol
+        if (!domain) return
+        const iconUrl = tab.favIconUrl || `chrome://favicon/${protocol ? protocol + '://' : ''}${domain}`
         iconUrlDatabase.put(domain, iconUrl)
     })
 })

src/manifest.js

@@ -37,7 +37,8 @@ module.exports = {
   permissions: [
     'storage',
     'tabs',
-    'webNavigation'
+    'webNavigation',
+    'chrome://favicon/*'
   ],
   browser_action: {
     default_popup: "static/popup.html",

src/util/constant/url.ts

@@ -3,9 +3,10 @@ import { IS_FIREFOX, IS_CHROME, IS_EDGE } from "./environment"
 /**
  * @param domain domain
  * @return Url of domain's favicon
+ * @deprecated 0.1.7
  */
 export function FAVICON(domain: string): string {
-    return `https://favicon-1256916044.cos.ap-guangzhou.myqcloud.com/${domain}`
+    return `chrome://favicon/https://${domain}`
 }
 
 let homePage = undefined

src/util/pattern.ts

@@ -51,15 +51,30 @@ export function isValidMergeOriginHost(host: string) {
     return reg.test(host)
 }
 
-export function extractHostname(url: string) {
-    let hostname: string;
+export type HostInfo = {
+    /**
+     * Including port
+     */
+    host: string
+    protocol: string
+}
+
+export function extractHostname(url: string): HostInfo {
+    let host: string
+    let protocol: string
 
-    if (url.indexOf("//") > -1) {
-        hostname = url.split('/')[2];
+    const indexOfDoubleSlashes = url.indexOf("//")
+    if (indexOfDoubleSlashes > -1) {
+        const splited = url.split('/')
+        host = splited[2]
+        protocol = splited[0]
+        protocol = protocol.substr(0, protocol.length - 1)
     } else {
-        hostname = url.split('/')[0];
+        host = url.split('/')[0]
+        protocol = ''
     }
-    hostname = hostname.split('?')[0];
+    host = host.split('?')[0]
+
+    return { host, protocol }
+}
 
-    return hostname;
-}

test/util/pattern.test.ts

@@ -35,8 +35,9 @@ test('merge domain origin', () => {
 })
 
 test("url", () => {
-    expect(extractHostname('https://www.baidu.com?1231=123')).toEqual('www.baidu.com')
-    expect(extractHostname('http://localhost:8087?1231=123')).toEqual('localhost:8087')
-    expect(extractHostname('http://localhost:8087/')).toEqual('localhost:8087')
-    expect(extractHostname('http://localhost:8087/?123=123')).toEqual('localhost:8087')
+    expect(extractHostname('https://www.baidu.com?1231=123')).toEqual({ host: 'www.baidu.com', protocol: 'https' })
+    expect(extractHostname('http://localhost:8087?1231=123')).toEqual({ host: 'localhost:8087', protocol: 'http' })
+    expect(extractHostname('http://localhost:8087/')).toEqual({ host: 'localhost:8087', protocol: 'http' })
+    expect(extractHostname('http://localhost:8087/?123=123')).toEqual({ host: 'localhost:8087', protocol: 'http' })
+    expect(extractHostname('localhost:8087/?123=123')).toEqual({ host: 'localhost:8087', protocol: '' })
 })