@coolkiller007/my-page-agent 0.2.5 → 0.2.7

package/README.md

@@ -1,7 +1,6 @@
 # My Page Agent
 
-面向中台的页面内嵌 GUI Agent。项目将自然语言任务转换为受控的页面读取与操作，并以
-单一 npm 包交付。
+面向中台的页面内嵌 GUI Agent。项目将自然语言任务转换为受控的页面读取与操作，并以单一 npm 包交付。
 
 ## Installation
 
@@ -33,23 +32,19 @@ writeResult(result.data)
 agent.dispose()
 ```
 
-生产环境必须通过公司后端代理或 AI 网关访问模型，不得把生产 API Key 打进浏览器产
-物。页面内容在发送给模型前也应通过 `transformPageContent` 完成业务所需的脱敏。
+生产环境必须通过公司后端代理或 AI 网关访问模型，不得把生产 API Key 打进浏览器产物。页面内容在发送给模型前也应通过 `transformPageContent` 完成业务所需的脱敏。
 
 ## Public API
 
 包根入口是唯一公共入口：
 
 - `createAgent(config)`：创建并组装 `MyPageAgent`。
-- `MyPageAgent`：Agent 门面；提供 `execute(task)`、`stop()`、`dispose()` 和只读
-  `status`。
+- `MyPageAgent`：Agent 门面；提供 `execute(task)`、`stop()`、`dispose()` 和只读`status`。
 - `agent.ui`：提供 `show()`、`hide()`、`expand()` 和 `collapse()`。
 - `tool(options)`：定义自定义 Agent 工具。
-- 类型：`MyPageAgentConfig`、`AgentActivity`、`AgentStatus`、`ExecutionResult`
-  和 `HistoricalEvent`。
+- 类型：`MyPageAgentConfig`、`AgentActivity`、`AgentStatus`、`ExecutionResult`和 `HistoricalEvent`。
 
-`AgentRuntime`、`BrowserController`、`OpenAICompatibleClient`、UI 内部组件、DOM
-Tree、Prompt 和自动修复器属于内部实现，不从包根入口导出。
+`AgentRuntime`、`BrowserController`、`OpenAICompatibleClient`、UI 内部组件、DOM Tree、Prompt 和自动修复器属于内部实现，不从包根入口导出。
 
 ## Architecture
 
@@ -60,5 +55,4 @@ Tree、Prompt 和自动修复器属于内部实现，不从包根入口导出。
 - `src/shared`：跨能力共享的无状态工具。
 - `src/index.ts`：限定公共 API 的唯一包入口。
 
-项目只发布 `@coolkiller007/my-page-agent`，不使用 npm workspaces。Browser、Runti
-me 和 UI 只在 `MyPageAgent` 中组装，内部模块使用相对 import。
+项目只发布 `@coolkiller007/my-page-agent`，不使用 npm workspaces。Browser、Runtime 和 UI 只在 `MyPageAgent` 中组装，内部模块使用相对 import。

package/dist/index.js

@@ -235,7 +235,8 @@ async function selectOptionElement(selectElement, optionText) {
 	if (!isSelectElement(selectElement)) throw new Error("Element is not a select element");
 	const option = Array.from(selectElement.options).find((opt) => opt.textContent?.trim() === optionText.trim());
 	if (!option) throw new Error(`Option with text "${optionText}" not found in select element`);
-	selectElement.value = option.value;
+	if (selectElement.multiple) option.selected = true;
+	else selectElement.value = option.value;
 	selectElement.dispatchEvent(new Event("change", { bubbles: true }));
 	await waitFor$1(.05);
 }
@@ -989,6 +990,53 @@ var dom_tree_default = (args = {
 		return false;
 	}
 	/**
+	* 判断某元素（或其祖先）是否带有 data-browser-use-ignore / data-page-agent-ignore 标记。
+	* 这些是我们自己注入的悬浮 UI（agent 面板、模拟遮罩等），命中测试时应视为"透明"。
+	*
+	* @param {Element | null} el - 待检查元素。
+	* @returns {boolean} 是否应在遮挡检测中被忽略。
+	*/
+	function isIgnoredForHitTest(el) {
+		let current = el;
+		while (current) {
+			if (current.dataset && (current.dataset.browserUseIgnore === "true" || current.dataset.pageAgentIgnore === "true")) return true;
+			current = current.parentElement;
+		}
+		return false;
+	}
+	/**
+	* @edit 命中测试时跳过被忽略的悬浮 UI（agent 面板、模拟遮罩等）。
+	* 之前只有 SimulatorMask 会在 DOM 提取期间临时把 pointerEvents 设为 none 来绕开自己，
+	* 但 agent 自身的问答/历史面板（UI.ts）没有做同样处理 —— 当面板展开、在视觉上盖住
+	* 弹窗等页面元素时，elementFromPoint 命中的是面板本身，导致弹窗被误判为"被遮挡"而从
+	* 提交给 LLM 的可交互树中消失，造成"弹窗仍开着，agent 却认为已关闭"的错觉。
+	* 这里统一在遮挡检测层面处理：命中被忽略元素时临时禁用其 pointer-events 再重新探测，
+	* 探测完成后恢复，使得任何打了忽略标记的悬浮 UI 都不会影响真实页面元素的遮挡判断。
+	*
+	* @param {Document | ShadowRoot} doc - 用于命中测试的文档或 shadow root。
+	* @param {number} x - 命中测试点的 x 坐标。
+	* @param {number} y - 命中测试点的 y 坐标。
+	* @returns {Element | null} 忽略悬浮 UI 后，实际命中的最上层元素。
+	*/
+	function elementFromPointSkippingIgnored(doc, x, y) {
+		/** @type {{ el: HTMLElement, prevValue: string }[]} */
+		const restoreList = [];
+		try {
+			let topEl = doc.elementFromPoint(x, y);
+			while (topEl instanceof HTMLElement && isIgnoredForHitTest(topEl)) {
+				restoreList.push({
+					el: topEl,
+					prevValue: topEl.style.pointerEvents
+				});
+				topEl.style.pointerEvents = "none";
+				topEl = doc.elementFromPoint(x, y);
+			}
+			return topEl;
+		} finally {
+			for (const { el, prevValue } of restoreList) el.style.pointerEvents = prevValue;
+		}
+	}
+	/**
 	* Checks if an element is the topmost element at its position.
 	*
 	* @param {HTMLElement} element - The element to check.
@@ -1022,7 +1070,7 @@ var dom_tree_default = (args = {
 			const centerX = rect.left + rect.width / 2;
 			const centerY = rect.top + rect.height / 2;
 			try {
-				const topEl = shadowRoot.elementFromPoint(centerX, centerY);
+				const topEl = elementFromPointSkippingIgnored(shadowRoot, centerX, centerY);
 				if (!topEl) return false;
 				let current = topEl;
 				while (current && current !== shadowRoot) {
@@ -1050,7 +1098,7 @@ var dom_tree_default = (args = {
 			}
 		].some(({ x, y }) => {
 			try {
-				const topEl = document.elementFromPoint(x, y);
+				const topEl = elementFromPointSkippingIgnored(document, x, y);
 				if (!topEl) return false;
 				let current = topEl;
 				while (current && current !== document.documentElement) {
@@ -1365,10 +1413,27 @@ var dom_tree_default = (args = {
 			* 若不同步，选择后重新快照时 LLM 看不到变化，会误判操作未生效而反复执行 select 操作。
 			*/
 			if (node.tagName.toLowerCase() === "select") {
-				const selectedOption = node.options[node.selectedIndex];
-				nodeData.attributes.value = selectedOption ? selectedOption.text : node.value;
+				if (node.multiple) nodeData.attributes.value = Array.from(node.options).filter((opt) => opt.selected).map((opt) => opt.text).join(", ");
+				else {
+					const selectedOption = node.options[node.selectedIndex];
+					nodeData.attributes.value = selectedOption ? selectedOption.text : node.value;
+				}
 			}
 			/**
+			* @edit @workaround input/textarea.value
+			* 文本类输入框（含日期选择器底层常见的 <input type="text">）当前内容同样是 DOM 属性，
+			* 不会反映到 HTML attribute 上，若不同步，输入后重新快照时 LLM 看不到变化，
+			* 会误判输入未生效而反复重试。password/file/hidden 等类型不同步，避免泄露敏感值或无意义路径。
+			*/
+			const NO_VALUE_SYNC_INPUT_TYPES = /* @__PURE__ */ new Set([
+				"password",
+				"file",
+				"hidden",
+				"checkbox",
+				"radio"
+			]);
+			if (node.tagName.toLowerCase() === "input" && !NO_VALUE_SYNC_INPUT_TYPES.has(node.type) || node.tagName.toLowerCase() === "textarea") nodeData.attributes.value = node.value;
+			/**
 			* @edit @workaround label-wrapped checkbox/radio checked
 			* 常见组件库（如 antd）把 checkbox/radio 包在 <label> 里，视觉上的选中框覆盖在原生
 			* input 上面，导致 input 不是 isTopElement，不会被收进可交互树、也就打印不出 checked
@@ -1586,7 +1651,11 @@ function flatTreeToString(flatTree, includeAttributes = [], keepSemanticTags = f
 		"aria-haspopup",
 		"aria-controls",
 		"aria-owns",
-		"contenteditable"
+		"contenteditable",
+		"aria-valuenow",
+		"aria-valuetext",
+		"aria-valuemin",
+		"aria-valuemax"
 	];
 	const includeAttrs = [...includeAttributes, ...DEFAULT_INCLUDE_ATTRIBUTES];
 	const capTextLength = (text, maxLength) => {
@@ -2800,7 +2869,7 @@ var UI = class {
 		if (status === "running") {
 			this.show();
 			this.#hideInputArea();
-			if (!this.#isExpanded) this.#expand();
+			if (this.#isExpanded) this.#collapse();
 		}
 		if (status === "completed" || status === "error" || status === "stopped") {
 			if (!this.#isExpanded) this.#expand();