wujie-event-scope 1.0.8 → 1.0.10

package/README.md

@@ -1,2 +1,63 @@
-# wujieEventScope
-处理子应用HTML事件window指向主应用导致undefined的问题
+# wujie-event-scope
+
+在无界（wujie）子应用沙箱中，内联 HTML 事件（如 `onclick`）里的代码往往默认指向**宿主全局 `window`**，访问子应用里挂载的变量或 API 时容易出现 **`undefined` 或跑错环境**。本库在**不改业务写法**的前提下，把事件函数字符串改写为在**子应用代理 `window`** 上执行。
+
+## 目标
+
+- 让 **`onclick` 属性** 与 **`element.onclick` 函数 toString** 两类来源的事件逻辑，在运行时使用的 `window` 与无界子应用一致。
+- 通过 **IIFE 形参遮蔽**：`(function(window) { … })(window.__WUJIE_xxx)`，使补丁里出现的 `window.xxx` 指向传入的代理，而不是宿主全局。
+- 对**函数声明、变量声明、以及裸标识符的简单赋值**（如 `obj = {}`）等会在全局产生「名字」的写法，额外生成 **`window.名字 = 名字`**，把这些绑定同步到形参 `window`（子应用代理）上，避免只在局部存在、代理上读不到的问题。
+
+## 工作原理（简要）
+
+1. **表达式侧改写**（`findIdentifiers`）  
+   用 [Acorn](https://github.com/acornjs/acorn) 遍历代码，收集**调用 callee**、**赋值左侧**等位置；对未包含 `window` 子串的片段前缀 `window.`，把对全局的访问改写成 `window.xxx`，与 IIFE 内形参 `window` 一致。
+
+2. **声明 / 隐式全局绑定同步**（`findDeclarationIdentifiers`）  
+   单独扫描**函数声明**、**变量声明**（含解构左侧）、以及 **`id = …` 且左侧为裸标识符**的简单赋值（脚本语义下会挂到全局对象上的名字）。  
+   对每个收集到的名字 `x`，生成一段 **`window.x = x;`** 拼接进最终可执行字符串。这样在 `(function(window) { … })` 里，先执行用户逻辑产生绑定，再把同名属性挂到**形参 `window`**（无界子应用代理）上，后续通过 `window.xxx` 的读写才能落在同一对象上。
+
+3. **子应用 `window` 注入**
+   - 首次处理某个子应用 `Window` 时，读取 `targetWindow.__WUJIE.id`，生成宿主上的全局路径 `__WUJIE_<规范化后的 id>`（字母数字大写，见 `targetToLNU`），并执行 `window[路径] = targetWindow`。
+   - 路径缓存在 `WeakMap<Window, string>`（`elementDataStore`），同一子应用只注册一次。
+
+4. **回写**  
+   `patchElementHook` 会把改写后的函数体包进：  
+   `(function(window) { … })(window.__WUJIE_xxx)`。  
+   若还需要**声明同步**，请把 `findDeclarationIdentifiers` 返回的 `window.x=x;…` 串在函数体**前部**与经 `findIdentifiers` 处理后的正文拼在一起，再包进同一 IIFE（与无界注入路径一致）。
+
+## 使用
+
+```ts
+import wujieEventScope from "wujie-event-scope";
+```
+
+通过 [WUJIE](https://wujie-micro.github.io/doc/api/preloadApp.html#plugins)提供的Plugins扩展使用
+
+源码中可直接使用：
+
+- `findIdentifiers`：表达式侧改写（`window.xxx` 前缀）。
+- `findDeclarationIdentifiers`：返回 `window.x=x;` 形式的声明同步片段（见 `src/babelParse.ts`）。二者可按需组合
+
+**前提**：子应用 `Window` 上存在无界提供的 `__WUJIE.id`，用于生成稳定的全局路径名。
+
+## 构建
+
+```bash
+npm install
+npm run build
+```
+
+产物：`dist/index.cjs.js`、`dist/index.es.js` 及类型声明。
+
+## 限制与注意
+
+- **覆盖范围**：`findIdentifiers` 只处理扫描到的调用/赋值等位置，并非任意标识符；`!ast.includes('window')` 为启发式判断，极端写法可能漏改或误跳过。
+- **`findDeclarationIdentifiers`**：不包含成员赋值 `a.b =`、复合赋值、普通表达式里的标识符等；与「声明 / 裸 `x =`」语义对齐，复杂场景需自行扩展。
+- **`element.onclick` 路径**：从 `function … () { … }` 字符串中用正则抽取函数体（`fnBody`），复杂嵌套或非 `function` 声明可能不稳定。
+- **安全**：本质仍是执行字符串化后的用户代码；不可信输入场景需配合 CSP、白名单等治理，不能单靠本库视为「安全沙箱」。
+- **多子应用**：通过 `__WUJIE.id` 区分，每个子应用对应宿主上一个 `window.__WUJIE_<…>` 槽位。
+
+## License
+
+ISC

package/dist/index.cjs.js

@@ -6284,6 +6284,26 @@ function simple(node, visitors, baseVisitor, state, override) {
   })(node, state, override);
 }
 
