feat(script|web|app): add commander line support, and update web view

.npmrc

@@ -0,0 +1 @@
+node-linker=hoisted

package.json

@@ -15,6 +15,9 @@
         "gulp": "gulp  --allowEmpty"
     },
     "dependencies": {
+        "@playwright/test": "^1.18.1",
+        "dayjs": "^1.10.7",
+        "depcheck": "^1.4.3",
         "electron-store": "^8.0.1",
         "playwright": "^1.18.1"
     },

packages/app/electron.builder.json

@@ -23,5 +23,10 @@
         "icon": "public/favicon.ico",
         "artifactName": "${productName}-${version}-setup-${os}-${arch}.${ext}",
         "target": "default"
+    },
+    "fileAssociations": {
+        "ext": "ocs",
+        "icon": "public/favicon.ico",
+        "name": "ocs 脚本"
     }
 }

packages/app/index.js

@@ -1,54 +1,61 @@
-const { app, BrowserWindow, ipcMain } = require("electron");
+// @ts-check
+
+const { app, ipcMain, BrowserWindow } = require("electron");
 const Store = require("electron-store");
-const path = require("path");
+const Logger = require("./src/logger");
+const { handleOpenFile } = require("./src/tasks/handle.file.open");
+const { openWindow } = require("./src/main");
+const { remoteRegister } = require("./src/tasks/remote.register");
+const { initStore } = require("./src/tasks/init.store");
+const { autoLaunch } = require("./src/tasks/auto.launch");
 
-/**
- * electron store
- */
+const logger = Logger("main");
 const store = new Store();
