@immense/vue-pom-generator 1.0.63 → 1.0.65

package/RELEASE_NOTES.md

@@ -1,30 +1,31 @@
-● ```markdown
-  ## Highlights
+● ## v1.0.65
 
-  - Fixed nested component POMs not being properly attached to their parent views
-  - Added comprehensive test coverage for nested component POM attachment
+  ### Highlights
 
-  ## Changes
+  - Fixed parsing of guarded handler expressions (e.g., `@click="condition && handler"`)
+  - Improved semantic name resolution for wrapped and conditional event handlers
+  - Enhanced Vue compiler AST traversal to handle logical expressions (`&&` operators)
 
-  ### Bug Fixes
-  - Resolved issue where nested component POMs were not correctly associated with view classes
-  during generation
-  - Improved POM attachment logic in class generation module
+  ### Changes
 
-  ### Testing
-  - Added 54 lines of test coverage for class generation including nested component scenarios
-
-  ## Breaking Changes
+  **Parser Improvements**
+  - Added support for `LogicalExpression` nodes in handler attribute parsing
+  - Introduced `unwrapSemanticHelperCall` to handle Vue compiler helpers (`_unref`,
+  `_withModifiers`, etc.)
+  - Refactored `resolveSemanticName` to recursively unwrap nested expressions and guarded calls
+  - Handler names now correctly extracted from conditional expressions like `isValid &&
+  submitForm`
 
-  None
+  **Testing**
+  - Added test coverage for guarded handler scenarios
+  - Updated transform and utils test suites to validate new parsing logic
 
-  ## Pull Requests Included
+  ### Pull Requests Included
 
-  None (direct commit to main)
+  No pull request was created for this fix; it was committed directly to `main`.
 
-  ## Testing
+  ### Testing
 
-  Tests added to validate nested component POM attachment behavior. Run test suite with `npm
-  test`.
-  ```
+  Validated with expanded unit test coverage in `tests/transform.test.ts` and
+  `tests/utils-coverage.test.ts`.
 

package/dist/index.cjs

