@immense/vue-pom-generator 1.0.43 → 1.0.44

package/RELEASE_NOTES.md

@@ -1,23 +1,22 @@
 ● ## Highlights
 
-  - Fixed dev-mode POM generation to achieve parity with build mode behavior
-  - Added comprehensive regression test suite (284 lines) covering build–serve parity scenarios
-  - Enhanced plugin system to ensure consistent POM generation across development and production
-  environments
+  - Fixed handling of wrapped editable targets in class generation
+  - Enhanced Pointer module to correctly resolve targets through wrapper elements
+  - Added comprehensive test suite for pointer functionality (152 new test lines)
+  - Improved test coverage for class generation edge cases
 
   ## Changes
 
   **Bug Fixes**
-  - Resolved discrepancies between dev-mode and build-mode POM generation (#5)
+  - Handle wrapped editable targets correctly in Pointer resolution logic
+  - Updated class generation index to support wrapped target elements
 
-  **Testing & Quality**
-  - Added build–serve parity regression tests to prevent future inconsistencies (#7)
-  - New test file: `tests/build-serve-parity.test.ts` with comprehensive coverage
+  **Testing**
+  - Added new `tests/pointer.test.ts` with comprehensive pointer test coverage
+  - Expanded `tests/class-generation-coverage.test.ts` with 43 additional test lines
 
-  **Plugin System**
-  - Extended build plugin functionality with improved POM generation logic
-  - Enhanced dev plugin to match build-mode behavior
-  - Updated support plugins for better parity handling
+  **Type Updates**
+  - Minor update to `plugin/types.ts`
 
   ## Breaking Changes
 
@@ -25,13 +24,10 @@
 
   ## Pull Requests Included
 
-  - [#7](https://github.com/immense/vue-pom-generator/pull/7) test: add build–serve parity
-  regression tests (by @mayfieldiv)
-  - [#5](https://github.com/immense/vue-pom-generator/pull/5) fix: dev-mode POM generation parity
-  with build mode (by @mayfieldiv)
+  None — this release contains direct commits only.
 
   ## Testing
 
-  Added 284 lines of regression tests ensuring build–serve parity. Tests validate consistent POM
-  generation behavior across development and production modes.
+  Significant test coverage added: new dedicated pointer test suite (152 lines) and expanded class
+   generation coverage tests (43 lines).
 

package/class-generation/Pointer.ts

@@ -5,6 +5,8 @@ import type { PwLocator, PwPage } from "./playwright-types";
 // ---------------------------------------------------------------------------
 
 const __PW_CURSOR_ID__ = "__pw_cursor__";
+const __PW_EDITABLE_DESCENDANT_SELECTOR__
+	= "input, textarea, select, [contenteditable=''], [contenteditable='true'], [contenteditable]:not([contenteditable='false'])";
 
 // A minimal 16×24 arrow cursor encoded as a base64 PNG.
 const __PW_CURSOR_PNG__ =
@@ -165,6 +167,44 @@ export class Pointer {
 		return trimmed || undefined;
 	}
 
+	private async isEditableElement(locator: PwLocator): Promise<boolean> {
+		try {
+			return await locator.first().evaluate((element) => {
+				if (!(element instanceof HTMLElement)) {
+					return false;
+				}
+
+				const tagName = element.tagName.toLowerCase();
+				return tagName === "input"
+					|| tagName === "textarea"
+					|| tagName === "select"
+					|| element.isContentEditable;
+			});
+		}
+		catch {
+			return false;
+		}
+	}
+
+	private async resolveEditableLocator(locator: PwLocator): Promise<PwLocator> {
+		const first = locator.first();
+		if (await this.isEditableElement(first)) {
+			return first;
+		}
+
+		const descendant = first.locator(__PW_EDITABLE_DESCENDANT_SELECTOR__).first();
+		try {
+			if (await descendant.count() > 0) {
+				return descendant;
+			}
+		}
+		catch {
+			// Fall back to the original target if descendant lookup fails.
+		}
+
+		return first;
+	}
+
 	public async animateCursorToElement(
 		target: ElementTarget,
 		executeClick: boolean = true,
@@ -305,15 +345,16 @@ export class Pointer {
 		await this.animateCursorToElement(target, executeClick, delayMs, annotationText, options);
 
 		const locator = this.toLocator(target);
+		const editableLocator = await this.resolveEditableLocator(locator);
 		const typeDelayMs = animationOptions.keyboard?.typeDelayMilliseconds ?? 100;
 
 		if (animationOptions.enabled !== false && typeDelayMs > 0) {
 			// Clear existing content, then type character-by-character so keystrokes are visible.
-			await locator.first().clear();
+			await editableLocator.clear();
 			await this.page.keyboard.type(text, { delay: typeDelayMs });
 		}
 		else {
-			await locator.first().fill(text);
+			await editableLocator.fill(text);
 		}
 	}
 }

package/class-generation/index.ts

@@ -758,6 +758,26 @@ function generateAggregatedCSharpFiles(
     "    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();",
@@ -889,7 +909,8 @@ function generateAggregatedCSharpFiles(
 
       const emitActionCall = (locatorAccess: string) => {
         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);`);
@@ -923,7 +944,8 @@ function generateAggregatedCSharpFiles(
           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);");
@@ -1229,9 +1251,10 @@ function generateViewObjectModelContent(
         return false;
 
       const scope = a.attachTo ?? "views";
+      const scopeMatchesBoth = scope === "both" || scope === "pagesAndComponents";
       const scopeOk = isView
-        ? (scope === "views" || scope === "both")
-        : (scope === "components" || scope === "both");
+        ? (scope === "views" || scopeMatchesBoth)
+        : (scope === "components" || scopeMatchesBoth);
       if (!scopeOk)
         return false;
       return a.attachWhenUsesComponents.some(c => hasChildComponent(c));

package/dist/class-generation/Pointer.d.ts

@@ -56,6 +56,8 @@ export declare class Pointer {
     constructor(page: PwPage, testIdAttribute: string);
     private toLocator;
     private getTestId;
+    private isEditableElement;
+    private resolveEditableLocator;
     animateCursorToElement(target: ElementTarget, executeClick?: boolean, delayMs?: number, _annotationText?: string, options?: {
         afterClick?: AfterPointerClick;
     }): Promise<void>;

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

@@ -1 +1 @@
-{"version":3,"file":"Pointer.d.ts","sourceRoot":"","sources":["../../class-generation/Pointer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AA8D5D,MAAM,WAAW,0BAA0B;IAC1C;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,sDAAsD;IACtD,OAAO,CAAC,EAAE;QACT;;;;WAIG;QACH,oBAAoB,CAAC,EAAE,MAAM,CAAC;QAE9B;;;WAGG;QACH,eAAe,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,SAAS,GAAG,UAAU,GAAG,aAAa,CAAC;QAE7E;;;WAGG;QACH,sBAAsB,CAAC,EAAE,MAAM,CAAC;KAChC,CAAC;IAEF,uCAAuC;IACvC,QAAQ,CAAC,EAAE;QACV;;;WAGG;QACH,qBAAqB,CAAC,EAAE,MAAM,CAAC;KAC/B,CAAC;CACF;AASD,wBAAgB,6BAA6B,CAAC,OAAO,EAAE,0BAA0B,GAAG,IAAI,CAavF;AAED,MAAM,WAAW,qBAAqB;IACrC,8DAA8D;IAC9D,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;OAGG;IACH,YAAY,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,MAAM,iBAAiB,GAAG,CAAC,IAAI,EAAE,qBAAqB,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;AAEtF,KAAK,aAAa,GAAG,MAAM,GAAG,SAAS,CAAC;AAMxC,qBAAa,OAAO;IACnB,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAS;IAC9B,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAS;gBAEtB,IAAI,EAAE,MAAM,EAAE,eAAe,EAAE,MAAM;IAKxD,OAAO,CAAC,SAAS;YAIH,SAAS;IAMV,sBAAsB,CAClC,MAAM,EAAE,aAAa,EACrB,YAAY,GAAE,OAAc,EAC5B,OAAO,GAAE,MAAY,EACrB,eAAe,GAAE,MAAW,EAC5B,OAAO,CAAC,EAAE;QACT,UAAU,CAAC,EAAE,iBAAiB,CAAC;KAC/B,GACC,OAAO,CAAC,IAAI,CAAC;IAsHH,qCAAqC,CACjD,MAAM,EAAE,aAAa,EACrB,IAAI,EAAE,MAAM,EACZ,YAAY,GAAE,OAAc,EAC5B,OAAO,GAAE,MAAY,EACrB,cAAc,GAAE,MAAW,EAC3B,OAAO,CAAC,EAAE;QACT,UAAU,CAAC,EAAE,iBAAiB,CAAC;KAC/B,GACC,OAAO,CAAC,IAAI,CAAC;CAgBhB"}
+{"version":3,"file":"Pointer.d.ts","sourceRoot":"","sources":["../../class-generation/Pointer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAgE5D,MAAM,WAAW,0BAA0B;IAC1C;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,sDAAsD;IACtD,OAAO,CAAC,EAAE;QACT;;;;WAIG;QACH,oBAAoB,CAAC,EAAE,MAAM,CAAC;QAE9B;;;WAGG;QACH,eAAe,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,SAAS,GAAG,UAAU,GAAG,aAAa,CAAC;QAE7E;;;WAGG;QACH,sBAAsB,CAAC,EAAE,MAAM,CAAC;KAChC,CAAC;IAEF,uCAAuC;IACvC,QAAQ,CAAC,EAAE;QACV;;;WAGG;QACH,qBAAqB,CAAC,EAAE,MAAM,CAAC;KAC/B,CAAC;CACF;AASD,wBAAgB,6BAA6B,CAAC,OAAO,EAAE,0BAA0B,GAAG,IAAI,CAavF;AAED,MAAM,WAAW,qBAAqB;IACrC,8DAA8D;IAC9D,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;OAGG;IACH,YAAY,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,MAAM,iBAAiB,GAAG,CAAC,IAAI,EAAE,qBAAqB,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;AAEtF,KAAK,aAAa,GAAG,MAAM,GAAG,SAAS,CAAC;AAMxC,qBAAa,OAAO;IACnB,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAS;IAC9B,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAS;gBAEtB,IAAI,EAAE,MAAM,EAAE,eAAe,EAAE,MAAM;IAKxD,OAAO,CAAC,SAAS;YAIH,SAAS;YAMT,iBAAiB;YAmBjB,sBAAsB;IAmBvB,sBAAsB,CAClC,MAAM,EAAE,aAAa,EACrB,YAAY,GAAE,OAAc,EAC5B,OAAO,GAAE,MAAY,EACrB,eAAe,GAAE,MAAW,EAC5B,OAAO,CAAC,EAAE;QACT,UAAU,CAAC,EAAE,iBAAiB,CAAC;KAC/B,GACC,OAAO,CAAC,IAAI,CAAC;IAsHH,qCAAqC,CACjD,MAAM,EAAE,aAAa,EACrB,IAAI,EAAE,MAAM,EACZ,YAAY,GAAE,OAAc,EAC5B,OAAO,GAAE,MAAY,EACrB,cAAc,GAAE,MAAW,EAC3B,OAAO,CAAC,EAAE;QACT,UAAU,CAAC,EAAE,iBAAiB,CAAC;KAC/B,GACC,OAAO,CAAC,IAAI,CAAC;CAiBhB"}

package/dist/index.cjs

@@ -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));