+// A recursive walk is one where your functions override the default
+// walkers. They can modify and replace the state parameter that's
+// threaded through the walk, and can opt how and whether to walk
+// their child nodes (by calling their third argument on these
+// nodes).
+function recursive(node, state, funcs, baseVisitor, override) {
+  var visitor = funcs ? make(funcs, undefined) : baseVisitor
+  ;(function c(node, st, override) {
+    visitor[override || node.type](node, st, c);
+  })(node, state, override);
+}
+
+// Used to create a custom walker. Will fill in all missing node
+// type properties with the defaults.
+function make(funcs, baseVisitor) {
+  var visitor = Object.create(baseVisitor || base);
+  for (var type in funcs) { visitor[type] = funcs[type]; }
+  return visitor
+}
+
 function skipThrough(node, st, c) { c(node, st); }
 function ignore(_node, _st, _c) {}
 
@@ -6619,39 +6639,6 @@ function findIdentifiers(code) {
             if (!callee)
                 return;
             getCallExpression(callee, node.arguments, results);
-            // if (callee.type === "Identifier") {
-            //   results.add({
-            //     ast: callee.name,
-            //     start: callee.start,
-            //     end: callee.end,
-            //   });
-            //   if (Array.isArray(node.arguments) && node.arguments.length > 0) {
-            //     node.arguments.forEach((node: any) => {
-            //       if (node.type === 'Identifier') {
-            //         results.add({
-            //           ast: node.name,
-            //           start: node.start,
-            //           end: node.end,
-            //         });
-            //       } else if (node.type === 'MemberExpression') {
-            //         const memberName = getMemberExpressionPath(callee);
-            //         results.add({
-            //           ast: memberName,
-            //           start: node.start,
-            //           end: node.end,
-            //         });
-            //       }
-            //     })
-            //   }
-            // }
-            // if (callee.type === "MemberExpression") {
-            //   const memberName = getMemberExpressionPath(callee);
-            //   results.add({
-            //     ast: memberName,
-            //     start: callee.start,
-            //     end: callee.end,
-            //   });
-            // }
         },
         AssignmentExpression(node) {
             const left = node.left;
@@ -6676,6 +6663,103 @@ function findIdentifiers(code) {
     });
     return Array.from(results).sort((a, b) => a.start - b.start);
 }
