@testid/antd-testid-runtime 1.0.16 → 1.0.18

package/dist/index.d.mts

@@ -1,3 +1,5 @@
+import { App } from 'vue';
+
 /**
  * UI 库适配器接口 — adapters/types.ts
  *
@@ -10,7 +12,7 @@
 /**
  * 支持的浮层类型
  */
-type PopupType = 'modal' | 'drawer' | 'select' | 'datePicker' | 'popconfirm' | 'popover' | 'dropdown' | 'tooltip' | 'message';
+type PopupType = 'modal' | 'drawer' | 'select' | 'datePicker' | 'popconfirm' | 'popover' | 'dropdown' | 'tooltip' | 'message' | 'submenu';
 /**
  * UI 库适配器接口
  *
@@ -486,4 +488,30 @@ declare class TestIdChecker {
     private static reportGroupDuplicates;
 }
 
-export { type ParsedBaseKey, type PopupType, TestIdChecker, type TestIdMarkConfig, TestIdObserver, type UiAdapter, antdAdapter, buildAnchorTestId, buildPopupTestId, defaultConfig, elementAdapter, getAnchorCounterMap, getConfig, getNextAnchorLocalIndex, getNextPopupId, getPopupCounterSnapshot, initConfig, mergeConfig, parseBaseKey, resetAllAnchorCounters, resetAllPopupCounters, resetPopupCounter };
+/**
+ * Vue 3 插件桥接 — testIdVuePlugin.ts
+ *
+ * 铁三角第二层：绕过 UI 库组件 inheritAttrs: false 的限制。
+ *
+ * 问题背景:
+ *   编译期在 <a-menu-item data-test-base-key="..."> 上注入属性，
+ *   但 Ant Design Vue 等 UI 库组件通常设置 inheritAttrs: false，
+ *   导致非 prop 属性不会自动传递到渲染后的 DOM 元素上。
+ *
+ * 解决方案:
+ *   通过 app.mixin({ mounted() }) 全局混入，在每个组件挂载后，
+ *   从 Vue 内部的 $attrs 中读取插件关注的属性并手动写入 $el。
+ *
+ *   对于 inheritAttrs: true (默认) 的组件，Vue 已自动应用属性到 $el，
+ *   hasAttribute 检查会跳过避免重复写入。
+ *
+ * 使用方式:
+ *   import { TestIdVuePlugin } from '@testid/antd-testid-runtime';
+ *   app.use(TestIdVuePlugin);  // 必须在 app.mount() 之前调用
+ */
+
+declare const TestIdVuePlugin: {
+    install(app: App): void;
+};
+
+export { type ParsedBaseKey, type PopupType, TestIdChecker, type TestIdMarkConfig, TestIdObserver, TestIdVuePlugin, type UiAdapter, antdAdapter, buildAnchorTestId, buildPopupTestId, defaultConfig, elementAdapter, getAnchorCounterMap, getConfig, getNextAnchorLocalIndex, getNextPopupId, getPopupCounterSnapshot, initConfig, mergeConfig, parseBaseKey, resetAllAnchorCounters, resetAllPopupCounters, resetPopupCounter };

package/dist/index.d.ts

@@ -1,3 +1,5 @@
+import { App } from 'vue';
+
 /**
  * UI 库适配器接口 — adapters/types.ts
  *
@@ -10,7 +12,7 @@
 /**
  * 支持的浮层类型
  */
