🐛 修复 PR #1331 Copilot review 提出的 5 处问题

- src/runtime/content/utils.ts: 补回漏掉的分号
- src/runtime/content/utils.ts: addStyleSheet 增加特性检测，旧浏览器
  （无 Constructable Stylesheets / adoptedStyleSheets）回退到 <style> 注入
- src/pkg/utils/monaco-editor: declare-global quickfix 标题改用 multiLang，
  补全 7 种语言的 declareGlobal key（之前硬编码中文）
- src/pages/components/CodeEditor: diff editor 的两个 createModel 在 cleanup
  里显式 dispose，避免反复挂载导致 standalone model 泄漏
- src/pages/options/routes/script/ScriptEditor: 跟踪 addAction/onKeyUp 返回的
  IDisposable 并清理；使用 ref 避免 stale closure；移除对 editor 实例的
  二次 dispose（CodeEditor 已自行管理生命周期）

Author: CodFrm

src/pages/components/CodeEditor/index.tsx

@@ -138,6 +138,8 @@ const CodeEditor: React.ForwardRefRenderFunction<
       largeFileOptimizations: true,
       colorDecorators: true,
     } as const;
+    let originalModel: editor.ITextModel | undefined;
+    let modifiedModel: editor.ITextModel | undefined;
     if (diffCode) {
       edit = editor.createDiffEditor(inlineDiv, {
         hideUnchangedRegions: {
@@ -149,9 +151,12 @@ const CodeEditor: React.ForwardRefRenderFunction<
         diffWordWrap: "off",
         ...commonEditorOptions,
       });
+      // standalone model 不会随 editor.dispose 自动清理，需手动跟踪并在 cleanup 释放
+      originalModel = editor.createModel(diffCode, "javascript");
+      modifiedModel = editor.createModel(code, "javascript");
       edit.setModel({
-        original: editor.createModel(diffCode, "javascript"),
-        modified: editor.createModel(code, "javascript"),
+        original: originalModel,
+        modified: modifiedModel,
       });
     } else {
       edit = editor.create(inlineDiv, {
@@ -168,6 +173,8 @@ const CodeEditor: React.ForwardRefRenderFunction<
       // 目前会出现：Uncaught (in promise) Canceled: Canceled
       // 问题追踪：https://github.com/microsoft/monaco-editor/issues/4702
       edit?.dispose();
+      originalModel?.dispose();
+      modifiedModel?.dispose();
     };
   }, [code, diffCode]);
 

src/pages/options/routes/script/ScriptEditor.tsx

@@ -1,7 +1,8 @@
 /* eslint-disable no-shadow */
 import { Script, ScriptDAO } from "@App/app/repo/scripts";
 import CodeEditor from "@App/pages/components/CodeEditor";
-import React, { useCallback, useEffect, useState } from "react";
+import React, { useCallback, useEffect, useRef, useState } from "react";
+import type { IDisposable } from "monaco-editor";
 import { useNavigate, useParams, useSearchParams } from "react-router-dom";
 import { editor, KeyCode, KeyMod } from "monaco-editor";
 import {
@@ -59,31 +60,50 @@ const Editor: React.FC<{
     [node]
   );
 
+  // 用 ref 拿到最新的 hotKeys/onChange/callbackEditor，避免 stale closure
+  // 同时让 effect 仅在 editor 实例变化时重跑（不会因父组件重渲染重复 addAction）
+  const hotKeysRef = useRef(hotKeys);
+  const onChangeRef = useRef(onChange);
+  const callbackEditorRef = useRef(callbackEditor);
+  const scriptRef = useRef(script);
+  hotKeysRef.current = hotKeys;
+  onChangeRef.current = onChange;
+  callbackEditorRef.current = callbackEditor;
+  scriptRef.current = script;
+
   useEffect(() => {
     if (!node || !node.editor) {
       return;
     }
     // @ts-ignore
     if (!node.editor.uuid) {
       // @ts-ignore
-      node.editor.uuid = script.uuid;
+      node.editor.uuid = scriptRef.current.uuid;
     }
-    hotKeys.forEach((item) => {
-      node.editor.addAction({
-        id: item.id,
-        label: item.title,
-        keybindings: [item.hotKey],
-        run(editor) {
-          // @ts-ignore
-          item.action(script, editor);
-        },
-      });
-    });
-    node.editor.onKeyUp(() => {
-      onChange(node.editor.getValue() || "");
+    const disposables: IDisposable[] = [];
+    hotKeysRef.current.forEach((item) => {
+      disposables.push(
+        node.editor.addAction({
+          id: item.id,
+          label: item.title,
+          keybindings: [item.hotKey],
+          run(editor) {
+            // @ts-ignore
+            item.action(scriptRef.current, editor);
+          },
+        })
+      );
     });
-    callbackEditor(node.editor);
-    return node.editor.dispose.bind(node.editor);
+    disposables.push(
+      node.editor.onKeyUp(() => {
+        onChangeRef.current(node.editor.getValue() || "");
+      })
+    );
+    callbackEditorRef.current(node.editor);
+    // editor 实例本身由 CodeEditor 自身负责 dispose，这里仅清理本 effect 注册的 listener/action
+    return () => {
+      disposables.forEach((d) => d.dispose());
+    };
   }, [node?.editor]);
 
   return (

src/pkg/utils/monaco-editor/index.ts

@@ -195,7 +195,7 @@ export function registerEditor() {
             }
 
             actions.push({
-              title: `将 '${globalName}' 声明为全局变量 (/* global */)`,
+              title: multiLang.declareGlobal.replace("{0}", globalName),
               diagnostics: [val],
               kind: "quickfix",
               edit: { edits: [{ resource: model.uri, textEdit, versionId: undefined }] },

src/pkg/utils/monaco-editor/langs.ts

@@ -6,6 +6,7 @@ export const editorLangs = {
     quickfix: "修复 {0} 问题",
     addEslintDisableNextLine: "添加 eslint-disable-next-line 注释",
     addEslintDisable: "添加 eslint-disable 注释",
+    declareGlobal: "将 '{0}' 声明为全局变量 (/* global */)",
     prompt: {
       name: "脚本名称",
       namespace: "脚本命名空间",
@@ -81,6 +82,7 @@ tracking：该脚本会追踪你的用户信息`.replace(/\n/g, "<br>"),
     quickfix: "Fix {0} Issue",
     addEslintDisableNextLine: "Add eslint-disable-next-line Comment",
     addEslintDisable: "Add eslint-disable Comment",
+    declareGlobal: "Declare '{0}' as a global variable (/* global */)",
     prompt: {
       name: "Script name",
       namespace: "Script namespace",
@@ -149,6 +151,7 @@ tracking：该脚本会追踪你的用户信息`.replace(/\n/g, "<br>"),
     quickfix: "修復 {0} 問題",
     addEslintDisableNextLine: "新增 eslint-disable-next-line 註解",
     addEslintDisable: "新增 eslint-disable 註解",
+    declareGlobal: "將 '{0}' 宣告為全域變數 (/* global */)",
     prompt: {
       name: "腳本名稱",
       namespace: "腳本命名空間",
@@ -217,6 +220,7 @@ tracking：该脚本会追踪你的用户信息`.replace(/\n/g, "<br>"),
     quickfix: "{0} の問題を修正",
     addEslintDisableNextLine: "eslint-disable-next-line コメントを追加",
     addEslintDisable: "eslint-disable コメントを追加",
+    declareGlobal: "'{0}' をグローバル変数として宣言 (/* global */)",
     prompt: {
       name: "スクリプト名",
       namespace: "スクリプトの名前空間",
@@ -285,6 +289,7 @@ tracking：该脚本会追踪你的用户信息`.replace(/\n/g, "<br>"),
     quickfix: "{0}-Problem beheben",
     addEslintDisableNextLine: "eslint-disable-next-line Kommentar hinzufügen",
     addEslintDisable: "eslint-disable Kommentar hinzufügen",
+    declareGlobal: "'{0}' als globale Variable deklarieren (/* global */)",
     prompt: {
       name: "Skriptname",
       namespace: "Skript-Namensraum",
@@ -353,6 +358,7 @@ tracking：该脚本会追踪你的用户信息`.replace(/\n/g, "<br>"),
     quickfix: "Sửa lỗi {0}",
     addEslintDisableNextLine: "Thêm chú thích eslint-disable-next-line",
     addEslintDisable: "Thêm chú thích eslint-disable",
+    declareGlobal: "Khai báo '{0}' là biến toàn cục (/* global */)",
     prompt: {
       name: "Tên script",
       namespace: "Namespace của script",
@@ -421,6 +427,7 @@ tracking：该脚本会追踪你的用户信息`.replace(/\n/g, "<br>"),
     quickfix: "Исправить проблему {0}",
     addEslintDisableNextLine: "Добавить комментарий eslint-disable-next-line",
     addEslintDisable: "Добавить комментарий eslint-disable",
+    declareGlobal: "Объявить '{0}' как глобальную переменную (/* global */)",
     prompt: {
       name: "Имя скрипта",
       namespace: "Пространство имён скрипта",

src/runtime/content/utils.ts

@@ -1,6 +1,6 @@
 import { type ScriptRunResource } from "@App/app/repo/scripts";
 import { has } from "@App/pkg/utils/lodash";
-import { sourceMapTo } from "@App/pkg/utils/utils"
+import { sourceMapTo } from "@App/pkg/utils/utils";
 
 // 构建脚本运行代码
 export function compileScriptCode(scriptRes: ScriptRunResource): string {
@@ -293,12 +293,24 @@ export function addStyle(css: string): HTMLStyleElement {
   return document.documentElement.appendChild(dom);
 }
 
-export function addStyleSheet(css: string): CSSStyleSheet {
+export function addStyleSheet(css: string): CSSStyleSheet | HTMLStyleElement {
   // see https://unarist.hatenablog.com/entry/2020/07/06/012540
-  const sheet = new CSSStyleSheet();
-  // it might return as Promise
-  sheet.replaceSync(css);
-  // adoptedStyleSheets is FrozenArray so it has to be re-assigned.
-  document.adoptedStyleSheets = document.adoptedStyleSheets.concat(sheet);
-  return sheet;
+  // 旧浏览器（如 Firefox 100 以下）不支持 Constructable Stylesheets / adoptedStyleSheets，回退到 <style> 注入
+  if (
+    typeof CSSStyleSheet === "function" &&
+    "replaceSync" in CSSStyleSheet.prototype &&
+    "adoptedStyleSheets" in Document.prototype
+  ) {
+    try {
+      const sheet = new CSSStyleSheet();
+      // it might return as Promise
+      sheet.replaceSync(css);
+      // adoptedStyleSheets is FrozenArray so it has to be re-assigned.
+      document.adoptedStyleSheets = document.adoptedStyleSheets.concat(sheet);
+      return sheet;
+    } catch {
+      // 个别环境下 new CSSStyleSheet() 仍可能抛出，落到 <style> fallback
+    }
+  }
+  return addStyle(css);
 }