+/** 从解构等 Pattern 中收集绑定名（仅用于变量声明左侧） */
+function collectPatternBindingIds(id, results) {
+    if (!id)
+        return;
+    // 普通声明：let a、const foo = 1、var bar
+    if (id.type === "Identifier") {
+        results.push({ ast: id.name, start: id.start, end: id.end });
+        return;
+    }
+    // 对象解构左侧：const { x, y: z, ...rest } = obj
+    if (id.type === "ObjectPattern") {
+        for (const prop of id.properties) {
+            if (prop.type === "Property") {
+                collectPatternBindingIds(prop.value, results);
+            }
+            else if (prop.type === "RestElement") {
+                collectPatternBindingIds(prop.argument, results);
+            }
+        }
+        return;
+    }
+    // 数组解构左侧：const [a, b, , c] = arr
+    if (id.type === "ArrayPattern") {
+        for (const elt of id.elements) {
+            if (elt)
+                collectPatternBindingIds(elt, results);
+        }
+        return;
+    }
+    // 带默认值的解构项：const { x = 1 } = o 或 const [a = 0] = arr
+    if (id.type === "AssignmentPattern") {
+        collectPatternBindingIds(id.left, results);
+    }
+    // 剩余合并项解构赋值：const { ...rest } = o、const [a, ...tail] = arr
+    if (id.type === "RestElement") {
+        collectPatternBindingIds(id.argument, results);
+    }
+}
+/**
+ * 匹配会在全局（如浏览器 window）上产生「命名绑定」的写法（仅**脚本顶层**，不含嵌套函数体内）：
+ * - 顶层函数声明名（如 `function onclick`）
+ * - 顶层 var/let/const（含解构左侧）
+ * - 顶层对裸标识符的简单赋值 `id = ...`
+ *
+ * 不包含：函数体内的声明、成员赋值 `a.b =`、复合赋值等。
+ */
+function findDeclarationIdentifiers(code) {
+    const state = {
+        functionDepth: 0,
+        results: [],
+    };
+    const ast = parse(code, {
+        ecmaVersion: "latest",
+        sourceType: "module",
+        ranges: true,
+    });
+    const visitors = make({
+        Function(node, st, c) {
+            if (node.type === "FunctionDeclaration" &&
+                node.id &&
+                st.functionDepth === 0) {
+                st.results.push({
+                    ast: node.id.name,
+                    start: node.id.start,
+                    end: node.id.end,
+                });
+            }
+            st.functionDepth++;
+            base.Function(node, st, c);
+            st.functionDepth--;
+        },
+        VariableDeclaration(node, st, c) {
+            if (st.functionDepth === 0) {
+                for (const decl of node.declarations) {
+                    collectPatternBindingIds(decl.id, st.results);
+                }
+            }
+            base.VariableDeclaration(node, st, c);
+        },
+        AssignmentExpression(node, st, c) {
+            if (st.functionDepth === 0 &&
+                node.operator === "=" &&
+                node.left?.type === "Identifier") {
+                st.results.push({
+                    ast: node.left.name,
+                    start: node.left.start,
+                    end: node.left.end,
+                });
+            }
+            base.AssignmentExpression(node, st, c);
+        },
+    }, base);
+    recursive(ast, state, visitors);
+    return state.results.reduce((pv, { ast }) => {
+        return `${pv}window.${ast}=${ast};`;
+    }, "");
+}
 
 const store = new WeakMap();
 function setStoreData(window, path) {
@@ -6706,11 +6790,11 @@ function dealAttributesOCPatch(targetString) {
         }
     });
     replaceAttributeEventStr += `${targetString.slice(lastSliceEnd)}`;
-    console.log("====事件函数处理后字符", replaceAttributeEventStr);
+    // console.log("====事件函数处理后字符", replaceAttributeEventStr)
     return replaceAttributeEventStr;
 }
 function dealHTMLOCPatch(targetString) {
-    console.log("====事件函数原字符", targetString);
+    // console.log("====事件函数原字符", targetString)
     const targetAttrLists = findIdentifiers(targetString);
     let lastSliceEnd = 0;
     let replaceHTMLClickEventStr = '';
@@ -6722,7 +6806,7 @@ function dealHTMLOCPatch(targetString) {
         }
     });
     replaceHTMLClickEventStr += `${targetString.slice(lastSliceEnd)}`;
-    console.log("====事件函数处理后字符", replaceHTMLClickEventStr);
+    // console.log("====事件函数处理后字符", replaceHTMLClickEventStr)
     const fnBodyStr = replaceHTMLClickEventStr.match(fnBody)?.[1];
     return fnBodyStr || '';
 }