-type PopupType = 'modal' | 'drawer' | 'select' | 'datePicker' | 'popconfirm' | 'popover' | 'dropdown' | 'tooltip' | 'message';
+type PopupType = 'modal' | 'drawer' | 'select' | 'datePicker' | 'popconfirm' | 'popover' | 'dropdown' | 'tooltip' | 'message' | 'submenu';
 /**
  * UI 库适配器接口
  *
@@ -486,4 +488,30 @@ declare class TestIdChecker {
     private static reportGroupDuplicates;
 }
 
-export { type ParsedBaseKey, type PopupType, TestIdChecker, type TestIdMarkConfig, TestIdObserver, type UiAdapter, antdAdapter, buildAnchorTestId, buildPopupTestId, defaultConfig, elementAdapter, getAnchorCounterMap, getConfig, getNextAnchorLocalIndex, getNextPopupId, getPopupCounterSnapshot, initConfig, mergeConfig, parseBaseKey, resetAllAnchorCounters, resetAllPopupCounters, resetPopupCounter };
+/**
+ * Vue 3 插件桥接 — testIdVuePlugin.ts
+ *
+ * 铁三角第二层：绕过 UI 库组件 inheritAttrs: false 的限制。
+ *
+ * 问题背景:
+ *   编译期在 <a-menu-item data-test-base-key="..."> 上注入属性，
+ *   但 Ant Design Vue 等 UI 库组件通常设置 inheritAttrs: false，
+ *   导致非 prop 属性不会自动传递到渲染后的 DOM 元素上。
+ *
+ * 解决方案:
+ *   通过 app.mixin({ mounted() }) 全局混入，在每个组件挂载后，
+ *   从 Vue 内部的 $attrs 中读取插件关注的属性并手动写入 $el。
+ *
+ *   对于 inheritAttrs: true (默认) 的组件，Vue 已自动应用属性到 $el，
+ *   hasAttribute 检查会跳过避免重复写入。
+ *
+ * 使用方式:
+ *   import { TestIdVuePlugin } from '@testid/antd-testid-runtime';
+ *   app.use(TestIdVuePlugin);  // 必须在 app.mount() 之前调用
+ */
+
+declare const TestIdVuePlugin: {
+    install(app: App): void;
+};
+
+export { type ParsedBaseKey, type PopupType, TestIdChecker, type TestIdMarkConfig, TestIdObserver, TestIdVuePlugin, type UiAdapter, antdAdapter, buildAnchorTestId, buildPopupTestId, defaultConfig, elementAdapter, getAnchorCounterMap, getConfig, getNextAnchorLocalIndex, getNextPopupId, getPopupCounterSnapshot, initConfig, mergeConfig, parseBaseKey, resetAllAnchorCounters, resetAllPopupCounters, resetPopupCounter };

package/dist/index.js

