@immense/vue-pom-generator 1.0.63 → 1.0.64

package/RELEASE_NOTES.md

@@ -1,30 +1,48 @@
-● ```markdown
+● Based on the commit message and changes, here are the release notes:
+
+  ---
+
+  # v1.0.64
+
   ## Highlights
 
-  - Fixed nested component POMs not being properly attached to their parent views
-  - Added comprehensive test coverage for nested component POM attachment
+  - **TypeScript template expression support** – Compiler now parses TypeScript annotations in Vue
+   template expressions (e.g., `@row-click="(row: RowType) => ..."`), fixing crashes in Nuxt 4 +
+  TS codebases
+  - **Graceful submit-button fallback** – Submit buttons with dynamic labels now respect
+  `missingSemanticNameBehavior: "ignore"` and generate `SubmitButton` / `clickSubmit()` methods
+  instead of throwing
+  - **Improved TypeScript compatibility** – All three plugin compilation paths (dev-plugin,
+  build-plugin, vue-plugin) now support TypeScript expression syntax
 
   ## Changes
 
-  ### 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
+  ### Parser Enhancements
+  - Added `expressionPlugins: ["typescript"]` to all `compilerDom.compile()` call sites
+  (dev-plugin, build-plugin, vue-plugin)
+  - Vue plugin merges expression plugins with user-supplied `userCompilerOptions` to preserve
+  custom configuration
 
-  ### Testing
-  - Added 54 lines of test coverage for class generation including nested component scenarios
-
-  ## Breaking Changes
+  ### Submit Button Handling
+  - Submit buttons with dynamic inner text (e.g., ternary expressions like `{{ isNew ? 'Create' :
+  'Save' }}`) now honor `missingSemanticNameBehavior: "ignore"` option
+  - Falls back to literal `"submit"` identifier when semantic name cannot be derived, generating
+  `SubmitButton` / `clickSubmit()` POM surface
+  - Default behavior (throwing on missing semantic name) remains unchanged
 
-  None
+  ### Testing
+  - Added 3 regression tests for TypeScript expression parsing and submit-button fallback behavior
+  - Test suite: 163 → 166 tests passing
+  - All validation passes: typecheck, eslint, build
 
   ## Pull Requests Included
 
-  None (direct commit to main)
+  - fix: parse TypeScript template expressions + allow submit-button fallback
+  [#20](https://github.com/immense/vue-pom-generator/pull/20)
 
   ## Testing
 
-  Tests added to validate nested component POM attachment behavior. Run test suite with `npm
-  test`.
-  ```
+  Validated on Nuxt 4 + Vue 3 + TypeScript codebase. Three new regression tests added covering
+  TypeScript expression parsing and submit-button fallback scenarios. Full test suite passes (166
+  tests).
 

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,
@@ -7076,6 +7077,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 +7521,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 +7597,7 @@ function createBuildProcessorPlugin(options) {
     customPomImportNameCollisionBehavior,
     testIdAttribute,
     nameCollisionBehavior,
+    missingSemanticNameBehavior,
     existingIdBehavior,
     routerAwarePoms,
     routerType,
@@ -7687,6 +7693,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 +7707,7 @@ function createBuildProcessorPlugin(options) {
                   existingIdBehavior: existingIdBehavior ?? "error",
                   testIdAttribute,
                   nameCollisionBehavior,
+                  missingSemanticNameBehavior,
                   warn: (message) => loggerRef.current.warn(message),
                   vueFilesPathMap,
                   wrapperSearchRoots: getWrapperSearchRoots()
@@ -7845,6 +7855,7 @@ function createDevProcessorPlugin(options) {
     customPomImportAliases,
     customPomImportNameCollisionBehavior,
     nameCollisionBehavior,
+    missingSemanticNameBehavior,
     existingIdBehavior,
     testIdAttribute,
     routerAwarePoms,
@@ -8029,6 +8040,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 +8056,7 @@ function createDevProcessorPlugin(options) {
               {
                 existingIdBehavior: existingIdBehavior ?? "error",
                 nameCollisionBehavior,
+                missingSemanticNameBehavior,
                 testIdAttribute,
                 warn: (message) => loggerRef.current.warn(message),
                 vueFilesPathMap: provisionalVuePathMap,
@@ -8786,6 +8804,7 @@ function createVuePluginWithTestIds(options) {
     vueOptions,
     existingIdBehavior,
     nameCollisionBehavior,
+    missingSemanticNameBehavior = "error",
     nativeWrappers,
     elementMetadata,
     semanticNameMap,
@@ -8866,6 +8885,7 @@ function createVuePluginWithTestIds(options) {
                 existingIdBehavior,
                 testIdAttribute,
                 nameCollisionBehavior,
+                missingSemanticNameBehavior,
                 warn: (message) => loggerRef.current.warn(message),
                 vueFilesPathMap,
                 wrapperSearchRoots: getWrapperSearchRoots()
@@ -8920,6 +8940,7 @@ function createVuePluginWithTestIds(options) {
               existingIdBehavior,
               testIdAttribute,
               nameCollisionBehavior,
+              missingSemanticNameBehavior,
               warn: (message) => loggerRef.current.warn(message),
               vueFilesPathMap,
               wrapperSearchRoots: getWrapperSearchRoots()
@@ -8967,9 +8988,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 +9294,7 @@ function createVuePomGeneratorPlugins(options = {}) {
     customPomImportAliases: resolvedCustomPomImportAliases,
     customPomImportNameCollisionBehavior: customPoms?.importNameCollisionBehavior,
     nameCollisionBehavior: generationOptions?.nameCollisionBehavior,
+    missingSemanticNameBehavior: generationOptions?.missingSemanticNameBehavior,
     existingIdBehavior: resolvedInjectionOptions.existingIdBehavior,
     testIdAttribute,
     accessibilityAudit: generationOptions?.accessibilityAudit,
@@ -9354,6 +9383,7 @@ function createVuePomGeneratorPlugins(options = {}) {
     vueOptions,
     existingIdBehavior: resolvedGenerationOptions.existingIdBehavior,
     nameCollisionBehavior: resolvedGenerationOptions.nameCollisionBehavior,
+    missingSemanticNameBehavior: resolvedGenerationOptions.missingSemanticNameBehavior,
     nativeWrappers,
     elementMetadata,
     semanticNameMap,