Refactor api of chrome

Author: sheepzh

global.d.ts

@@ -557,3 +557,22 @@ declare namespace timer {
         type Callback<T = any> = (result?: Response<T>) => void
     }
 }
+
+/**
+ * ABBRs for namespace chrome
+ */
+// chrome.tabs
+declare type ChromeTab = chrome.tabs.Tab
+declare type ChromeTabActiveInfo = chrome.tabs.TabActiveInfo
+declare type ChromeTabChangeInfo = chrome.tabs.TabChangeInfo
+// chrome.windows
+declare type ChromeWindow = chrome.windows.Window
+// chrome.contextMenus
+declare type ChromeContextMenuCreateProps = chrome.contextMenus.CreateProperties
+declare type ChromeContextMenuUpdateProps = chrome.contextMenus.UpdateProperties
+// chrome.alarms
+declare type ChromeAlarm = chrome.alarms.Alarm
+// chrome.runtime
+declare type ChromeOnInstalledReason = chrome.runtime.OnInstalledReason
+declare type ChromeMessageSender = chrome.runtime.MessageSender
+declare type ChromeMessageHandler<T = any, R = any> = (req: timer.mq.Request<T>, sender: ChromeMessageSender) => Promise<timer.mq.Response<R>>

src/api/chrome/action.ts

@@ -0,0 +1,11 @@
+import { IS_MV3 } from "@util/constant/environment"
+import { handleError } from "./common"
+
+const action = IS_MV3 ? chrome.action : chrome.browserAction
+
+export function setBadgeText(text: string, tabId: number): Promise<void> {
+    return new Promise(resolve => action?.setBadgeText({ tabId, text }, () => {
+        handleError('setBadgeText')
+        resolve()
+    }))
+}

src/api/chrome/alarm.ts

@@ -0,0 +1,18 @@
+import { handleError } from "./common"
+
+type AlarmHandler = (alarm: ChromeAlarm) => PromiseLike<void> | void
+
+export function onAlarm(handler: AlarmHandler) {
+    chrome.alarms.onAlarm.addListener(handler)
+}
+
+export function clearAlarm(name: string): Promise<void> {
+    return new Promise(resolve => chrome.alarms.clear(name, () => {
+        handleError('clearAlarm')
+        resolve()
+    }))
+}
+
+export function createAlarm(name: string, when: number): void {
+    chrome.alarms.create(name, { when })
+}

src/api/chrome/common.ts

@@ -0,0 +1,8 @@
+export function handleError(scene: string) {
+    try {
+        const lastError = chrome.runtime.lastError
+        lastError && console.log(`Errord when ${scene}: ${lastError.message}`)
+    } catch (e) {
+        console.info("Can't execute here")
+    }
+}

src/api/chrome/context-menu.ts

@@ -0,0 +1,15 @@
+import { handleError } from "./common"
+
+export function createContextMenu(props: ChromeContextMenuCreateProps): Promise<void> {
+    return new Promise(resolve => chrome.contextMenus.create(props, () => {
+        handleError('createContextMenu')
+        resolve()
+    }))
+}
+
+export function updateContextMenu(menuId: string, props: ChromeContextMenuUpdateProps): Promise<void> {
+    return new Promise(resolve => chrome.contextMenus.update(menuId, props, () => {
+        handleError('updateContextMenu')
+        resolve()
+    }))
+}

src/permissions.ts src/api/chrome/permissions.tssrc/permissions.ts renamed to src/api/chrome/permissions.ts

@@ -0,0 +1,41 @@
+import { handleError } from "./common"
+
+export function getRuntimeId(): string {
+    return chrome.runtime.id
+}
+
+export function sendMsg2Runtime<T = any, R = any>(code: timer.mq.ReqCode, data?: T): Promise<R> {
+    const request: timer.mq.Request<T> = { code, data }
+    return new Promise((resolve, reject) => chrome.runtime.sendMessage(request,
+        (response: timer.mq.Response<R>) => {
+            handleError('sendMsg2Runtime')
+            const resCode = response?.code
+            resCode === 'success'
+                ? resolve(response.data)
+                : reject(new Error(response?.msg))
+        })
+    )
+}
+
+export function onRuntimeMessage<T = any, R = any>(handler: ChromeMessageHandler<T, R>): void {
+    // Be careful!!!
+    // Can't use await/async in callback parameter
+    chrome.runtime.onMessage.addListener((message: timer.mq.Request<T>, sender: chrome.runtime.MessageSender, sendResponse: timer.mq.Callback<R>) => {
+        handler(message, sender).then((response: timer.mq.Response<R>) => sendResponse(response))
+        // 'return ture' will force chrome to wait for the response processed in the above promise.
+        // @see https://github.com/mozilla/webextension-polyfill/issues/130
+        return true
+    })
+}
+
+export function onInstalled(handler: (reason: ChromeOnInstalledReason) => void): void {
+    chrome.runtime.onInstalled.addListener(detail => handler(detail.reason))
+}
+
+export function getVersion(): string {
+    return chrome.runtime.getManifest().version
+}
+
+export function setUninstallURL(url: string): Promise<void> {
+    return new Promise(resolve => chrome.runtime.setUninstallURL(url, resolve))
+}