@@ -6730,10 +6814,10 @@ function patchElementHook(element, targetWindow) {
     const targetHaveGetAttribute = typeof element.getAttribute === 'function';
     const originHTMLClickEvent = element.onclick;
     const originAttributeEventStr = targetHaveGetAttribute ? element.getAttribute('onclick') : '';
-    if (targetHaveGetAttribute && element.getAttribute('data-test-scope')) {
-        console.log('===HTML事件绑定', originHTMLClickEvent);
-        console.log('===attribute获取事件', originAttributeEventStr);
-    }
+    // if (targetHaveGetAttribute && element.getAttribute('data-test-scope')) {
+    //     console.log('===HTML事件绑定', originHTMLClickEvent)
+    //     console.log('===attribute获取事件', originAttributeEventStr)
+    // }
     let result = '';
     if (originAttributeEventStr) {
         result = dealAttributesOCPatch(originAttributeEventStr);
@@ -6742,13 +6826,13 @@ function patchElementHook(element, targetWindow) {
         result = dealHTMLOCPatch(originHTMLClickEvent.toString());
     }
     if (result) {
-        console.log("====执行字符串", result);
+        // console.log("====执行字符串", result)
         const haveRegister = elementDataStore.hasStoreData(targetWindow);
         if (!haveRegister) {
             // @ts-ignore
             const currentWujieName = targetWindow.__WUJIE.id;
             const targetWindowPath = `__WUJIE_${targetToLNU(currentWujieName)}`;
-            console.log("===存储路径", targetWindowPath);
+            // console.log("===存储路径", targetWindowPath)
             // @ts-ignore
             window[targetWindowPath] = targetWindow;
             elementDataStore.setStoreData(targetWindow, targetWindowPath);
@@ -6757,11 +6841,17 @@ function patchElementHook(element, targetWindow) {
         element.setAttribute('onclick', `(function(window) {
             ${result}
         })(window.${targetWindowPath})`);
-        console.log("===替换之后的结果", element.getAttribute('onclick'));
+        // console.log("===替换之后的结果", element.getAttribute('onclick'))
     }
 }
+function patchInlineCodeHook(target, targetWindow) {
+    const result = findDeclarationIdentifiers(target.code);
+    console.log("===处理后的信息", result);
+    target.code = result;
+}
 var index = {
-    patchElementHook
+    patchElementHook,
+    patchInlineCodeHook
 };
 
 module.exports = index;

package/dist/index.es.js

@@ -6282,6 +6282,26 @@ function simple(node, visitors, baseVisitor, state, override) {
   })(node, state, override);
 }
 
+// A recursive walk is one where your functions override the default
+// walkers. They can modify and replace the state parameter that's
+// threaded through the walk, and can opt how and whether to walk
+// their child nodes (by calling their third argument on these
+// nodes).
+function recursive(node, state, funcs, baseVisitor, override) {
+  var visitor = funcs ? make(funcs, undefined) : baseVisitor
+  ;(function c(node, st, override) {
+    visitor[override || node.type](node, st, c);
+  })(node, state, override);
+}
+
+// Used to create a custom walker. Will fill in all missing node
+// type properties with the defaults.
+function make(funcs, baseVisitor) {
+  var visitor = Object.create(baseVisitor || base);
+  for (var type in funcs) { visitor[type] = funcs[type]; }
+  return visitor
+}
+
 function skipThrough(node, st, c) { c(node, st); }
 function ignore(_node, _st, _c) {}
 
@@ -6617,39 +6637,6 @@ function findIdentifiers(code) {
             if (!callee)
                 return;
             getCallExpression(callee, node.arguments, results);
-            // if (callee.type === "Identifier") {
-            //   results.add({
-            //     ast: callee.name,
-            //     start: callee.start,
-            //     end: callee.end,
-            //   });
-            //   if (Array.isArray(node.arguments) && node.arguments.length > 0) {
-            //     node.arguments.forEach((node: any) => {
-            //       if (node.type === 'Identifier') {
-            //         results.add({
-            //           ast: node.name,
-            //           start: node.start,
-            //           end: node.end,
-            //         });
-            //       } else if (node.type === 'MemberExpression') {
-            //         const memberName = getMemberExpressionPath(callee);
-            //         results.add({
-            //           ast: memberName,
-            //           start: node.start,
-            //           end: node.end,
-            //         });
-            //       }
-            //     })
-            //   }
-            // }
-            // if (callee.type === "MemberExpression") {
-            //   const memberName = getMemberExpressionPath(callee);
-            //   results.add({
-            //     ast: memberName,
-            //     start: callee.start,
-            //     end: callee.end,
-            //   });
-            // }
         },
         AssignmentExpression(node) {
             const left = node.left;
@@ -6674,6 +6661,103 @@ function findIdentifiers(code) {
     });
     return Array.from(results).sort((a, b) => a.start - b.start);
 }