@@ -39,6 +39,7 @@ var index_exports = {};
 __export(index_exports, {
   TestIdChecker: () => TestIdChecker,
   TestIdObserver: () => TestIdObserver,
+  TestIdVuePlugin: () => TestIdVuePlugin,
   antdAdapter: () => antdAdapter,
   buildAnchorTestId: () => buildAnchorTestId,
   buildPopupTestId: () => buildPopupTestId,
@@ -73,7 +74,8 @@ var popupClassSuffixMap = {
   popover: [["-popover"]],
   dropdown: [["-dropdown"]],
   tooltip: [["-tooltip"]],
-  message: [["-message"]]
+  message: [["-message"]],
+  submenu: [["-menu-submenu-popup"]]
 };
 var antdAdapter = {
   name: "ant-design-vue",
@@ -119,7 +121,8 @@ var defaultConfig = {
     popover: "popover_",
     dropdown: "dropdown_",
     tooltip: "tooltip_",
-    message: "message_"
+    message: "message_",
+    submenu: "submenu_"
   },
   ignoreTags: ["script", "style", "svg", "br", "iframe"],
   ignoreClass: ["no-test-mark", "hidden"],
@@ -187,7 +190,8 @@ var popupClassSuffixMap2 = {
   popover: [["-popover"]],
   dropdown: [["-dropdown-menu"]],
   tooltip: [["-tooltip__popper"]],
-  message: [["-message"]]
+  message: [["-message"]],
+  submenu: []
 };
 var elementAdapter = {
   name: "element-ui",
@@ -260,7 +264,8 @@ var popupCounters = {
   popover: 0,
   dropdown: 0,
   tooltip: 0,
-  message: 0
+  message: 0,
+  submenu: 0
 };
 function getNextPopupId(type) {
   const key = type in popupCounters ? type : "modal";
@@ -688,7 +693,7 @@ var TestIdObserver = class {
     if (node.hasAttribute("tabindex")) return true;
     const classStr = node.className;
     if (typeof classStr === "string") {
-      if (/\bant-(?:menu-item|dropdown-menu-item|select-item|tabs-tab|picker-cell|breadcrumb-link)\b/.test(classStr)) {
+      if (/\bant-(?:menu-item|menu-submenu|dropdown-menu-item|select-item|tabs-tab|picker-cell|breadcrumb-link)\b/.test(classStr)) {
         return true;
       }
       if (/\bel-(?:menu-item|dropdown-menu__item|select-dropdown__item|tabs__item)\b/.test(classStr)) {
@@ -726,7 +731,8 @@ var GROUP_LABELS = {
   popover: "[Popover \u6D6E\u5C42]",
   dropdown: "[Dropdown \u6D6E\u5C42]",
   tooltip: "[Tooltip \u6D6E\u5C42]",
-  message: "[Message \u6D6E\u5C42]"
+  message: "[Message \u6D6E\u5C42]",
+  submenu: "[SubMenu \u6D6E\u5C42]"
 };
 var GROUP_SUGGESTIONS = {
   custom: "\u4E1A\u52A1\u4EE3\u7801\u4E2D\u5B58\u5728\u624B\u5199\u56FA\u5B9A\u91CD\u590D data-testid\uFF0C\u8BF7\u68C0\u67E5\u76F8\u5173\u6A21\u677F\u4EE3\u7801",
@@ -740,7 +746,8 @@ var GROUP_SUGGESTIONS = {
   popover: "Popover \u72EC\u7ACB\u8BA1\u6570\u5668\u81EA\u589E\u903B\u8F91\u5931\u6548",
   dropdown: "Dropdown \u72EC\u7ACB\u8BA1\u6570\u5668\u81EA\u589E\u903B\u8F91\u5931\u6548",
   tooltip: "Tooltip \u72EC\u7ACB\u8BA1\u6570\u5668\u81EA\u589E\u903B\u8F91\u5931\u6548",
-  message: "Message \u72EC\u7ACB\u8BA1\u6570\u5668\u81EA\u589E\u903B\u8F91\u5931\u6548"
+  message: "Message \u72EC\u7ACB\u8BA1\u6570\u5668\u81EA\u589E\u903B\u8F91\u5931\u6548",
+  submenu: "SubMenu \u72EC\u7ACB\u8BA1\u6570\u5668\u81EA\u589E\u903B\u8F91\u5931\u6548"
 };
 var TestIdChecker = class {
   /**
@@ -839,7 +846,8 @@ var TestIdChecker = class {
       "popover",
       "dropdown",
       "tooltip",
-      "message"
+      "message",
+      "submenu"
     ];
     for (const type of popupTypes) {
       if (prefix === `${type}_`) return type;
@@ -875,10 +883,32 @@ var TestIdChecker = class {
     console.groupEnd();
   }
 };
+
+// src/utils/testIdVuePlugin.ts
+var WATCHED_ATTRS = ["data-testid", "data-test-base-key"];
+var TestIdVuePlugin = {
+  install(app) {
+    app.mixin({
+      mounted() {
+        const el = this.$el;
+        if (!el) return;
+        const attrs = this.$attrs || {};
+        if (!attrs || typeof attrs !== "object") return;
+        for (const attr of WATCHED_ATTRS) {
+          const value = attrs[attr];
+          if (value != null && !el.hasAttribute(attr)) {
+            el.setAttribute(attr, String(value));
+          }
+        }
+      }
+    });
+  }
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   TestIdChecker,
   TestIdObserver,
+  TestIdVuePlugin,
   antdAdapter,
   buildAnchorTestId,
   buildPopupTestId,

package/dist/index.mjs

@@ -33,7 +33,8 @@ var popupClassSuffixMap = {
   popover: [["-popover"]],
   dropdown: [["-dropdown"]],
   tooltip: [["-tooltip"]],
-  message: [["-message"]]
+  message: [["-message"]],
+  submenu: [["-menu-submenu-popup"]]
 };
 var antdAdapter = {
   name: "ant-design-vue",
@@ -79,7 +80,8 @@ var defaultConfig = {
     popover: "popover_",
     dropdown: "dropdown_",
     tooltip: "tooltip_",
-    message: "message_"
+    message: "message_",
+    submenu: "submenu_"
   },
   ignoreTags: ["script", "style", "svg", "br", "iframe"],
   ignoreClass: ["no-test-mark", "hidden"],
@@ -147,7 +149,8 @@ var popupClassSuffixMap2 = {
   popover: [["-popover"]],
   dropdown: [["-dropdown-menu"]],
   tooltip: [["-tooltip__popper"]],
-  message: [["-message"]]
+  message: [["-message"]],
+  submenu: []
 };
 var elementAdapter = {
   name: "element-ui",
@@ -220,7 +223,8 @@ var popupCounters = {
   popover: 0,
   dropdown: 0,
   tooltip: 0,
-  message: 0
+  message: 0,
+  submenu: 0
 };
 function getNextPopupId(type) {
   const key = type in popupCounters ? type : "modal";
@@ -648,7 +652,7 @@ var TestIdObserver = class {
     if (node.hasAttribute("tabindex")) return true;
     const classStr = node.className;
     if (typeof classStr === "string") {
-      if (/\bant-(?:menu-item|dropdown-menu-item|select-item|tabs-tab|picker-cell|breadcrumb-link)\b/.test(classStr)) {
+      if (/\bant-(?:menu-item|menu-submenu|dropdown-menu-item|select-item|tabs-tab|picker-cell|breadcrumb-link)\b/.test(classStr)) {
         return true;
       }
       if (/\bel-(?:menu-item|dropdown-menu__item|select-dropdown__item|tabs__item)\b/.test(classStr)) {
@@ -686,7 +690,8 @@ var GROUP_LABELS = {
   popover: "[Popover \u6D6E\u5C42]",
   dropdown: "[Dropdown \u6D6E\u5C42]",
   tooltip: "[Tooltip \u6D6E\u5C42]",
-  message: "[Message \u6D6E\u5C42]"
+  message: "[Message \u6D6E\u5C42]",
+  submenu: "[SubMenu \u6D6E\u5C42]"
 };
 var GROUP_SUGGESTIONS = {
   custom: "\u4E1A\u52A1\u4EE3\u7801\u4E2D\u5B58\u5728\u624B\u5199\u56FA\u5B9A\u91CD\u590D data-testid\uFF0C\u8BF7\u68C0\u67E5\u76F8\u5173\u6A21\u677F\u4EE3\u7801",
@@ -700,7 +705,8 @@ var GROUP_SUGGESTIONS = {
   popover: "Popover \u72EC\u7ACB\u8BA1\u6570\u5668\u81EA\u589E\u903B\u8F91\u5931\u6548",
   dropdown: "Dropdown \u72EC\u7ACB\u8BA1\u6570\u5668\u81EA\u589E\u903B\u8F91\u5931\u6548",
   tooltip: "Tooltip \u72EC\u7ACB\u8BA1\u6570\u5668\u81EA\u589E\u903B\u8F91\u5931\u6548",
-  message: "Message \u72EC\u7ACB\u8BA1\u6570\u5668\u81EA\u589E\u903B\u8F91\u5931\u6548"
+  message: "Message \u72EC\u7ACB\u8BA1\u6570\u5668\u81EA\u589E\u903B\u8F91\u5931\u6548",
+  submenu: "SubMenu \u72EC\u7ACB\u8BA1\u6570\u5668\u81EA\u589E\u903B\u8F91\u5931\u6548"
 };
 var TestIdChecker = class {
   /**
@@ -799,7 +805,8 @@ var TestIdChecker = class {
       "popover",
       "dropdown",
       "tooltip",
-      "message"
+      "message",
+      "submenu"
     ];
     for (const type of popupTypes) {
       if (prefix === `${type}_`) return type;
@@ -835,9 +842,31 @@ var TestIdChecker = class {
     console.groupEnd();
   }
 };
+
+// src/utils/testIdVuePlugin.ts
+var WATCHED_ATTRS = ["data-testid", "data-test-base-key"];
+var TestIdVuePlugin = {
+  install(app) {
+    app.mixin({
+      mounted() {
+        const el = this.$el;
+        if (!el) return;
+        const attrs = this.$attrs || {};
+        if (!attrs || typeof attrs !== "object") return;
+        for (const attr of WATCHED_ATTRS) {
+          const value = attrs[attr];
+          if (value != null && !el.hasAttribute(attr)) {
+            el.setAttribute(attr, String(value));
+          }
+        }
+      }
+    });
+  }
+};
 export {
   TestIdChecker,
   TestIdObserver,
+  TestIdVuePlugin,
   antdAdapter,
   buildAnchorTestId,
   buildPopupTestId,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@testid/antd-testid-runtime",
-  "version": "1.0.16",
+  "version": "1.0.18",
   "description": "运行时兜底打标模块 — MutationObserver + 锚点计数器 + 浮层计数器 + ID 重复检测",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
@@ -25,8 +25,12 @@
     "dev": "tsup src/index.ts --dts --format esm,cjs --watch --target es2015"
   },
   "dependencies": {},
+  "peerDependencies": {
+    "vue": "^3.0.0"
+  },
   "devDependencies": {
     "tsup": "^8.0.0",
-    "typescript": "^5.3.0"
+    "typescript": "^5.3.0",
+    "vue": "^3.4.0"
   }
 }