src/api/chrome/runtime.ts

@@ -0,0 +1,53 @@
+import { handleError } from "./common"
+
+export function getTab(id: number): Promise<ChromeTab> {
+    return new Promise(resolve => chrome.tabs.get(id, tab => {
+        handleError("getTab")
+        resolve(tab)
+    }))
+}
+
+export function createTab(param: chrome.tabs.CreateProperties | string): Promise<ChromeTab> {
+    const prop: chrome.tabs.CreateProperties = typeof param === 'string' ? { url: param } : param
+    return new Promise(resolve => chrome.tabs.create(prop, tab => {
+        handleError("getTab")
+        resolve(tab)
+    }))
+}
+
+export function listTabs(query?: chrome.tabs.QueryInfo): Promise<ChromeTab[]> {
+    query = query || {}
+    return new Promise(resolve => chrome.tabs.query(query, tabs => {
+        handleError("listTabs")
+        resolve(tabs || [])
+    }))
+}
+
+export function sendMsg2Tab<T = any, R = any>(tabId: number, code: timer.mq.ReqCode, data: T): Promise<R> {
+    const request: timer.mq.Request<T> = { code, data }
+    return new Promise((resolve, reject) => {
+        chrome.tabs.sendMessage<timer.mq.Request<T>, timer.mq.Response>(tabId, request, response => {
+            handleError('sendMsgTab')
+            const resCode = response?.code
+            resCode === 'success'
+                ? resolve(response.data)
+                : reject(new Error(response?.msg))
+        })
+    })
+}
+
+type TabHandler<Event> = (tabId: number, ev: Event, tab?: ChromeTab) => void
+
+export function onTabActivated(handler: TabHandler<ChromeTabActiveInfo>): void {
+    chrome.tabs.onActivated.addListener((activeInfo: chrome.tabs.TabActiveInfo) => {
+        handleError("tabActivated")
+        handler(activeInfo?.tabId, activeInfo)
+    })
+}
+
+export function onTabUpdated(handler: TabHandler<ChromeTabChangeInfo>): void {
+    chrome.tabs.onUpdated.addListener((tabId: number, changeInfo: ChromeTabChangeInfo, tab: ChromeTab) => {
+        handleError("tabUpdated")
+        handler(tabId, changeInfo, tab)
+    })
+}

src/api/chrome/tab.ts

@@ -0,0 +1,45 @@
+import { handleError } from "./common"
+
+
+export function listAllWindows(): Promise<chrome.windows.Window[]> {
+    return new Promise(resolve => chrome.windows.getAll(windows => {
+        handleError("listAllWindows")
+        resolve(windows || [])
+    }))
+}
+
+export function isNoneWindowId(windowId: number) {
+    return !windowId || windowId === chrome.windows.WINDOW_ID_NONE
+}
+
+export function getFocusedNormalWindow(): Promise<chrome.windows.Window> {
+    return new Promise(resolve => chrome.windows.getLastFocused(
+        // Only find normal window
+        { windowTypes: ['normal'] },
+        window => {
+            handleError('getFocusedNormalWindow')
+            if (!window?.focused || isNoneWindowId(window?.id)) {
+                resolve(undefined)
+            } else {
+                resolve(window)
+            }
+        }
+    ))
+}
+
+export function getWindow(id: number): Promise<chrome.windows.Window> {
+    return new Promise(resolve =>
+        chrome.windows.get(id)
+            .then(win => resolve(win))
+            .catch(_ => resolve(undefined))
+    )
+}
+
+type _Handler = (windowId: number) => void
+
+export function onNormalWindowFocusChanged(handler: _Handler) {
+    chrome.windows.onFocusChanged.addListener(windowId => {
+        handleError('onWindowFocusChanged')
+        handler(windowId)
+    }, { windowTypes: ['normal'] })
+}

src/api/chrome/window.ts

@@ -38,6 +38,7 @@ import { BASE_TITLE_OPTION } from "../common"
 import { getPrimaryTextColor } from "@util/style"
 import { getAppPageUrl } from "@util/constant/url"
 import { REPORT_ROUTE } from "@app/router/constants"
+import { createTab } from "@api/chrome/tab"
 
 const WEEK_NUM = 53
 
@@ -213,7 +214,7 @@ function handleClick(value: _Value): void {
     const query: ReportQueryParam = { ds: currentTs, de: currentTs }
 
     const url = getAppPageUrl(false, REPORT_ROUTE, query)
-    chrome.tabs.create({ url })
+    createTab(url)
 }
 
 class ChartWrapper {