+/** 从解构等 Pattern 中收集绑定名（仅用于变量声明左侧） */
+function collectPatternBindingIds(id, results) {
+    if (!id)
+        return;
+    // 普通声明：let a、const foo = 1、var bar
+    if (id.type === "Identifier") {
+        results.push({ ast: id.name, start: id.start, end: id.end });
+        return;
+    }
+    // 对象解构左侧：const { x, y: z, ...rest } = obj
+    if (id.type === "ObjectPattern") {
+        for (const prop of id.properties) {
+            if (prop.type === "Property") {
+                collectPatternBindingIds(prop.value, results);
+            }
+            else if (prop.type === "RestElement") {
+                collectPatternBindingIds(prop.argument, results);
+            }
+        }
+        return;
+    }
+    // 数组解构左侧：const [a, b, , c] = arr
+    if (id.type === "ArrayPattern") {
+        for (const elt of id.elements) {
+            if (elt)
+                collectPatternBindingIds(elt, results);
+        }
+        return;
+    }
+    // 带默认值的解构项：const { x = 1 } = o 或 const [a = 0] = arr
+    if (id.type === "AssignmentPattern") {
+        collectPatternBindingIds(id.left, results);
+    }
+    // 剩余合并项解构赋值：const { ...rest } = o、const [a, ...tail] = arr
+    if (id.type === "RestElement") {
+        collectPatternBindingIds(id.argument, results);
+    }
+}
+/**
+ * 匹配会在全局（如浏览器 window）上产生「命名绑定」的写法（仅**脚本顶层**，不含嵌套函数体内）：
+ * - 顶层函数声明名（如 `function onclick`）
+ * - 顶层 var/let/const（含解构左侧）
+ * - 顶层对裸标识符的简单赋值 `id = ...`
+ *
+ * 不包含：函数体内的声明、成员赋值 `a.b =`、复合赋值等。
+ */
+function findDeclarationIdentifiers(code) {
+    const state = {
+        functionDepth: 0,
+        results: [],
+    };
+    const ast = parse(code, {
+        ecmaVersion: "latest",
+        sourceType: "module",
+        ranges: true,
+    });
+    const visitors = make({
+        Function(node, st, c) {
+            if (node.type === "FunctionDeclaration" &&
+                node.id &&
+                st.functionDepth === 0) {
+                st.results.push({
+                    ast: node.id.name,
+                    start: node.id.start,
+                    end: node.id.end,
+                });
+            }
+            st.functionDepth++;
+            base.Function(node, st, c);
+            st.functionDepth--;
+        },
+        VariableDeclaration(node, st, c) {
+            if (st.functionDepth === 0) {
+                for (const decl of node.declarations) {
+                    collectPatternBindingIds(decl.id, st.results);
+                }
+            }
+            base.VariableDeclaration(node, st, c);
+        },
+        AssignmentExpression(node, st, c) {
+            if (st.functionDepth === 0 &&
+                node.operator === "=" &&
+                node.left?.type === "Identifier") {
+                st.results.push({
+                    ast: node.left.name,
+                    start: node.left.start,
+                    end: node.left.end,
+                });
+            }
+            base.AssignmentExpression(node, st, c);
+        },
+    }, base);
+    recursive(ast, state, visitors);
+    return state.results.reduce((pv, { ast }) => {
+        return `${pv}window.${ast}=${ast};`;
+    }, "");
+}
 
 const store = new WeakMap();
 function setStoreData(window, path) {
@@ -6704,11 +6788,11 @@ function dealAttributesOCPatch(targetString) {
         }
     });
     replaceAttributeEventStr += `${targetString.slice(lastSliceEnd)}`;
-    console.log("====事件函数处理后字符", replaceAttributeEventStr);
+    // console.log("====事件函数处理后字符", replaceAttributeEventStr)
     return replaceAttributeEventStr;
 }
 function dealHTMLOCPatch(targetString) {
-    console.log("====事件函数原字符", targetString);
+    // console.log("====事件函数原字符", targetString)
     const targetAttrLists = findIdentifiers(targetString);
     let lastSliceEnd = 0;
     let replaceHTMLClickEventStr = '';
@@ -6720,7 +6804,7 @@ function dealHTMLOCPatch(targetString) {
         }
     });
     replaceHTMLClickEventStr += `${targetString.slice(lastSliceEnd)}`;
-    console.log("====事件函数处理后字符", replaceHTMLClickEventStr);
+    // console.log("====事件函数处理后字符", replaceHTMLClickEventStr)
     const fnBodyStr = replaceHTMLClickEventStr.match(fnBody)?.[1];
     return fnBodyStr || '';
 }