-exports.store = store;
-require("./src/init.store")(store);
-
-function createWindow() {
-    return new BrowserWindow({
-        minHeight: 400,
-        minWidth: 600,
-        show: false,
-        backgroundColor: "#f8f8f8",
-        titleBarStyle: "hidden",
-        titleBarOverlay: {
-            color: "#fff",
-            symbolColor: "black",
-        },
-        center: true,
-
-        webPreferences: {
-            // 关闭拼写矫正
-            spellcheck: false,
-            webSecurity: true,
-            // 开启node
-            nodeIntegration: true,
-            contextIsolation: false,
-        },
+
+task("OCS启动程序", () =>
+    Promise.all([
+        task("初始化错误处理", () => handleError()),
+        task("初始化本地设置", () => initStore()),
+        task("初始化自动启动", () => autoLaunch()),
+        task("检测启动文件", () => handleOpenFile(logger)),
+        (async () => {
+            /** @type {BrowserWindow} */
+            const win = await task("启动软件", () => open());
+            await task("初始化远程通信模块", () => remoteRegister(win));
+            win.webContents.send("ready");
+        })(),
+    ])
+);
+
+/** 处理错误 */
+function handleError() {
+    app.on("render-process-gone", (e) => {
+        logger.error("render-process-gone", e);
+        process.exit(0);
+    });
+    app.on("child-process-gone", (e) => {
+        logger.error("child-process-gone", e);
+        process.exit(0);
     });
 }
 
-app.whenReady().then(async () => {
-    const win = createWindow();
-
-    if (!app.isPackaged) {
-        /**
-         * using `mode` options to prevent issue : {@link https://github.com/electron/electron/issues/32702}
-         */
-        await win.loadURL("http://localhost:3000");
-        win.webContents.openDevTools({ mode: "detach" });
-    } else {
-        await win.loadFile("./public/index.html");
-    }
-    win.show();
-    app.on("activate", () => {
-        if (BrowserWindow.getAllWindows().length === 0) {
-            createWindow();
-        }
+/** 等待显示 */
+async function open() {
+    return new Promise((resolve) => {
+        app.whenReady().then(async () => {
+            const win = await openWindow();
+
+            win.setAlwaysOnTop(Boolean(store.get("alwaysOnTop") || false));
+
+            resolve(win);
+        });
     });
-});
+}
+
+/** 注册任务 */
+async function task(name, func) {
+    const time = Date.now();
+    const res = await func();
+    logger.debug({ task: name, time: Date.now() - time });
+    return res;
+}

packages/app/package.json

@@ -9,12 +9,14 @@
         "dist": "electron-builder --config ./electron.builder.json"
     },
     "devDependencies": {
+        "electron": "17.0.0",
         "electron-builder": "^22.14.13"
     },
     "dependencies": {
         "@ocsjs/scripts": "workspace:^1.0.0",
+        "dayjs": "^1.10.7",
         "electron-store": "^8.0.1",
-        "pino": "^7.6.5"
+        "pino": "^7.8.0"
     },
     "repository": {
         "type": "git",

packages/app/src/logger.js

@@ -0,0 +1,29 @@
+//@ts-check
+
+const { pino } = require("pino");
+const { app } = require("electron");
+const path = require("path");
+const dayjs = require("dayjs");
+
+module.exports = function logger(name) {
+    const dest = path.join(app.getPath("logs"), "/", dayjs().format("YYYY-MM-DD"), "/", name + ".log");
+
+    return pino(
+        {
+            base: null,
+            formatters: {
+                level(label, number) {
+                    return { level: label };
+                },
+            },
+            timestamp: () => `,"time":"${new Date(Date.now()).toLocaleString()}"`,
+            level: "debug",
+        },
+        pino.destination({
+            dest,
+            append: true,
+            mkdir: true,
+            sync: false,
+        })
+    );
+};

packages/app/src/main.js

@@ -0,0 +1,50 @@
+// @ts-check
+const { BrowserWindow, app } = require("electron");
+
+
+app.disableHardwareAcceleration()
+
+function createWindow() {
+    return new BrowserWindow({
+        minHeight: 400,
+        minWidth: 600,
+        center: true,
+        autoHideMenuBar: true,
+        show: false,
+        webPreferences: {
+            // 关闭拼写矫正
+            spellcheck: false,
+            webSecurity: true,
+            // 开启node
+            nodeIntegration: true,
+            contextIsolation: false,
+        },
+    });
+}
+
+async function openWindow() {
+    const win = createWindow();
+
+    if (!app.isPackaged) {
+        /**
+         * using `mode` options to prevent issue : {@link https://github.com/electron/electron/issues/32702}
+         */
+        await win.loadURL("http://localhost:3000");
+        win.webContents.openDevTools({ mode: "detach" });
+    } else {
+        await win.loadFile("./public/index.html");
+    }
+
+    app.on("activate", () => {
+        if (BrowserWindow.getAllWindows().length === 0) {
+            createWindow();
+        }
+    });
+
+    win.show()
+
+    return win;
+}
+
+exports.createWindow = createWindow;
+exports.openWindow = openWindow;

packages/app/src/tasks/auto.launch.js

@@ -0,0 +1,12 @@
+const { app } = require("electron");
+const Store = require("electron-store");
+
+/** 配置自动启动 */
+function autoLaunch() {
+    const store = new Store();
+    app.setLoginItemSettings({
+        openAtLogin: Boolean(store.get("auto-launch") || false),
+    });
+}
+
+exports.autoLaunch = autoLaunch;

packages/app/src/tasks/handle.file.open.js

@@ -0,0 +1,35 @@
+// @ts-check
+
+const { app } = require("electron");
+const fs = require("fs");
+const Store = require("electron-store");
+
+/**
+ * 检测是否打开了(.ocs)拓展文件
+ */
+exports.handleOpenFile = function (logger) {
+    const file = getFile();
+    if (file) {
+        logger.info({ msg: "open file", path: file.path, content: file.content });
+        const store = new Store();
+        /**
+         * 添加新的文件到编辑文件区
+         */
+        const files = store.get("files");
+        const newFiles = Array.isArray(files) ? Array.from(files).concat(file) : [file];
+        store.set("files", newFiles);
+    }
+};
+
+function getFile() {
+    if (app.isPackaged) {
+        if (process.platform === "win32" && process.argv[1]) {
+            if (fs.existsSync(process.argv[1])) {
+                return {
+                    content: fs.readFileSync(process.argv[1]).toString(),
+                    path: process.argv[1],
+                };
+            }
+        }
+    }
+}

packages/app/src/tasks/init.store.js

@@ -0,0 +1,34 @@
+// @ts-check
+
+const Store = require("electron-store");
+const { app } = require("electron");
+const path = require("path");
+const fs = require("fs");
+
+/**
+ * 初始化配置
+ */
+exports.initStore = function () {
+    const store = new Store();
+    if (store.get("version") === undefined) {
+        store.set("version", app.getVersion());
+        store.set("name", app.getName());
+        store.set("user-data-path", app.getPath("userData"));
+        store.set("exe-path", app.getPath("exe"));
+        store.set("logs-path", app.getPath("logs"));
+
+        /** 配置文件路径 */
+        store.set("config-path", path.resolve(app.getPath("userData"), "./config.json"));
+
+        /** 工作台路径 */
+        const workspace = path.resolve(app.getPath("userData"), "./workspace");
+        fs.mkdirSync(workspace, { recursive: true });
+        store.set("workspace", workspace);
+
+        /** 自动启动 */
+        store.set("auto-launch", false);
+
+        /** 置顶 */
+        store.set("alwaysOnTop", false);
+    }
+};

packages/app/src/tasks/remote.register.js

@@ -0,0 +1,37 @@
+const { ipcMain, app, dialog, BrowserWindow } = require("electron");
+const { autoLaunch } = require("./auto.launch");
+
+/**
+ * 注册主进程远程通信事件
+ * @param name 事件前缀名称
+ * @param target 事件目标
+ */
+function registerRemoteEvent(name, target) {
+    ipcMain
+        .on(name + "-get", (event, args) => {
+            const property = args[0];
+            event.returnValue = target[property];
+        })
+        .on(name + "-get", (event, args) => {
+            const [property, value] = [args[0], args[1]];
+            event.returnValue = target[property] = value;
+        })
+        .on(name + "-call", async (event, args) => {
+            const [property, ...value] = [args.shift(), ...args];
+            event.returnValue = await target[property](...value);
+        });
+}
+
+/**
+ *
+ * @param {BrowserWindow} win
+ */
+exports.remoteRegister = function (win) {
+    registerRemoteEvent("win", win);
+    registerRemoteEvent("webContents", win.webContents);
+    registerRemoteEvent("app", app);
+    registerRemoteEvent("dialog", dialog);
+    registerRemoteEvent("methods", {
+        autoLaunch,
+    });
+};