@@ -258,6 +258,7 @@ function resolveGenerationSupportOptions(options) {
     customPomImportAliases: options.customPomImportAliases,
     customPomImportNameCollisionBehavior: options.customPomImportNameCollisionBehavior ?? "error",
     nameCollisionBehavior: options.nameCollisionBehavior ?? "error",
+    missingSemanticNameBehavior: options.missingSemanticNameBehavior ?? "error",
     existingIdBehavior: options.existingIdBehavior ?? "error",
     testIdAttribute: (options.testIdAttribute ?? "data-testid").trim() || "data-testid",
     accessibilityAudit: options.accessibilityAudit ?? false,
@@ -1894,6 +1895,12 @@ function nodeHandlerAttributeInfo(node) {
     const n = node2;
     return typeof n.computed === "boolean" && typeof n.key === "object" && n.key !== null && typeof n.value === "object" && n.value !== null;
   };
+  const isLogicalExpressionNode = (node2) => {
+    if (!isNodeType2(node2, "LogicalExpression"))
+      return false;
+    const n = node2;
+    return typeof n.operator === "string" && typeof n.left === "object" && n.left !== null && typeof n.right === "object" && n.right !== null;
+  };
   const getLastIdentifierFromMemberChain = (node2) => {
     if (!node2)
       return null;
@@ -2064,48 +2071,66 @@ function nodeHandlerAttributeInfo(node) {
     const semanticNameHint2 = suffix ? `${toPascalCase(name)}${suffix}` : toPascalCase(name);
     return semanticNameHint2;
   };
+  const unwrapSemanticHelperCall = (candidateExpr) => {
+    if (!isCallExpressionNode(candidateExpr)) {
+      return null;
+    }
+    const calleeName = getLastIdentifierFromMemberChain(candidateExpr.callee);
+    if (calleeName !== "_unref" && calleeName !== "unref" && calleeName !== "_withModifiers" && calleeName !== "withModifiers") {
+      return null;
+    }
+    const firstArg = candidateExpr.arguments[0];
+    return typeof firstArg === "object" && firstArg !== null ? firstArg : null;
+  };
   const resolveSemanticName = (candidateExpr) => {
     if (!candidateExpr) {
       return null;
     }
+    const unwrappedHelperCandidate = unwrapSemanticHelperCall(candidateExpr);
+    if (unwrappedHelperCandidate) {
+      return resolveSemanticName(unwrappedHelperCandidate);
+    }
     const direct = getLastIdentifierFromMemberChain(candidateExpr);
     if (direct) {
       return toPascalCase(direct);
     }
+    const directCall = tryFromCallExpression(candidateExpr);
+    if (directCall) {
+      return directCall;
+    }
+    if (isAssignmentExpressionNode(candidateExpr)) {
+      const lhs = getAssignmentTargetName(candidateExpr.left);
+      if (lhs) {
+        const rhs = stableWordFromValue(candidateExpr.right);
+        return `Set${toPascalCase(lhs)}${rhs ?? ""}`;
+      }
+    }
+    if (isLogicalExpressionNode(candidateExpr) && candidateExpr.operator === "&&") {
+      return resolveSemanticName(candidateExpr.right);
+    }
     if (isArrowFunctionExpressionNode(candidateExpr)) {
       const body = candidateExpr.body;
-      const directCall = tryFromCallExpression(body);
-      if (directCall) {
-        return directCall;
-      }
-      if (isAssignmentExpressionNode(body)) {
-        const lhs = getAssignmentTargetName(body.left);
-        if (lhs) {
-          const rhs = stableWordFromValue(body.right);
-          return `Set${toPascalCase(lhs)}${rhs ?? ""}`;
-        }
-      }
       if (isBlockStatementNode(body)) {
         const stmts = body.body ?? [];
         if (stmts.length > 0) {
           const firstStmt = stmts[0];
           if (isReturnStatementNode(firstStmt)) {
-            const fromReturn = tryFromCallExpression(firstStmt.argument ?? null);
+            const fromReturn = resolveSemanticName(firstStmt.argument ?? null);
             if (fromReturn) {
               return fromReturn;
             }
           }
           if (isExpressionStatementNode(firstStmt)) {
-            const fromExpr = tryFromCallExpression(firstStmt.expression ?? null);
+            const fromExpr = resolveSemanticName(firstStmt.expression ?? null);
             if (fromExpr) {
               return fromExpr;
             }
           }
         }
       }
-      const bodyName = getLastIdentifierFromMemberChain(body);
+      const bodyName = resolveSemanticName(body);
       if (bodyName) {
-        return toPascalCase(bodyName);
+        return bodyName;
       }
     }
     return null;
@@ -7076,6 +7101,7 @@ function createTestIdTransform(componentName, componentHierarchyMap, nativeWrapp
   const existingIdBehavior = options.existingIdBehavior ?? "error";
   const testIdAttribute = (options.testIdAttribute || "data-testid").trim() || "data-testid";
   const nameCollisionBehavior = options.nameCollisionBehavior ?? "error";
+  const missingSemanticNameBehavior = options.missingSemanticNameBehavior ?? "error";
   const warn = options.warn;
   const vueFilesPathMap = options.vueFilesPathMap;
   const wrapperSearchRoots = options.wrapperSearchRoots ?? [];
@@ -7519,13 +7545,16 @@ Fix: remove the explicit ${attrLabel}, or change existingIdBehavior to "overwrit
     }
     const isSubmit = element.props.find((p) => p.type === compilerCore.NodeTypes.ATTRIBUTE && p.name === "type")?.value?.content === "submit";
     if (isSubmit) {
-      const identifier = getStaticIdOrNameHint(element) || innerText;
+      let identifier = getStaticIdOrNameHint(element) || innerText;
       if (!identifier) {
-        const loc = element.loc?.start;
-        const locationHint = loc ? `${loc.line}:${loc.column}` : "unknown";
-        throw new Error(
-          `[vue-pom-generator] submit button appears identifiable but no usable identity could be derived in ${componentName} (${context.filename ?? "unknown"}:${locationHint}) — id/name were missing/empty and innerText was also missing/invalid`
-        );
+        if (missingSemanticNameBehavior === "error") {
+          const loc = element.loc?.start;
+          const locationHint = loc ? `${loc.line}:${loc.column}` : "unknown";
+          throw new Error(
+            `[vue-pom-generator] submit button appears identifiable but no usable identity could be derived in ${componentName} (${context.filename ?? "unknown"}:${locationHint}) — id/name were missing/empty and innerText was also missing/invalid. Fix: give the button a static id/name, a static inner text, or set missingSemanticNameBehavior = "ignore" to fall back to the generic "submit" identifier.`
+          );
+        }
+        identifier = "submit";
       }
       const testId = getSubmitDataTestId(identifier);
       applyResolvedDataTestIdForElement({
@@ -7592,6 +7621,7 @@ function createBuildProcessorPlugin(options) {
     customPomImportNameCollisionBehavior,
     testIdAttribute,
     nameCollisionBehavior,
+    missingSemanticNameBehavior,
     existingIdBehavior,
     routerAwarePoms,
     routerType,
@@ -7687,6 +7717,9 @@ function createBuildProcessorPlugin(options) {
             prefixIdentifiers: true,
             inline: isScriptSetup,
             bindingMetadata,
+            // See dev-plugin.ts — same rationale: enable TS in template
+            // expressions so `(row: RowType) => ...` handlers parse.
+            expressionPlugins: ["typescript"],
             nodeTransforms: [
               createTestIdTransform(
                 componentName,
@@ -7698,6 +7731,7 @@ function createBuildProcessorPlugin(options) {
                   existingIdBehavior: existingIdBehavior ?? "error",
                   testIdAttribute,
                   nameCollisionBehavior,
+                  missingSemanticNameBehavior,
                   warn: (message) => loggerRef.current.warn(message),
                   vueFilesPathMap,
                   wrapperSearchRoots: getWrapperSearchRoots()
@@ -7845,6 +7879,7 @@ function createDevProcessorPlugin(options) {
     customPomImportAliases,
     customPomImportNameCollisionBehavior,
     nameCollisionBehavior,
+    missingSemanticNameBehavior,
     existingIdBehavior,
     testIdAttribute,
     routerAwarePoms,
@@ -8029,6 +8064,12 @@ function createDevProcessorPlugin(options) {
           prefixIdentifiers: true,
           inline: isScriptSetup,
           bindingMetadata,
+          // Vue templates may contain TypeScript type annotations in expressions
+          // (e.g. `@row-click="(row: RowType) => navigateTo(...)"` in Nuxt + TS
+          // apps). Without this flag, Vue's internal processExpression step
+          // delegates to @babel/parser without the TS plugin and crashes on
+          // "Unexpected token, expected ','".
+          expressionPlugins: ["typescript"],
           nodeTransforms: [
             createTestIdTransform(
               componentName,
@@ -8039,6 +8080,7 @@ function createDevProcessorPlugin(options) {
               {
                 existingIdBehavior: existingIdBehavior ?? "error",
                 nameCollisionBehavior,
+                missingSemanticNameBehavior,
                 testIdAttribute,
                 warn: (message) => loggerRef.current.warn(message),
                 vueFilesPathMap: provisionalVuePathMap,
@@ -8786,6 +8828,7 @@ function createVuePluginWithTestIds(options) {
     vueOptions,
     existingIdBehavior,
     nameCollisionBehavior,
+    missingSemanticNameBehavior = "error",
     nativeWrappers,
     elementMetadata,
     semanticNameMap,
@@ -8866,6 +8909,7 @@ function createVuePluginWithTestIds(options) {
                 existingIdBehavior,
                 testIdAttribute,
                 nameCollisionBehavior,
+                missingSemanticNameBehavior,
                 warn: (message) => loggerRef.current.warn(message),
                 vueFilesPathMap,
                 wrapperSearchRoots: getWrapperSearchRoots()
@@ -8920,6 +8964,7 @@ function createVuePluginWithTestIds(options) {
               existingIdBehavior,
               testIdAttribute,
               nameCollisionBehavior,
+              missingSemanticNameBehavior,
               warn: (message) => loggerRef.current.warn(message),
               vueFilesPathMap,
               wrapperSearchRoots: getWrapperSearchRoots()
@@ -8967,9 +9012,16 @@ function createVuePluginWithTestIds(options) {
       const compile = compilerDom2.compile;
       const { descriptor } = parse(code, { filename: cleanPath });
       if (descriptor.template) {
+        const mergedExpressionPlugins = Array.from(
+          /* @__PURE__ */ new Set([
+            "typescript",
+            ...userCompilerOptions.expressionPlugins ?? []
+          ])
+        );
         compile(descriptor.template.content, {
           ...userCompilerOptions,
           filename: cleanPath,
+          expressionPlugins: mergedExpressionPlugins,
           nodeTransforms: getNodeTransforms(cleanPath, componentName)
         });
         loggerRef.current.debug(`Metadata collected for ${cleanPath}`);
@@ -9266,6 +9318,7 @@ function createVuePomGeneratorPlugins(options = {}) {
     customPomImportAliases: resolvedCustomPomImportAliases,
     customPomImportNameCollisionBehavior: customPoms?.importNameCollisionBehavior,
     nameCollisionBehavior: generationOptions?.nameCollisionBehavior,
+    missingSemanticNameBehavior: generationOptions?.missingSemanticNameBehavior,
     existingIdBehavior: resolvedInjectionOptions.existingIdBehavior,
     testIdAttribute,
     accessibilityAudit: generationOptions?.accessibilityAudit,
@@ -9354,6 +9407,7 @@ function createVuePomGeneratorPlugins(options = {}) {
     vueOptions,
     existingIdBehavior: resolvedGenerationOptions.existingIdBehavior,
     nameCollisionBehavior: resolvedGenerationOptions.nameCollisionBehavior,
+    missingSemanticNameBehavior: resolvedGenerationOptions.missingSemanticNameBehavior,
     nativeWrappers,
     elementMetadata,
     semanticNameMap,