@@ -6728,10 +6812,10 @@ function patchElementHook(element, targetWindow) {
     const targetHaveGetAttribute = typeof element.getAttribute === 'function';
     const originHTMLClickEvent = element.onclick;
     const originAttributeEventStr = targetHaveGetAttribute ? element.getAttribute('onclick') : '';
-    if (targetHaveGetAttribute && element.getAttribute('data-test-scope')) {
-        console.log('===HTML事件绑定', originHTMLClickEvent);
-        console.log('===attribute获取事件', originAttributeEventStr);
-    }
+    // if (targetHaveGetAttribute && element.getAttribute('data-test-scope')) {
+    //     console.log('===HTML事件绑定', originHTMLClickEvent)
+    //     console.log('===attribute获取事件', originAttributeEventStr)
+    // }
     let result = '';
     if (originAttributeEventStr) {
         result = dealAttributesOCPatch(originAttributeEventStr);
@@ -6740,13 +6824,13 @@ function patchElementHook(element, targetWindow) {
         result = dealHTMLOCPatch(originHTMLClickEvent.toString());
     }
     if (result) {
-        console.log("====执行字符串", result);
+        // console.log("====执行字符串", result)
         const haveRegister = elementDataStore.hasStoreData(targetWindow);
         if (!haveRegister) {
             // @ts-ignore
             const currentWujieName = targetWindow.__WUJIE.id;
             const targetWindowPath = `__WUJIE_${targetToLNU(currentWujieName)}`;
-            console.log("===存储路径", targetWindowPath);
+            // console.log("===存储路径", targetWindowPath)
             // @ts-ignore
             window[targetWindowPath] = targetWindow;
             elementDataStore.setStoreData(targetWindow, targetWindowPath);
@@ -6755,11 +6839,17 @@ function patchElementHook(element, targetWindow) {
         element.setAttribute('onclick', `(function(window) {
             ${result}
         })(window.${targetWindowPath})`);
-        console.log("===替换之后的结果", element.getAttribute('onclick'));
+        // console.log("===替换之后的结果", element.getAttribute('onclick'))
     }
 }
+function patchInlineCodeHook(target, targetWindow) {
+    const result = findDeclarationIdentifiers(target.code);
+    console.log("===处理后的信息", result);
+    target.code = result;
+}
 var index = {
-    patchElementHook
+    patchElementHook,
+    patchInlineCodeHook
 };
 
 export { index as default };

package/dist/types/babelParse.d.ts

@@ -4,4 +4,13 @@ export interface AstInfo {
     end: number;
 }
 export declare function findIdentifiers(code: string): AstInfo[];
+/**
+ * 匹配会在全局（如浏览器 window）上产生「命名绑定」的写法（仅**脚本顶层**，不含嵌套函数体内）：
+ * - 顶层函数声明名（如 `function onclick`）
+ * - 顶层 var/let/const（含解构左侧）
+ * - 顶层对裸标识符的简单赋值 `id = ...`
+ *
+ * 不包含：函数体内的声明、成员赋值 `a.b =`、复合赋值等。
+ */
+export declare function findDeclarationIdentifiers(code: string): string;
 //# sourceMappingURL=babelParse.d.ts.map

package/dist/types/babelParse.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"babelParse.d.ts","sourceRoot":"","sources":["../../src/babelParse.ts"],"names":[],"mappings":"AAGA,MAAM,WAAW,OAAO;IACtB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,EAAE,MAAM,CAAC;CACb;AA0CD,wBAAgB,eAAe,CAAC,IAAI,EAAE,MAAM,aA6E3C"}
+{"version":3,"file":"babelParse.d.ts","sourceRoot":"","sources":["../../src/babelParse.ts"],"names":[],"mappings":"AAGA,MAAM,WAAW,OAAO;IACtB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,EAAE,MAAM,CAAC;CACb;AA0CD,wBAAgB,eAAe,CAAC,IAAI,EAAE,MAAM,aA2C3C;AA4CD;;;;;;;GAOG;AACH,wBAAgB,0BAA0B,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CA6D/D"}

package/dist/types/index.d.ts

@@ -1,6 +1,11 @@
+interface IpatchInlineCodeHook {
+    code: string;
+}
 declare function patchElementHook(element: HTMLElement, targetWindow: Window): void;
+declare function patchInlineCodeHook(target: IpatchInlineCodeHook, targetWindow: Window): void;
 declare const _default: {
     patchElementHook: typeof patchElementHook;
+    patchInlineCodeHook: typeof patchInlineCodeHook;
 };
 export default _default;
 //# sourceMappingURL=index.d.ts.map

package/dist/types/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAuCA,iBAAS,gBAAgB,CAAC,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,QAgCnE;;;;AAED,wBAEE"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAKA,UAAU,oBAAoB;IAC1B,IAAI,EAAE,MAAM,CAAA;CACf;AAoCD,iBAAS,gBAAgB,CAAC,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,QAgCnE;AAED,iBAAS,mBAAmB,CAAC,MAAM,EAAE,oBAAoB,EAAE,YAAY,EAAE,MAAM,QAI9E;;;;;AAED,wBAGE"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "type": "module",
   "name": "wujie-event-scope",
-  "version": "1.0.8",
+  "version": "1.0.10",
   "description": "处理wujie子应用HTML事件执行undefined问题",
   "main": "dist/index.cjs.js",
   "module": "dist/index.es.js",

package/src/babelParse.ts

@@ -64,40 +64,6 @@ export function findIdentifiers(code: string) {
       if (!callee) return;
 
       getCallExpression(callee, node.arguments, results)
-      // if (callee.type === "Identifier") {
-      //   results.add({
-      //     ast: callee.name,
-      //     start: callee.start,
-      //     end: callee.end,
-      //   });
-      //   if (Array.isArray(node.arguments) && node.arguments.length > 0) {
-      //     node.arguments.forEach((node: any) => {
-      //       if (node.type === 'Identifier') {
-      //         results.add({
-      //           ast: node.name,
-      //           start: node.start,
-      //           end: node.end,
-      //         });
-      //       } else if (node.type === 'MemberExpression') {
-      //         const memberName = getMemberExpressionPath(callee);
-      //         results.add({
-      //           ast: memberName,
-      //           start: node.start,
-      //           end: node.end,
-      //         });
-      //       }
-      //     })
-      //   }
-      // }
-
-      // if (callee.type === "MemberExpression") {
-      //   const memberName = getMemberExpressionPath(callee);
-      //   results.add({
-      //     ast: memberName,
-      //     start: callee.start,
-      //     end: callee.end,
-      //   });
-      // }
     },
     AssignmentExpression(node: any) {
       const left = node.left;
@@ -124,4 +90,117 @@ export function findIdentifiers(code: string) {
   });
 
   return Array.from(results).sort((a, b) => a.start - b.start);
+}
+
+/** 从解构等 Pattern 中收集绑定名（仅用于变量声明左侧） */
+function collectPatternBindingIds(id: any, results: AstInfo[]): void {
+  if (!id) return;
+  // 普通声明：let a、const foo = 1、var bar
+  if (id.type === "Identifier") {
+    results.push({ ast: id.name, start: id.start, end: id.end });
+    return;
+  }
+  // 对象解构左侧：const { x, y: z, ...rest } = obj
+  if (id.type === "ObjectPattern") {
+    for (const prop of id.properties) {
+      if (prop.type === "Property") {
+        collectPatternBindingIds(prop.value, results);
+      } else if (prop.type === "RestElement") {
+        collectPatternBindingIds(prop.argument, results);
+      }
+    }
+    return;
+  }
+  // 数组解构左侧：const [a, b, , c] = arr
+  if (id.type === "ArrayPattern") {
+    for (const elt of id.elements) {
+      if (elt) collectPatternBindingIds(elt, results);
+    }
+    return;
+  }
+  // 带默认值的解构项：const { x = 1 } = o 或 const [a = 0] = arr
+  if (id.type === "AssignmentPattern") {
+    collectPatternBindingIds(id.left, results);
+  }
+  // 剩余合并项解构赋值：const { ...rest } = o、const [a, ...tail] = arr
+  if (id.type === "RestElement") {
+    collectPatternBindingIds(id.argument, results);
+  }
+}
+
+interface DeclarationWalkState {
+  /** >0 表示在任意函数/箭头函数体内，其中的 var/赋值不会挂到 window */
+  functionDepth: number;
+  results: AstInfo[];
+}
+
+/**
+ * 匹配会在全局（如浏览器 window）上产生「命名绑定」的写法（仅**脚本顶层**，不含嵌套函数体内）：
+ * - 顶层函数声明名（如 `function onclick`）
+ * - 顶层 var/let/const（含解构左侧）
+ * - 顶层对裸标识符的简单赋值 `id = ...`
+ *
+ * 不包含：函数体内的声明、成员赋值 `a.b =`、复合赋值等。
+ */
+export function findDeclarationIdentifiers(code: string): string {
+  const state: DeclarationWalkState = {
+    functionDepth: 0,
+    results: [],
+  };
+
+  const ast = acorn.parse(code, {
+    ecmaVersion: "latest",
+    sourceType: "module",
+    ranges: true,
+  }) as any;
+
+  const visitors = walk.make(
+    {
+      Function(node: any, st: DeclarationWalkState, c) {
+        if (
+          node.type === "FunctionDeclaration" &&
+          node.id &&
+          st.functionDepth === 0
+        ) {
+          st.results.push({
+            ast: node.id.name,
+            start: node.id.start,
+            end: node.id.end,
+          });
+        }
+        st.functionDepth++;
+        walk.base.Function!(node, st, c);
+        st.functionDepth--;
+      },
+      VariableDeclaration(node: any, st: DeclarationWalkState, c) {
+        if (st.functionDepth === 0) {
+          for (const decl of node.declarations) {
+            collectPatternBindingIds(decl.id, st.results);
+          }
+        }
+        walk.base.VariableDeclaration!(node, st, c);
+      },
+      AssignmentExpression(node: any, st: DeclarationWalkState, c) {
+        if (
+          st.functionDepth === 0 &&
+          node.operator === "=" &&
+          node.left?.type === "Identifier"
+        ) {
+          st.results.push({
+            ast: node.left.name,
+            start: node.left.start,
+            end: node.left.end,
+          });
+        }
+        walk.base.AssignmentExpression!(node, st, c);
+      },
+    },
+    walk.base,
+  );
+
+  walk.recursive(ast, state, visitors);
+
+  return state.results.reduce((pv, { ast }) => {
+    return `${pv}window.${ast}=${ast};`;
+  }, "");
 }

package/src/index.ts

@@ -1,8 +1,12 @@
 import { fnBody } from "./regx"
 import { targetToLNU } from "./utils"
-import { findIdentifiers } from "./babelParse"
+import { findIdentifiers, findDeclarationIdentifiers } from "./babelParse"
 import elementDataStore from "./elementDataStore"
 
+interface IpatchInlineCodeHook {
+    code: string
+}
+
 function dealAttributesOCPatch(targetString: string) {
     const targetAttrLists = findIdentifiers(targetString);
     let lastSliceEnd = 0;
@@ -15,12 +19,12 @@ function dealAttributesOCPatch(targetString: string) {
         }
     })
     replaceAttributeEventStr += `${targetString.slice(lastSliceEnd)}`
