@immense/vue-pom-generator 1.0.42 → 1.0.44

package/dist/index.cjs

@@ -26,13 +26,13 @@ const path = require("node:path");
 const process = require("node:process");
 const node_url = require("node:url");
 const fs = require("node:fs");
+const compilerDom = require("@vue/compiler-dom");
+const compilerSfc = require("@vue/compiler-sfc");
 const parser = require("@babel/parser");
 const jsdom = require("jsdom");
 const compilerCore = require("@vue/compiler-core");
 const types = require("@babel/types");
 const node_perf_hooks = require("node:perf_hooks");
-const compilerDom = require("@vue/compiler-dom");
-const compilerSfc = require("@vue/compiler-sfc");
 const virtualImport = require("vite-plugin-virtual");
 const vue = require("@vitejs/plugin-vue");
 var _documentCurrentScript = typeof document !== "undefined" ? document.currentScript : null;
@@ -3712,6 +3712,26 @@ function generateAggregatedCSharpFiles(componentHierarchyMap, outDir, options =
     "    protected IPage Page { get; }",
     `    protected ILocator LocatorByTestId(string testId) => Page.Locator($"[${testIdAttribute}=\\"{testId}\\"]");`,
     "    protected ILocator LocatorWithinTestIdByLabel(string rootTestId, string label, bool exact = true) => LocatorByTestId(rootTestId).GetByLabel(label, new() { Exact = exact });",
+    "    protected async Task<ILocator> ResolveEditableLocatorAsync(ILocator locator)",
+    "    {",
+    '        var isEditable = await locator.EvaluateAsync<bool>(@"el => {',
+    "            if (!el || !(el instanceof HTMLElement)) return false;",
+    "            const tagName = el.tagName.toLowerCase();",
+    "            return tagName === 'input' || tagName === 'textarea' || tagName === 'select' || el.isContentEditable;",
+    '        }");',
+    "        if (isEditable)",
+    "        {",
+    "            return locator;",
+    "        }",
+    "",
+    `        var descendant = locator.Locator("input, textarea, select, [contenteditable=''], [contenteditable='true'], [contenteditable]:not([contenteditable='false'])").First;`,
+    "        if (await descendant.CountAsync() > 0)",
+    "        {",
+    "            return descendant;",
+    "        }",
+    "",
+    "        return locator;",
+    "    }",
     "    protected async Task ClickWithinTestIdByLabelAsync(string rootTestId, string label, bool exact = true)",
     "    {",
     "        await LocatorWithinTestIdByLabel(rootTestId, label, exact).ClickAsync();",
@@ -3813,7 +3833,8 @@ function generateAggregatedCSharpFiles(componentHierarchyMap, outDir, options =
       const callSuffix = pom.formattedDataTestId.includes("${") ? `(${args})` : "";
       const emitActionCall = (locatorAccess) => {
         if (pom.nativeRole === "input") {
-          chunks.push(`        await ${locatorAccess}.FillAsync(text);`);
+          chunks.push(`        var editableLocator = await ResolveEditableLocatorAsync(${locatorAccess});`);
+          chunks.push("        await editableLocator.FillAsync(text);");
         } else if (pom.nativeRole === "select") {
           chunks.push(`        await ${locatorAccess}.SelectOptionAsync(value);`);
         } else if (pom.nativeRole === "vselect") {
@@ -3841,7 +3862,8 @@ function generateAggregatedCSharpFiles(componentHierarchyMap, outDir, options =
           chunks.push("                if (await locator.CountAsync() > 0)");
           chunks.push("                {");
           if (pom.nativeRole === "input") {
-            chunks.push("                    await locator.FillAsync(text);");
+            chunks.push("                    var editableLocator = await ResolveEditableLocatorAsync(locator);");
+            chunks.push("                    await editableLocator.FillAsync(text);");
           } else if (pom.nativeRole === "select") {
             chunks.push("                    await locator.SelectOptionAsync(value);");
           } else {
@@ -4065,7 +4087,8 @@ function generateViewObjectModelContent(componentName, dependencies, componentHi
     if (!Object.prototype.hasOwnProperty.call(customPomClassIdentifierMap, a.className))
       return false;
     const scope = a.attachTo ?? "views";
-    const scopeOk = isView ? scope === "views" || scope === "both" : scope === "components" || scope === "both";
+    const scopeMatchesBoth = scope === "both" || scope === "pagesAndComponents";
+    const scopeOk = isView ? scope === "views" || scopeMatchesBoth : scope === "components" || scopeMatchesBoth;
     if (!scopeOk)
       return false;
     return a.attachWhenUsesComponents.some((c) => hasChildComponent(c));
@@ -4768,148 +4791,6 @@ function getConstructor(childrenComponent, componentHierarchyMap, attachmentsFor
   return `${content}
 `;
 }
-function summarizeHierarchyMap(componentHierarchyMap) {
-  let interactiveComponentCount = 0;
-  let dataTestIdCount = 0;
-  for (const dependencies of componentHierarchyMap.values()) {
-    const selectorCount = dependencies.dataTestIdSet?.size ?? 0;
-    if (selectorCount > 0) {
-      interactiveComponentCount += 1;
-      dataTestIdCount += selectorCount;
-    }
-  }
-  return {
-    entryCount: componentHierarchyMap.size,
-    interactiveComponentCount,
-    dataTestIdCount
-  };
-}
-function isLessRich(candidate, previous) {
-  if (candidate.dataTestIdCount !== previous.dataTestIdCount) {
-    return candidate.dataTestIdCount < previous.dataTestIdCount;
-  }
-  if (candidate.interactiveComponentCount !== previous.interactiveComponentCount) {
-    return candidate.interactiveComponentCount < previous.interactiveComponentCount;
-  }
-  return candidate.entryCount < previous.entryCount;
-}
-function createBuildProcessorPlugin(options) {
-  const {
-    componentHierarchyMap,
-    vueFilesPathMap,
-    viewsDir,
-    scanDirs,
-    basePageClassPath,
-    normalizedBasePagePath,
-    outDir,
-    emitLanguages,
-    csharp,
-    generateFixtures,
-    customPomAttachments,
-    projectRootRef,
-    customPomDir,
-    customPomImportAliases,
-    customPomImportNameCollisionBehavior,
-    testIdAttribute,
-    routerAwarePoms,
-    resolvedRouterEntry,
-    routerType,
-    routerModuleShims,
-    loggerRef
-  } = options;
-  let lastGeneratedMetrics = {
-    entryCount: 0,
-    interactiveComponentCount: 0,
-    dataTestIdCount: 0
-  };
-  return {
-    name: "vue-pom-generator-build",
-    // This plugin exists to generate code on build output; it is not needed during dev-server HMR.
-    apply: "build",
-    enforce: "pre",
-    async buildStart() {
-      if (!routerAwarePoms) {
-        setRouteNameToComponentNameMap(/* @__PURE__ */ new Map());
-        setResolveToComponentNameFn(() => null);
-        return;
-      }
-      let result;
-      if (routerType === "nuxt") {
-        result = await introspectNuxtPages(projectRootRef.current);
-      } else {
-        if (!resolvedRouterEntry)
-          throw new Error("[vue-pom-generator] router.entry is required when router introspection is enabled.");
-        result = await parseRouterFileFromCwd(resolvedRouterEntry, {
-          moduleShims: routerModuleShims,
-          componentNaming: {
-            projectRoot: projectRootRef.current,
-            viewsDirAbs: path.isAbsolute(viewsDir) ? viewsDir : path.resolve(projectRootRef.current, viewsDir),
-            scanDirs
-          }
-        });
-      }
-      const { routeNameMap, routePathMap } = result;
-      setRouteNameToComponentNameMap(routeNameMap);
-      setResolveToComponentNameFn((to) => {
-        if (typeof to === "string") {
-          return routePathMap.get(to) ?? null;
-        }
-        const maybe = to;
-        if (typeof maybe.name === "string" && maybe.name.length) {
-          const key = toPascalCase(maybe.name);
-          return routeNameMap.get(key) ?? null;
-        }
-        if (typeof maybe.path === "string" && maybe.path.length) {
-          return routePathMap.get(maybe.path) ?? null;
-        }
-        return null;
-      });
-      if (!fs.existsSync(basePageClassPath)) {
-        this.error(`BasePage.ts not found at ${basePageClassPath}. Ensure it is included in the build.`);
-      }
-      this.addWatchFile(basePageClassPath);
-      const pointerPath = path.resolve(path.dirname(basePageClassPath), "Pointer.ts");
-      if (!fs.existsSync(pointerPath)) {
-        this.error(`Pointer.ts not found at ${pointerPath}. Ensure it is included in the build.`);
-      }
-      this.addWatchFile(pointerPath);
-    },
-    async buildEnd(error) {
-      if (error) {
-        return;
-      }
-      const metrics = summarizeHierarchyMap(componentHierarchyMap);
-      if (metrics.dataTestIdCount <= 0) {
-        return;
-      }
-      if (isLessRich(metrics, lastGeneratedMetrics)) {
-        return;
-      }
-      await generateFiles(componentHierarchyMap, vueFilesPathMap, normalizedBasePagePath, {
-        outDir,
-        emitLanguages,
-        csharp,
-        generateFixtures,
-        customPomAttachments,
-        projectRoot: projectRootRef.current,
-        customPomDir,
-        customPomImportAliases,
-        customPomImportNameCollisionBehavior,
-        testIdAttribute,
-        vueRouterFluentChaining: routerAwarePoms,
-        routerEntry: resolvedRouterEntry,
-        routerType,
-        viewsDir,
-        scanDirs
-      });
-      lastGeneratedMetrics = metrics;
-      loggerRef.current.info(`generated POMs (${metrics.entryCount} entries, ${metrics.interactiveComponentCount} interactive components, ${metrics.dataTestIdCount} selectors)`);
-    },
-    closeBundle() {
-      loggerRef.current.info("build complete");
-    }
-  };
-}
 const TESTID_CLICK_EVENT_NAME = "__testid_event__";
 const TESTID_CLICK_EVENT_STRICT_FLAG = "__testid_click_event_strict__";
 const CLICK_EVENT_NAME = TESTID_CLICK_EVENT_NAME;
@@ -5992,6 +5873,265 @@ Fix: remove the explicit ${attrLabel}, or change existingIdBehavior to "overwrit
     }
   };
 }
+function summarizeHierarchyMap(componentHierarchyMap) {
+  let interactiveComponentCount = 0;
+  let dataTestIdCount = 0;
+  for (const dependencies of componentHierarchyMap.values()) {
+    const selectorCount = dependencies.dataTestIdSet?.size ?? 0;
+    if (selectorCount > 0) {
+      interactiveComponentCount += 1;
+      dataTestIdCount += selectorCount;
+    }
+  }
+  return {
+    entryCount: componentHierarchyMap.size,
+    interactiveComponentCount,
+    dataTestIdCount
+  };
+}
+function isLessRich(candidate, previous) {
+  if (candidate.dataTestIdCount !== previous.dataTestIdCount) {
+    return candidate.dataTestIdCount < previous.dataTestIdCount;
+  }
+  if (candidate.interactiveComponentCount !== previous.interactiveComponentCount) {
+    return candidate.interactiveComponentCount < previous.interactiveComponentCount;
+  }
+  return candidate.entryCount < previous.entryCount;
+}
+function createBuildProcessorPlugin(options) {
+  const {
+    componentHierarchyMap,
+    vueFilesPathMap,
+    viewsDir,
+    scanDirs,
+    basePageClassPath,
+    normalizedBasePagePath,
+    outDir,
+    emitLanguages,
+    csharp,
+    generateFixtures,
+    customPomAttachments,
+    projectRootRef,
+    customPomDir,
+    customPomImportAliases,
+    customPomImportNameCollisionBehavior,
+    testIdAttribute,
+    nameCollisionBehavior,
+    existingIdBehavior,
+    nativeWrappers,
+    excludedComponents,
+    getWrapperSearchRoots,
+    routerAwarePoms,
+    resolvedRouterEntry,
+    routerType,
+    routerModuleShims,
+    loggerRef
+  } = options;
+  let lastGeneratedMetrics = {
+    entryCount: 0,
+    interactiveComponentCount: 0,
+    dataTestIdCount: 0
+  };
+  const getViewsDirAbs = () => path.isAbsolute(viewsDir) ? viewsDir : path.resolve(projectRootRef.current, viewsDir);
+  const getScriptInfo = (source, filename) => {
+    try {
+      const { descriptor } = compilerSfc.parse(source, { filename });
+      if (!descriptor.script && !descriptor.scriptSetup)
+        return { bindings: void 0, isScriptSetup: false };
+      const scriptBlock = compilerSfc.compileScript(descriptor, { id: filename });
+      return { bindings: scriptBlock.bindings, isScriptSetup: !!descriptor.scriptSetup };
+    } catch {
+      return { bindings: void 0, isScriptSetup: false };
+    }
+  };
+  const supplementHierarchyFromFilesystem = () => {
+    const walkFilesRecursive = (rootDir) => {
+      const out = [];
+      const stack = [rootDir];
+      while (stack.length) {
+        const dir = stack.pop();
+        if (!dir) continue;
+        let entries = [];
+        try {
+          entries = fs.readdirSync(dir, { withFileTypes: true });
+        } catch {
+          continue;
+        }
+        for (const ent of entries) {
+          if (ent.isDirectory()) {
+            if (ent.name === "node_modules" || ent.name === ".git" || ent.name === "dist")
+              continue;
+            stack.push(path.join(dir, ent.name));
+            continue;
+          }
+          if (ent.isFile() && ent.name.endsWith(".vue")) {
+            out.push(path.join(dir, ent.name));
+          }
+        }
+      }
+      return out;
+    };
+    let supplemented = 0;
+    for (const dir of scanDirs) {
+      const absDir = path.resolve(projectRootRef.current, dir);
+      if (!fs.existsSync(absDir))
+        continue;
+      for (const filePath of walkFilesRecursive(absDir)) {
+        const absolutePath = path.resolve(filePath);
+        const componentName = resolveComponentNameFromPath({
+          filename: absolutePath,
+          projectRoot: projectRootRef.current,
+          viewsDirAbs: getViewsDirAbs(),
+          scanDirs,
+          extraRoots: [process.cwd()]
+        });
+        if (componentHierarchyMap.has(componentName))
+          continue;
+        let sfc = "";
+        try {
+          sfc = fs.readFileSync(absolutePath, "utf8");
+        } catch {
+          continue;
+        }
+        const { descriptor } = compilerSfc.parse(sfc, { filename: absolutePath });
+        const template = descriptor.template?.content ?? "";
+        if (!template.trim()) {
+          vueFilesPathMap.set(componentName, absolutePath);
+          componentHierarchyMap.set(componentName, {
+            filePath: absolutePath,
+            childrenComponentSet: /* @__PURE__ */ new Set(),
+            usedComponentSet: /* @__PURE__ */ new Set(),
+            dataTestIdSet: /* @__PURE__ */ new Set(),
+            isView: false,
+            methodsContent: ""
+          });
+          supplemented++;
+          continue;
+        }
+        const { bindings: bindingMetadata, isScriptSetup } = getScriptInfo(sfc, absolutePath);
+        vueFilesPathMap.set(componentName, absolutePath);
+        try {
+          compilerDom__namespace.compile(template, {
+            filename: absolutePath,
+            prefixIdentifiers: true,
+            inline: isScriptSetup,
+            bindingMetadata,
+            nodeTransforms: [
+              createTestIdTransform(
+                componentName,
+                componentHierarchyMap,
+                nativeWrappers,
+                excludedComponents,
+                getViewsDirAbs(),
+                {
+                  existingIdBehavior: existingIdBehavior ?? "preserve",
+                  testIdAttribute,
+                  nameCollisionBehavior,
+                  warn: (message) => loggerRef.current.warn(message),
+                  vueFilesPathMap,
+                  wrapperSearchRoots: getWrapperSearchRoots()
+                }
+              )
+            ]
+          });
+        } catch {
+        }
+        supplemented++;
+      }
+    }
+    if (supplemented > 0) {
+      loggerRef.current.info(`supplemented ${supplemented} components from filesystem walk (not in build graph)`);
+    }
+  };
+  return {
+    name: "vue-pom-generator-build",
+    // This plugin exists to generate code on build output; it is not needed during dev-server HMR.
+    apply: "build",
+    enforce: "pre",
+    async buildStart() {
+      if (!routerAwarePoms) {
+        setRouteNameToComponentNameMap(/* @__PURE__ */ new Map());
+        setResolveToComponentNameFn(() => null);
+        return;
+      }
+      let result;
+      if (routerType === "nuxt") {
+        result = await introspectNuxtPages(projectRootRef.current);
+      } else {
+        if (!resolvedRouterEntry)
+          throw new Error("[vue-pom-generator] router.entry is required when router introspection is enabled.");
+        result = await parseRouterFileFromCwd(resolvedRouterEntry, {
+          moduleShims: routerModuleShims,
+          componentNaming: {
+            projectRoot: projectRootRef.current,
+            viewsDirAbs: path.isAbsolute(viewsDir) ? viewsDir : path.resolve(projectRootRef.current, viewsDir),
+            scanDirs
+          }
+        });
+      }
+      const { routeNameMap, routePathMap } = result;
+      setRouteNameToComponentNameMap(routeNameMap);
+      setResolveToComponentNameFn((to) => {
+        if (typeof to === "string") {
+          return routePathMap.get(to) ?? null;
+        }
+        const maybe = to;
+        if (typeof maybe.name === "string" && maybe.name.length) {
+          const key = toPascalCase(maybe.name);
+          return routeNameMap.get(key) ?? null;
+        }
+        if (typeof maybe.path === "string" && maybe.path.length) {
+          return routePathMap.get(maybe.path) ?? null;
+        }
+        return null;
+      });
+      if (!fs.existsSync(basePageClassPath)) {
+        this.error(`BasePage.ts not found at ${basePageClassPath}. Ensure it is included in the build.`);
+      }
+      this.addWatchFile(basePageClassPath);
+      const pointerPath = path.resolve(path.dirname(basePageClassPath), "Pointer.ts");
+      if (!fs.existsSync(pointerPath)) {
+        this.error(`Pointer.ts not found at ${pointerPath}. Ensure it is included in the build.`);
+      }
+      this.addWatchFile(pointerPath);
+    },
+    async buildEnd(error) {
+      if (error) {
+        return;
+      }
+      supplementHierarchyFromFilesystem();
+      const metrics = summarizeHierarchyMap(componentHierarchyMap);
+      if (metrics.dataTestIdCount <= 0) {
+        return;
+      }
+      if (isLessRich(metrics, lastGeneratedMetrics)) {
+        return;
+      }
+      await generateFiles(componentHierarchyMap, vueFilesPathMap, normalizedBasePagePath, {
+        outDir,
+        emitLanguages,
+        csharp,
+        generateFixtures,
+        customPomAttachments,
+        projectRoot: projectRootRef.current,
+        customPomDir,
+        customPomImportAliases,
+        customPomImportNameCollisionBehavior,
+        testIdAttribute,
+        vueRouterFluentChaining: routerAwarePoms,
+        routerEntry: resolvedRouterEntry,
+        routerType,
+        viewsDir,
+        scanDirs
+      });
+      lastGeneratedMetrics = metrics;
+      loggerRef.current.info(`generated POMs (${metrics.entryCount} entries, ${metrics.interactiveComponentCount} interactive components, ${metrics.dataTestIdCount} selectors)`);
+    },
+    closeBundle() {
+      loggerRef.current.info("build complete");
+    }
+  };
+}
 function createDevProcessorPlugin(options) {
   const {
     nativeWrappers,
@@ -6011,6 +6151,7 @@ function createDevProcessorPlugin(options) {
     customPomImportAliases,
     customPomImportNameCollisionBehavior,
     nameCollisionBehavior = "suffix",
+    existingIdBehavior,
     testIdAttribute,
     routerAwarePoms,
     resolvedRouterEntry,
@@ -6088,6 +6229,17 @@ function createDevProcessorPlugin(options) {
         });
         return descriptor.template?.content ?? "";
       };
+      const getScriptInfo = (source, filename) => {
+        try {
+          const { descriptor } = compilerSfc.parse(source, { filename });
+          if (!descriptor.script && !descriptor.scriptSetup)
+            return { bindings: void 0, isScriptSetup: false };
+          const scriptBlock = compilerSfc.compileScript(descriptor, { id: filename });
+          return { bindings: scriptBlock.bindings, isScriptSetup: !!descriptor.scriptSetup };
+        } catch {
+          return { bindings: void 0, isScriptSetup: false };
+        }
+      };
       const walkFilesRecursive = (rootDir) => {
         const out = [];
         const stack = [rootDir];
@@ -6147,9 +6299,12 @@ function createDevProcessorPlugin(options) {
         const template = extractTemplateFromSfc(sfc, absolutePath);
         if (!template.trim())
           return { componentName, ms: node_perf_hooks.performance.now() - started, compiled: true };
+        const { bindings: bindingMetadata, isScriptSetup } = getScriptInfo(sfc, absolutePath);
         compilerDom__namespace.compile(template, {
           filename: absolutePath,
           prefixIdentifiers: true,
+          inline: isScriptSetup,
+          bindingMetadata,
           nodeTransforms: [
             createTestIdTransform(
               componentName,
@@ -6158,7 +6313,7 @@ function createDevProcessorPlugin(options) {
               excludedComponents,
               getViewsDirAbs(),
               {
-                existingIdBehavior: "preserve",
+                existingIdBehavior: existingIdBehavior ?? "preserve",
                 nameCollisionBehavior,
                 testIdAttribute,
                 warn: (message) => loggerRef.current.warn(message),
@@ -6400,6 +6555,7 @@ function createSupportPlugins(options) {
     scanDirs,
     getWrapperSearchRoots,
     nameCollisionBehavior = "suffix",
+    existingIdBehavior,
     outDir,
     emitLanguages,
     csharp,
@@ -6453,6 +6609,11 @@ function createSupportPlugins(options) {
     customPomImportAliases,
     customPomImportNameCollisionBehavior,
     testIdAttribute,
+    nameCollisionBehavior,
+    existingIdBehavior,
+    nativeWrappers,
+    excludedComponents,
+    getWrapperSearchRoots,
     routerAwarePoms,
     routerType,
     resolvedRouterEntry,
@@ -6477,6 +6638,7 @@ function createSupportPlugins(options) {
     customPomImportAliases,
     customPomImportNameCollisionBehavior,
     nameCollisionBehavior,
+    existingIdBehavior,
     testIdAttribute,
     routerAwarePoms,
     routerType,
@@ -7058,6 +7220,7 @@ function createVuePomGeneratorPlugins(options = {}) {
     scanDirs,
     getWrapperSearchRoots: getWrapperSearchRootsAbs,
     nameCollisionBehavior,
+    existingIdBehavior,
     outDir,
     emitLanguages,
     csharp,