@immense/vue-pom-generator 1.0.30 → 1.0.32

package/README.md

@@ -35,15 +35,15 @@ Exported entrypoints:
 - `injection`: how `data-testid` (or your chosen attribute) is derived/injected
 - `generation`: how Page Object Models (POMs) and Playwright helpers are generated
 
-The generator emits an aggregated output under `generation.outDir` (default `tests/playwright/generated`):
+The generator emits an aggregated output under `generation.outDir` (default `tests/playwright/__generated__`):
 
-- `tests/playwright/generated/page-object-models.g.ts` (generated; do not edit)
-- `tests/playwright/generated/index.ts` (generated stable barrel)
-- managed `.gitattributes` files alongside generated outputs so GitHub Linguist treats them as generated by default
+- `tests/playwright/__generated__/page-object-models.g.ts` (generated; do not edit)
+- `tests/playwright/__generated__/index.ts` (generated stable barrel)
+- managed `.gitattributes` files only when you emit outside `__generated__`
 
 If `generation.playwright.fixtures` is enabled, it also emits:
 
-- `tests/playwright/generated/fixtures.g.ts` (generated; do not edit)
+- `tests/playwright/__generated__/fixtures.g.ts` (generated; do not edit)
 
 ### Vite config example
 
@@ -98,8 +98,8 @@ export default defineConfig(() => {
         namespace: "MyProject.Tests.Generated",
       },
 
-      // Default: tests/playwright/generated
-      outDir: "tests/playwright/generated",
+      // Default: tests/playwright/__generated__
+      outDir: "tests/playwright/__generated__",
 
       // Controls how to handle duplicate generated member names within a single POM class.
       // - "error": fail compilation

package/RELEASE_NOTES.md

@@ -1,44 +1,38 @@
-● # Release Notes: v1.0.30
+● # Release Notes: v1.0.32
 
   ## Highlights
 
-  - Refactored wrapper search roots configuration for improved flexibility
-  - Enhanced plugin system with better type definitions and support
-  - Improved test coverage with expanded transform test cases
-  - Added CI automation for PR release note previews
+  - Fixed handling of missing helpers and keyed ID branches in class generation
+  - Added robust error tolerance for edge cases in Vue component transformation
+  - Expanded test coverage with 109 new test lines across generated TypeScript and utility
+  coverage tests
+  - Introduced PR release-notes preview comments via GitHub Actions
 
   ## Changes
 
-  ### Core Functionality
-  - Refactored wrapper search roots configuration in transform logic
-  - Enhanced transform logic with improved structure (198 additions, significant reorganization)
+  **Bug Fixes**
+  - Tolerate missing helpers and keyed ID branches in class generation logic
+  (`class-generation/index.ts`, `utils.ts`)
 
-  ### Plugin System
-  - Updated plugin types with refined interfaces
-  - Improved Vue plugin implementation
-  - Enhanced plugin creation utilities
-  - Better dev plugin support
+  **Testing**
+  - Added comprehensive tests for generated TypeScript output (`tests/generated-tsc.test.ts`: +74
+  lines)
+  - Expanded utility function coverage tests (`tests/utils-coverage.test.ts`: +35 lines)
 
-  ### Testing & Quality
-  - Expanded transform test suite with additional test cases
-  - Updated test assertions for improved coverage
-
-  ### Tooling & CI
-  - Added automated PR release-notes preview comments
-
-  ### Documentation
-  - Updated README with additional information
+  **CI/Automation**
+  - Added automated PR release-notes preview comments to pull requests
 
   ## Breaking Changes
 
-  None identified in this release.
+  None
 
   ## Pull Requests Included
 
-  - #1 Add PR release-notes preview comments (https://github.com/immense/vue-pom-generator/pull/1)
-   by @dkattan
+  - [#1](https://github.com/immense/vue-pom-generator/pull/1) Add PR release-notes preview
+  comments (@dkattan)
 
   ## Testing
 
-  Existing test suite updated and expanded with new test cases in `transform.test.ts`.
+  Significant test additions: 74 lines in generated TypeScript tests and 35 lines in utility
+  coverage tests validate the fix for missing helpers and keyed ID branches.
 

package/class-generation/index.ts

@@ -407,6 +407,7 @@ interface GenerateContentOptions {
   customPomDir?: string;
   customPomImportAliases?: Record<string, string>;
   customPomClassIdentifierMap?: Record<string, string>;
+  customPomAvailableClassIdentifiers?: Set<string>;
 
   /** Attribute name to treat as the test id. Defaults to `data-testid`. */
   testIdAttribute?: string;
@@ -524,6 +525,11 @@ function escapeGitAttributesPattern(value: string): string {
   return output;
 }
 
+function pathUsesGeneratedHeuristic(filePath: string): boolean {
+  const normalized = path.normalize(filePath);
+  return normalized.split(path.sep).includes("__generated__");
+}
+
 function buildManagedGitAttributesBlock(entries: string[]): string {
   return [
     GENERATED_GITATTRIBUTES_BLOCK_START,
@@ -581,6 +587,10 @@ function buildGeneratedGitAttributesFiles(generatedFilePaths: string[]): Generat
       continue;
     }
 
+    if (pathUsesGeneratedHeuristic(resolvedFilePath)) {
+      continue;
+    }
+
     const dir = path.dirname(resolvedFilePath);
     const entry = `${escapeGitAttributesPattern(path.basename(resolvedFilePath))} linguist-generated`;
     const entries = entriesByDir.get(dir) ?? new Set<string>();
@@ -1144,8 +1154,14 @@ function generateViewObjectModelContent(
     return false;
   };
 
+  const customPomClassIdentifierMap = options.customPomClassIdentifierMap ?? {};
+  const customPomAvailableClassIdentifiers = options.customPomAvailableClassIdentifiers ?? new Set<string>();
+
   const attachmentsForThisClass = customPomAttachments
     .filter((a) => {
+      if (!Object.prototype.hasOwnProperty.call(customPomClassIdentifierMap, a.className))
+        return false;
+
       const scope = a.attachTo ?? "views";
       const scopeOk = isView
         ? (scope === "views" || scope === "both")
@@ -1155,7 +1171,7 @@ function generateViewObjectModelContent(
       return a.attachWhenUsesComponents.some(c => hasChildComponent(c));
     })
     .map(a => ({
-      className: options.customPomClassIdentifierMap?.[a.className] ?? a.className,
+      className: customPomClassIdentifierMap[a.className]!,
       propertyName: a.propertyName,
     }));
 
@@ -1209,7 +1225,7 @@ function generateViewObjectModelContent(
   content += `\nexport class ${className} extends BasePage {\n`;
 
   const widgetInstances = isView
-    ? getWidgetInstancesForView(componentName, dependencies.dataTestIdSet)
+    ? getWidgetInstancesForView(componentName, dependencies.dataTestIdSet, customPomAvailableClassIdentifiers)
     : [];
 
   // For views, `childrenComponentSet` only includes component tags on which we applied a data-testid.
@@ -1480,6 +1496,7 @@ async function generateAggregatedFiles(
     };
 
     const customPomClassIdentifierMap = addCustomPomImports();
+    const customPomAvailableClassIdentifiers = new Set(Object.values(customPomClassIdentifierMap ?? {}));
 
     // Collect any navigation return types referenced by generated methods so we can emit
     // stub classes when the destination view has no generated test ids (and therefore no
@@ -1681,6 +1698,7 @@ async function generateAggregatedFiles(
 
         customPomAttachments: options.customPomAttachments ?? [],
         customPomClassIdentifierMap,
+        customPomAvailableClassIdentifiers,
         testIdAttribute: options.testIdAttribute,
         vueRouterFluentChaining: options.vueRouterFluentChaining,
         routeMetaByComponent: options.routeMetaByComponent,
@@ -1808,7 +1826,11 @@ interface WidgetInstance {
   testId: string;
 }
 
-function getWidgetInstancesForView(componentName: string, dataTestIdSet: Set<IDataTestId>): WidgetInstance[] {
+function getWidgetInstancesForView(
+  componentName: string,
+  dataTestIdSet: Set<IDataTestId>,
+  availableClassIdentifiers: Set<string>,
+): WidgetInstance[] {
   const out: WidgetInstance[] = [];
   const usedPropNames = new Set<string>();
 
@@ -1849,6 +1871,9 @@ function getWidgetInstancesForView(componentName: string, dataTestIdSet: Set<IDa
       continue;
     }
 
+    if (!availableClassIdentifiers.has(className))
+      continue;
+
     // Prefer stripping the view prefix (e.g. PreferencesPage-) for cleaner member names.
     const viewPrefix = `${componentName}-`;
     const descriptorRaw = stem.startsWith(viewPrefix) ? stem.slice(viewPrefix.length) : stem;

package/dist/class-generation/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../class-generation/index.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,oCAAoC,EAAE,MAAM,sBAAsB,CAAC;AAE5E,OAAO,EAAE,sBAAsB,EAAoE,MAAM,UAAU,CAAC;AAQpH,OAAO,EAAE,oCAAoC,EAAE,CAAC;AA8ChD,UAAU,SAAS;IACjB,QAAQ,EAAE,MAAM,CAAC;CAClB;AAyOD,MAAM,WAAW,oBAAoB;IACnC;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;;;;;;;;;OAWG;IACH,gBAAgB,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG;QAAE,MAAM,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAE1D;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;;;;;;OAOG;IACH,sBAAsB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAEhD;;;;;OAKG;IACH,oCAAoC,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC;IAEzD;;;;OAIG;IACH,oBAAoB,CAAC,EAAE,KAAK,CAAC;QAC3B,SAAS,EAAE,MAAM,CAAC;QAClB,YAAY,EAAE,MAAM,CAAC;QACrB,wBAAwB,EAAE,MAAM,EAAE,CAAC;QAEnC;;;WAGG;QACH,QAAQ,CAAC,EAAE,OAAO,GAAG,YAAY,GAAG,MAAM,CAAC;KAC5C,CAAC,CAAC;IAEH,yEAAyE;IACzE,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,uDAAuD;IACvD,aAAa,CAAC,EAAE,KAAK,CAAC,IAAI,GAAG,QAAQ,CAAC,CAAC;IAEvC,6BAA6B;IAC7B,MAAM,CAAC,EAAE;QACP,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;IAEF,6EAA6E;IAC7E,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAElC,2FAA2F;IAC3F,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,mDAAmD;IACnD,UAAU,CAAC,EAAE,YAAY,GAAG,MAAM,CAAC;IAEnC,oBAAoB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;CAClD;AAuCD,wBAAsB,aAAa,CACjC,qBAAqB,EAAE,GAAG,CAAC,MAAM,EAAE,sBAAsB,CAAC,EAC1D,eAAe,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,EACpC,iBAAiB,EAAE,MAAM,EACzB,OAAO,GAAE,oBAAyB,iBA2EnC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../class-generation/index.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,oCAAoC,EAAE,MAAM,sBAAsB,CAAC;AAE5E,OAAO,EAAE,sBAAsB,EAAoE,MAAM,UAAU,CAAC;AAQpH,OAAO,EAAE,oCAAoC,EAAE,CAAC;AA8ChD,UAAU,SAAS;IACjB,QAAQ,EAAE,MAAM,CAAC;CAClB;AAyOD,MAAM,WAAW,oBAAoB;IACnC;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;;;;;;;;;OAWG;IACH,gBAAgB,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG;QAAE,MAAM,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAE1D;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;;;;;;OAOG;IACH,sBAAsB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAEhD;;;;;OAKG;IACH,oCAAoC,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC;IAEzD;;;;OAIG;IACH,oBAAoB,CAAC,EAAE,KAAK,CAAC;QAC3B,SAAS,EAAE,MAAM,CAAC;QAClB,YAAY,EAAE,MAAM,CAAC;QACrB,wBAAwB,EAAE,MAAM,EAAE,CAAC;QAEnC;;;WAGG;QACH,QAAQ,CAAC,EAAE,OAAO,GAAG,YAAY,GAAG,MAAM,CAAC;KAC5C,CAAC,CAAC;IAEH,yEAAyE;IACzE,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,uDAAuD;IACvD,aAAa,CAAC,EAAE,KAAK,CAAC,IAAI,GAAG,QAAQ,CAAC,CAAC;IAEvC,6BAA6B;IAC7B,MAAM,CAAC,EAAE;QACP,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;IAEF,6EAA6E;IAC7E,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAElC,2FAA2F;IAC3F,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,mDAAmD;IACnD,UAAU,CAAC,EAAE,YAAY,GAAG,MAAM,CAAC;IAEnC,oBAAoB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;CAClD;AAwCD,wBAAsB,aAAa,CACjC,qBAAqB,EAAE,GAAG,CAAC,MAAM,EAAE,sBAAsB,CAAC,EAC1D,eAAe,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,EACpC,iBAAiB,EAAE,MAAM,EACzB,OAAO,GAAE,oBAAyB,iBA2EnC"}

package/dist/index.cjs

@@ -606,6 +606,124 @@ function getTemplateSlotScope(node) {
   }
   return null;
 }
+function isSimpleScopeIdentifier(value) {
+  return /^[A-Za-z_$][A-Za-z0-9_$]*$/.test(value);
+}
+function buildSlotScopeFallbackKeyExpression(identifier) {
+  return `${identifier}.key ?? ${identifier}.data?.id ?? ${identifier}.id ?? ${identifier}.value ?? ${identifier}`;
+}
+function tryGetBindingIdentifierName(node) {
+  if (!node) {
+    return null;
+  }
+  if (types.isIdentifier(node)) {
+    return node.name;
+  }
+  if (types.isAssignmentPattern(node)) {
+    return tryGetBindingIdentifierName(node.left);
+  }
+  if (types.isRestElement(node)) {
+    return tryGetBindingIdentifierName(node.argument);
+  }
+  return null;
+}
+function getSlotScopeObjectPropertyKeyName(node) {
+  if (types.isIdentifier(node)) {
+    return node.name;
+  }
+  if (types.isStringLiteral(node)) {
+    return node.value;
+  }
+  return null;
+}
+function tryGetSlotScopeKeyCandidate(node) {
+  if (!node) {
+    return null;
+  }
+  if (types.isIdentifier(node)) {
+    return {
+      priority: 2,
+      expression: buildSlotScopeFallbackKeyExpression(node.name)
+    };
+  }
+  if (types.isAssignmentPattern(node)) {
+    return tryGetSlotScopeKeyCandidate(node.left);
+  }
+  if (types.isRestElement(node)) {
+    return tryGetSlotScopeKeyCandidate(node.argument);
+  }
+  if (!types.isObjectPattern(node)) {
+    return null;
+  }
+  let best = null;
+  for (const property of node.properties) {
+    let candidate = null;
+    if (types.isRestElement(property)) {
+      candidate = tryGetSlotScopeKeyCandidate(property.argument);
+      if (candidate) {
+        candidate = { ...candidate, priority: Math.max(candidate.priority, 2) };
+      }
+    } else if (types.isObjectProperty(property)) {
+      const keyName = getSlotScopeObjectPropertyKeyName(property.key);
+      const bindingName = tryGetBindingIdentifierName(property.value) ?? tryGetBindingIdentifierName(property.key);
+      if (bindingName) {
+        if (keyName === "key" || bindingName === "key") {
+          candidate = {
+            priority: 0,
+            expression: bindingName
+          };
+        } else {
+          candidate = {
+            priority: keyName === "data" ? 1 : 2,
+            expression: buildSlotScopeFallbackKeyExpression(bindingName)
+          };
+        }
+      }
+    }
+    if (candidate && (!best || candidate.priority < best.priority)) {
+      best = candidate;
+    }
+  }
+  return best;
+}
+function tryGetTemplateSlotScopeKeyExpression(scope) {
+  const trimmed = scope.trim();
+  if (!trimmed) {
+    return null;
+  }
+  if (isSimpleScopeIdentifier(trimmed)) {
+    return buildSlotScopeFallbackKeyExpression(trimmed);
+  }
+  try {
+    const parsed = parser.parse(`(${trimmed}) => {}`, {
+      sourceType: "module",
+      plugins: ["typescript"]
+    });
+    const statement = parsed.program.body[0];
+    if (statement && types.isExpressionStatement(statement) && types.isArrowFunctionExpression(statement.expression)) {
+      return tryGetSlotScopeKeyCandidate(statement.expression.params[0])?.expression ?? null;
+    }
+  } catch {
+  }
+  if (trimmed.startsWith("{") && trimmed.endsWith("}")) {
+    const inner = trimmed.slice(1, -1).trim();
+    let cutIdx = -1;
+    const commaIdx = inner.indexOf(",");
+    const colonIdx = inner.indexOf(":");
+    if (commaIdx !== -1 && colonIdx !== -1) {
+      cutIdx = Math.min(commaIdx, colonIdx);
+    } else if (commaIdx !== -1) {
+      cutIdx = commaIdx;
+    } else if (colonIdx !== -1) {
+      cutIdx = colonIdx;
+    }
+    const first = (cutIdx === -1 ? inner : inner.slice(0, cutIdx)).trim();
+    if (first && isSimpleScopeIdentifier(first)) {
+      return buildSlotScopeFallbackKeyExpression(first);
+    }
+  }
+  return trimmed;
+}
 function nodeHasToDirective(node) {
   const toDirective = findDirectiveByName(node, "bind", "to");
   if (toDirective?.exp) {
@@ -681,25 +799,7 @@ function getContainedInSlotDataKeyValue(node, hierarchyMap2) {
     if (parent.type === compilerCore.NodeTypes.ELEMENT && parent.tag === "template") {
       const scope = getTemplateSlotScope(parent);
       if (scope) {
-        let key = scope.trim();
-        if (key.startsWith("{") && key.endsWith("}")) {
-          const inner = key.slice(1, -1).trim();
-          let cutIdx = -1;
-          const commaIdx = inner.indexOf(",");
-          const colonIdx = inner.indexOf(":");
-          if (commaIdx !== -1 && colonIdx !== -1) {
-            cutIdx = Math.min(commaIdx, colonIdx);
-          } else if (commaIdx !== -1) {
-            cutIdx = commaIdx;
-          } else if (colonIdx !== -1) {
-            cutIdx = colonIdx;
-          }
-          const first = (cutIdx === -1 ? inner : inner.slice(0, cutIdx)).trim();
-          if (first) {
-            key = first;
-          }
-        }
-        return key;
+        return tryGetTemplateSlotScopeKeyExpression(scope);
       }
     }
     parent = getParent(hierarchyMap2, parent);
@@ -1350,11 +1450,11 @@ function getStableClickHandlerNameFromExpression(exp) {
     return extractNameFromCallee(callee);
   }
   if (types.isAssignmentExpression(exp)) {
-    const left = exp.left;
-    if (types.isIdentifier(left))
-      return left.name;
-    if (types.isMemberExpression(left) || types.isOptionalMemberExpression(left))
-      return extractMemberPropertyName(left);
+    const left = getAssignmentTargetNameFromBabel(exp.left);
+    if (left) {
+      const right = getStableAssignmentValueSuffixFromBabel(exp.right);
+      return `Set${toPascalCase(left)}${right}`;
+    }
     return "";
   }
   if (types.isOptionalMemberExpression(exp)) {
@@ -1429,6 +1529,71 @@ function extractMemberPropertyName(member) {
   }
   return "";
 }
+function getLastIdentifierFromMemberChainBabel(node) {
+  if (!node) {
+    return "";
+  }
+  if (types.isIdentifier(node)) {
+    return node.name;
+  }
+  if (types.isMemberExpression(node) || types.isOptionalMemberExpression(node)) {
+    if (!node.computed) {
+      if (types.isIdentifier(node.property)) {
+        return node.property.name;
+      }
+    } else if (types.isStringLiteral(node.property)) {
+      return node.property.value;
+    }
+  }
+  return "";
+}
+function getAssignmentTargetNameFromBabel(node) {
+  if (!node) {
+    return "";
+  }
+  if (types.isIdentifier(node)) {
+    return node.name;
+  }
+  if (types.isMemberExpression(node) || types.isOptionalMemberExpression(node)) {
+    if (!node.computed && types.isIdentifier(node.property) && node.property.name === "value") {
+      return getLastIdentifierFromMemberChainBabel(node.object);
+    }
+    return getLastIdentifierFromMemberChainBabel(node);
+  }
+  return "";
+}
+function getStableAssignmentValueSuffixFromBabel(node) {
+  if (!node) {
+    return "";
+  }
+  if (types.isBooleanLiteral(node)) {
+    return node.value ? "True" : "False";
+  }
+  if (types.isNumericLiteral(node)) {
+    return `Value${String(node.value)}`;
+  }
+  if (types.isNullLiteral(node)) {
+    return "Null";
+  }
+  if (types.isStringLiteral(node)) {
+    const cleaned = (node.value ?? "").trim();
+    return cleaned ? toPascalCase(cleaned.slice(0, 24)) : "";
+  }
+  if (types.isTemplateLiteral(node) && node.expressions.length === 0) {
+    const value = node.quasis.map((q) => q.value?.cooked ?? "").join("").trim();
+    return value ? toPascalCase(value.slice(0, 24)) : "";
+  }
+  if (types.isMemberExpression(node) || types.isOptionalMemberExpression(node)) {
+    const name = getLastIdentifierFromMemberChainBabel(node);
+    return name ? toPascalCase(name.slice(0, 24)) : "";
+  }
+  if (types.isIdentifier(node)) {
+    const firstChar = node.name.charAt(0);
+    const isUpperAlpha = firstChar !== "" && firstChar === firstChar.toUpperCase() && firstChar !== firstChar.toLowerCase();
+    return isUpperAlpha ? toPascalCase(node.name.slice(0, 24)) : "";
+  }
+  return "";
+}
 function isCompilerGeneratedReferenceRoot(name) {
   return name.startsWith("_") || name.startsWith("$");
 }
@@ -1694,6 +1859,12 @@ function applyResolvedDataTestId(args) {
   const existingIdBehavior = args.existingIdBehavior ?? "preserve";
   const nameCollisionBehavior = args.nameCollisionBehavior ?? "suffix";
   const warn = args.warn;
+  const getBestKeyAccessCandidates = (expr) => {
+    if (!expr) {
+      return [];
+    }
+    return expr.split("??").map((part) => part.trim()).filter(Boolean);
+  };
   let dataTestId = args.preferredGeneratedValue;
   let fromExisting = false;
   const existing = tryGetExistingElementDataTestId(args.element, testIdAttribute);
@@ -1716,6 +1887,7 @@ Bulk cleanup: run ESLint with the @immense/vue-pom-generator/remove-existing-tes
     if (existingIdBehavior === "preserve") {
       if (existing.isDynamic) {
         if (existing.template) {
+          const existingTemplate = existing.template;
           if ((existing.templateExpressionCount ?? 0) !== 1) {
             throw new Error(
               `[vue-pom-generator] Existing ${attrLabel} is a template literal with multiple interpolations and cannot be preserved safely.
@@ -1726,8 +1898,8 @@ Existing ${attrLabel}: ${JSON.stringify(existing.value)}
 Fix: reduce the template to a single key-based interpolation, or remove the explicit ${attrLabel} so it can be auto-generated.`
             );
           }
-          const hasExact = args.bestKeyPlaceholder && existing.template.includes(args.bestKeyPlaceholder);
-          const hasVarAccess = args.bestKeyVariable && existing.template.includes(args.bestKeyVariable);
+          const hasExact = args.bestKeyPlaceholder && existingTemplate.includes(args.bestKeyPlaceholder);
+          const hasVarAccess = getBestKeyAccessCandidates(args.bestKeyVariable).some((candidate) => existingTemplate.includes(candidate));
           if (!hasExact && !hasVarAccess && args.bestKeyPlaceholder) {
             throw new Error(
               `[vue-pom-generator] Existing ${attrLabel} appears to be missing the key placeholder needed to keep it unique.
@@ -3240,6 +3412,10 @@ function escapeGitAttributesPattern(value) {
   }
   return output;
 }
+function pathUsesGeneratedHeuristic(filePath) {
+  const normalized = path.normalize(filePath);
+  return normalized.split(path.sep).includes("__generated__");
+}
 function buildManagedGitAttributesBlock(entries) {
   return [
     GENERATED_GITATTRIBUTES_BLOCK_START,
@@ -3287,6 +3463,9 @@ function buildGeneratedGitAttributesFiles(generatedFilePaths) {
     if (path.basename(resolvedFilePath) === ".gitattributes") {
       continue;
     }
+    if (pathUsesGeneratedHeuristic(resolvedFilePath)) {
+      continue;
+    }
     const dir = path.dirname(resolvedFilePath);
     const entry = `${escapeGitAttributesPattern(path.basename(resolvedFilePath))} linguist-generated`;
     const entries = entriesByDir.get(dir) ?? /* @__PURE__ */ new Set();
@@ -3711,14 +3890,18 @@ function generateViewObjectModelContent(componentName, dependencies, componentHi
     }
     return false;
   };
+  const customPomClassIdentifierMap = options.customPomClassIdentifierMap ?? {};
+  const customPomAvailableClassIdentifiers = options.customPomAvailableClassIdentifiers ?? /* @__PURE__ */ new Set();
   const attachmentsForThisClass = customPomAttachments.filter((a) => {
+    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";
     if (!scopeOk)
       return false;
     return a.attachWhenUsesComponents.some((c) => hasChildComponent(c));
   }).map((a) => ({
-    className: options.customPomClassIdentifierMap?.[a.className] ?? a.className,
+    className: customPomClassIdentifierMap[a.className],
     propertyName: a.propertyName
   }));
   let content = "";
@@ -3758,7 +3941,7 @@ function generateViewObjectModelContent(componentName, dependencies, componentHi
   content += `
 export class ${className} extends BasePage {
 `;
-  const widgetInstances = isView ? getWidgetInstancesForView(componentName, dependencies.dataTestIdSet) : [];
+  const widgetInstances = isView ? getWidgetInstancesForView(componentName, dependencies.dataTestIdSet, customPomAvailableClassIdentifiers) : [];
   const componentRefsForInstances = isView ? usedComponentSet?.size ? usedComponentSet : childrenComponentSet : childrenComponentSet;
   if (isView && (componentRefsForInstances.size > 0 || attachmentsForThisClass.length > 0 || widgetInstances.length > 0)) {
     content += getComponentInstances(componentRefsForInstances, componentHierarchyMap, attachmentsForThisClass, widgetInstances);
@@ -3916,6 +4099,7 @@ Fix by setting generation.playwright.customPoms.importAliases["${exportName}"] t
       return customPomClassIdentifierMap2;
     };
     const customPomClassIdentifierMap = addCustomPomImports();
+    const customPomAvailableClassIdentifiers = new Set(Object.values(customPomClassIdentifierMap ?? {}));
     const referencedTargets = /* @__PURE__ */ new Set();
     for (const [, deps] of items) {
       for (const dt of deps.dataTestIdSet) {
@@ -4068,6 +4252,7 @@ Fix by setting generation.playwright.customPoms.importAliases["${exportName}"] t
         aggregated: true,
         customPomAttachments: options.customPomAttachments ?? [],
         customPomClassIdentifierMap,
+        customPomAvailableClassIdentifiers,
         testIdAttribute: options.testIdAttribute,
         vueRouterFluentChaining: options.vueRouterFluentChaining,
         routeMetaByComponent: options.routeMetaByComponent
@@ -4162,7 +4347,7 @@ function toPascalCaseLocal(str) {
     return preserveInternalCaps ? upperFirst(word) : upperFirst(word.toLowerCase());
   }).join("");
 }
-function getWidgetInstancesForView(componentName, dataTestIdSet) {
+function getWidgetInstancesForView(componentName, dataTestIdSet, availableClassIdentifiers) {
   const out = [];
   const usedPropNames = /* @__PURE__ */ new Set();
   const ensureUnique = (base) => {
@@ -4193,6 +4378,8 @@ function getWidgetInstancesForView(componentName, dataTestIdSet) {
     } else {
       continue;
     }
+    if (!availableClassIdentifiers.has(className))
+      continue;
     const viewPrefix = `${componentName}-`;
     const descriptorRaw = stem.startsWith(viewPrefix) ? stem.slice(viewPrefix.length) : stem;
     const descriptorPascal = toPascalCaseLocal(descriptorRaw);
@@ -6197,7 +6384,7 @@ function createVuePomGeneratorPlugins(options = {}) {
   const excludedComponents = injection.excludeComponents ?? [];
   const testIdAttribute = (injection.attribute ?? "data-testid").trim() || "data-testid";
   const existingIdBehavior = injection.existingIdBehavior ?? "preserve";
-  const outDir = (generationOptions?.outDir ?? "tests/playwright/generated").trim();
+  const outDir = (generationOptions?.outDir ?? "tests/playwright/__generated__").trim();
   const emitLanguages = generationOptions?.emit && generationOptions.emit.length ? generationOptions.emit : ["ts"];
   const nameCollisionBehavior = generationOptions?.nameCollisionBehavior ?? "suffix";
   const routerEntry = generationOptions?.router?.entry;