-    console.log("====事件函数处理后字符", replaceAttributeEventStr)
+    // console.log("====事件函数处理后字符", replaceAttributeEventStr)
     return replaceAttributeEventStr
 }
 
 function dealHTMLOCPatch(targetString: string) {
-        console.log("====事件函数原字符", targetString)
+        // console.log("====事件函数原字符", targetString)
         const targetAttrLists = findIdentifiers(targetString);
         let lastSliceEnd = 0;
         let replaceHTMLClickEventStr: string = '';
@@ -32,7 +36,7 @@ function dealHTMLOCPatch(targetString: string) {
             }
         })
         replaceHTMLClickEventStr += `${targetString.slice(lastSliceEnd)}`
-        console.log("====事件函数处理后字符", replaceHTMLClickEventStr)
+        // console.log("====事件函数处理后字符", replaceHTMLClickEventStr)
         const fnBodyStr = replaceHTMLClickEventStr.match(fnBody)?.[1];
         return fnBodyStr || ''
 }
@@ -41,10 +45,10 @@ function patchElementHook(element: HTMLElement, targetWindow: Window) {
     const targetHaveGetAttribute = typeof element.getAttribute === 'function'
     const originHTMLClickEvent = element.onclick;
     const originAttributeEventStr = targetHaveGetAttribute ? element.getAttribute('onclick') : ''
-    if (targetHaveGetAttribute && element.getAttribute('data-test-scope')) {
-        console.log('===HTML事件绑定', originHTMLClickEvent)
-        console.log('===attribute获取事件', originAttributeEventStr)
-    }
+    // if (targetHaveGetAttribute && element.getAttribute('data-test-scope')) {
+    //     console.log('===HTML事件绑定', originHTMLClickEvent)
+    //     console.log('===attribute获取事件', originAttributeEventStr)
+    // }
     let result = '';
     if (originAttributeEventStr) {
         result = dealAttributesOCPatch(originAttributeEventStr)
@@ -52,13 +56,13 @@ function patchElementHook(element: HTMLElement, targetWindow: Window) {
         result = dealHTMLOCPatch(originHTMLClickEvent.toString())
     }
     if (result) {
-        console.log("====执行字符串", result)
+        // console.log("====执行字符串", result)
         const haveRegister = elementDataStore.hasStoreData(targetWindow)
         if(!haveRegister) {
             // @ts-ignore
             const currentWujieName = targetWindow.__WUJIE.id
             const targetWindowPath = `__WUJIE_${targetToLNU(currentWujieName)}`
-            console.log("===存储路径", targetWindowPath)
+            // console.log("===存储路径", targetWindowPath)
             // @ts-ignore
             window[targetWindowPath] = targetWindow
             elementDataStore.setStoreData(targetWindow, targetWindowPath)
@@ -67,10 +71,17 @@ function patchElementHook(element: HTMLElement, targetWindow: Window) {
         element.setAttribute('onclick', `(function(window) {
             ${result}
         })(window.${targetWindowPath})`)
-        console.log("===替换之后的结果", element.getAttribute('onclick'))
+        // console.log("===替换之后的结果", element.getAttribute('onclick'))
     }
 }
 
+function patchInlineCodeHook(target: IpatchInlineCodeHook, targetWindow: Window) {
+    const result = findDeclarationIdentifiers(target.code)
+    console.log("===处理后的信息", result)
+    target.code = result
+}
+
 export default {
-    patchElementHook
+    patchElementHook,
+    patchInlineCodeHook
 };