@immense/vue-pom-generator 1.0.47 → 1.0.48

package/dist/index.mjs

@@ -3,11 +3,12 @@ import process from "node:process";
 import { pathToFileURL, fileURLToPath } from "node:url";
 import fs from "node:fs";
 import * as compilerDom from "@vue/compiler-dom";
-import { parse as parse$2 } from "@vue/compiler-dom";
+import { parse as parse$2, NodeTypes as NodeTypes$1 } from "@vue/compiler-dom";
 import { parse as parse$1, compileScript } from "@vue/compiler-sfc";
 import { parseExpression, parse } from "@babel/parser";
+import { NodeTypes, stringifyExpression, ConstantTypes, createSimpleExpression, ElementTypes } from "@vue/compiler-core";
+import { Project, QuoteKind, NewLineKind, IndentationText, StructureKind, CodeBlockWriter, VariableDeclarationKind } from "ts-morph";
 import { JSDOM } from "jsdom";
-import { NodeTypes, stringifyExpression, ConstantTypes, createSimpleExpression } from "@vue/compiler-core";
 import { isArrayExpression, isStringLiteral, isTemplateLiteral, isAssignmentExpression, isIdentifier, isMemberExpression, isCallExpression, isExpressionStatement, isArrowFunctionExpression, isOptionalMemberExpression, isObjectExpression, isFile, isBlockStatement, isOptionalCallExpression, isLogicalExpression, isConditionalExpression, isSequenceExpression, isAssignmentPattern, isRestElement, isObjectPattern, isObjectProperty, isProgram, VISITOR_KEYS, isBooleanLiteral, isNumericLiteral, isNullLiteral } from "@babel/types";
 import { performance } from "node:perf_hooks";
 import virtualImport from "vite-plugin-virtual";
@@ -62,9 +63,97 @@ function createLogger(options) {
     }
   };
 }
-const INDENT = "    ";
-const INDENT2 = `${INDENT}${INDENT}`;
-const INDENT3 = `${INDENT2}${INDENT}`;
+function createTypeScriptProject() {
+  return new Project({
+    useInMemoryFileSystem: true,
+    manipulationSettings: {
+      indentationText: IndentationText.FourSpaces,
+      newLineKind: NewLineKind.LineFeed,
+      quoteKind: QuoteKind.Double,
+      useTrailingCommas: false
+    }
+  });
+}
+function ensureTrailingNewline(text) {
+  return text.endsWith("\n") ? text : `${text}
+`;
+}
+function createTypeScriptWriter() {
+  return new CodeBlockWriter({
+    newLine: "\n",
+    useTabs: false,
+    indentNumberOfSpaces: 4
+  });
+}
+function renderTypeScript(write) {
+  const writer = createTypeScriptWriter();
+  write(writer);
+  return ensureTrailingNewline(writer.toString());
+}
+function buildCommentBlock(lines) {
+  return renderTypeScript((writer) => {
+    writer.writeLine("/**");
+    for (const line of lines) {
+      writer.writeLine(` * ${line}`);
+    }
+    writer.writeLine(" */");
+  });
+}
+function buildFilePrefix(options = {}) {
+  let prefix = "";
+  if (options.referenceLib) {
+    prefix += `/// <reference lib="${options.referenceLib}" />
+`;
+  }
+  if (options.eslintDisableSortImports) {
+    prefix += "/* eslint-disable perfectionist/sort-imports */\n";
+  }
+  if (options.commentLines?.length) {
+    prefix += buildCommentBlock(options.commentLines);
+  }
+  return prefix;
+}
+function renderSourceFile(filePath, build, options = {}) {
+  const project = createTypeScriptProject();
+  const sourceFile = project.createSourceFile(filePath, "", { overwrite: true });
+  build(sourceFile);
+  const content = ensureTrailingNewline(sourceFile.getFullText());
+  return options.prefixText ? ensureTrailingNewline(`${options.prefixText}${content}`) : content;
+}
+function addNamedImport(sourceFile, options) {
+  return sourceFile.addImportDeclaration({
+    moduleSpecifier: options.moduleSpecifier,
+    isTypeOnly: options.isTypeOnly,
+    namedImports: options.namedImports
+  });
+}
+function addExportAll(sourceFile, moduleSpecifier) {
+  return sourceFile.addExportDeclaration({ moduleSpecifier });
+}
+function createClassMethod(method) {
+  return {
+    kind: StructureKind.Method,
+    ...method
+  };
+}
+function createClassProperty(property) {
+  return {
+    kind: StructureKind.Property,
+    ...property
+  };
+}
+function createClassGetter(getter) {
+  return {
+    kind: StructureKind.GetAccessor,
+    ...getter
+  };
+}
+function createClassConstructor(constructorDeclaration) {
+  return {
+    kind: StructureKind.Constructor,
+    ...constructorDeclaration
+  };
+}
 function upperFirst$1(value) {
   if (!value) {
     return value;
@@ -74,12 +163,34 @@ function upperFirst$1(value) {
 function hasParam(params, name) {
   return Object.prototype.hasOwnProperty.call(params, name);
 }
-function formatParams(params) {
-  const entries = Object.entries(params);
-  if (!entries.length) {
-    return "";
+function splitTypeAndInitializer(typeExpression) {
+  const trimmed = typeExpression.trim();
+  const initializerIndex = trimmed.lastIndexOf("=");
+  if (initializerIndex < 0) {
+    return { type: trimmed };
   }
-  return entries.map(([n, t]) => `${n}: ${t}`).join(", ");
+  return {
+    type: trimmed.slice(0, initializerIndex).trim(),
+    initializer: trimmed.slice(initializerIndex + 1).trim()
+  };
+}
+function createParameter(name, typeExpression) {
+  const { type, initializer } = splitTypeAndInitializer(typeExpression);
+  return {
+    name,
+    type: type || void 0,
+    initializer
+  };
+}
+function createParameters(params) {
+  return Object.entries(params).map(([name, typeExpression]) => createParameter(name, typeExpression));
+}
+function createInlineParameter(name, options = {}) {
+  return {
+    name,
+    type: options.type,
+    initializer: options.initializer
+  };
 }
 function removeByKeySegment(value) {
   const idx = value.lastIndexOf("ByKey");
@@ -107,113 +218,135 @@ function uniqueAlternates(primary, alternates) {
 function testIdExpression(formattedDataTestId) {
   return formattedDataTestId.includes("${") ? `\`${formattedDataTestId}\`` : JSON.stringify(formattedDataTestId);
 }
+function createAsyncMethod(name, parameters, statements) {
+  return createClassMethod({
+    name,
+    isAsync: true,
+    parameters,
+    statements
+  });
+}
 function generateClickMethod(methodName, formattedDataTestId, alternateFormattedDataTestIds, params) {
-  let content;
   const name = `click${methodName}`;
   const noWaitName = `${name}NoWait`;
-  const paramBlock = formatParams(params);
-  const paramBlockWithWait = paramBlock ? `${paramBlock}, wait: boolean = true` : "wait: boolean = true";
+  const baseParameters = createParameters(params);
   const argsForForward = Object.keys(params).join(", ");
   const alternates = uniqueAlternates(formattedDataTestId, alternateFormattedDataTestIds);
   if (alternates.length > 0) {
     const candidatesExpr = [formattedDataTestId, ...alternates].map(testIdExpression).join(", ");
-    const waitSignature = hasParam(params, "key") ? paramBlockWithWait : "wait: boolean = true";
-    const waitArg = "wait";
-    content = `${INDENT}async ${name}(${waitSignature}) {
-${INDENT2}const candidates = [${candidatesExpr}] as const;
-${INDENT2}let lastError: unknown;
-${INDENT2}for (const testId of candidates) {
-${INDENT3}const locator = this.locatorByTestId(testId);
-${INDENT3}try {
-${INDENT3}${INDENT}if (await locator.count()) {
-${INDENT3}${INDENT2}await this.clickLocator(locator, "", ${waitArg});
-${INDENT3}${INDENT2}return;
-${INDENT3}${INDENT}}
-${INDENT3}} catch (e) {
-${INDENT3}${INDENT}lastError = e;
-${INDENT3}}
-${INDENT2}}
-${INDENT2}throw (lastError instanceof Error) ? lastError : new Error("[pom] Failed to click any candidate locator for ${name}.");
-${INDENT}}
-`;
-    const noWaitSig = hasParam(params, "key") ? paramBlock : "";
+    const clickMethod = createAsyncMethod(
+      name,
+      hasParam(params, "key") ? [...baseParameters, createInlineParameter("wait", { type: "boolean", initializer: "true" })] : [createInlineParameter("wait", { type: "boolean", initializer: "true" })],
+      (writer) => {
+        writer.writeLine(`const candidates = [${candidatesExpr}] as const;`);
+        writer.writeLine("let lastError: unknown;");
+        writer.write("for (const testId of candidates) ").block(() => {
+          writer.writeLine("const locator = this.locatorByTestId(testId);");
+          writer.write("try ").block(() => {
+            writer.write("if (await locator.count()) ").block(() => {
+              writer.writeLine('await this.clickLocator(locator, "", wait);');
+              writer.writeLine("return;");
+            });
+          });
+          writer.write("catch (e) ").block(() => {
+            writer.writeLine("lastError = e;");
+          });
+        });
+        writer.writeLine(`throw (lastError instanceof Error) ? lastError : new Error("[pom] Failed to click any candidate locator for ${name}.");`);
+      }
+    );
     const noWaitArgs = argsForForward ? `${argsForForward}, false` : "false";
-    content += `
-${INDENT}async ${noWaitName}(${noWaitSig}) {
-${INDENT2}await this.${name}(${noWaitArgs});
-${INDENT}}
-`;
-    return content;
+    const noWaitMethod = createAsyncMethod(
+      noWaitName,
+      hasParam(params, "key") ? baseParameters : [],
+      (writer) => {
+        writer.writeLine(`await this.${name}(${noWaitArgs});`);
+      }
+    );
+    return [clickMethod, noWaitMethod];
   }
   if (hasParam(params, "key")) {
-    content = `${INDENT}async ${name}(${paramBlockWithWait}) {
-${INDENT2}await this.clickByTestId(\`${formattedDataTestId}\`, "", wait);
-${INDENT}}
-`;
-    content += `
-${INDENT}async ${noWaitName}(${paramBlock}) {
-${INDENT2}await this.${name}(${argsForForward}, false);
-${INDENT}}
-`;
-  } else {
-    content = `${INDENT}async ${name}(wait: boolean = true) {
-${INDENT2}await this.clickByTestId("${formattedDataTestId}", "", wait);
-${INDENT}}
-`;
-    content += `
-${INDENT}async ${noWaitName}() {
-${INDENT2}await this.${name}(false);
-${INDENT}}
-`;
+    return [
+      createAsyncMethod(name, [...baseParameters, createInlineParameter("wait", { type: "boolean", initializer: "true" })], (writer) => {
+        writer.writeLine(`await this.clickByTestId(\`${formattedDataTestId}\`, "", wait);`);
+      }),
+      createAsyncMethod(noWaitName, baseParameters, (writer) => {
+        writer.writeLine(`await this.${name}(${argsForForward}, false);`);
+      })
+    ];
   }
-  return content;
+  return [
+    createAsyncMethod(name, [createInlineParameter("wait", { type: "boolean", initializer: "true" })], (writer) => {
+      writer.writeLine(`await this.clickByTestId("${formattedDataTestId}", "", wait);`);
+    }),
+    createAsyncMethod(noWaitName, [], (writer) => {
+      writer.writeLine(`await this.${name}(false);`);
+    })
+  ];
 }
 function generateRadioMethod(methodName, formattedDataTestId) {
   const name = `select${methodName}`;
   const hasKey = formattedDataTestId.includes("${key}");
-  if (hasKey) {
-    return `${INDENT}async ${name}(key: string, annotationText: string = "") {
-${INDENT2}await this.clickByTestId(\`${formattedDataTestId}\`, annotationText);
-${INDENT}}
-`;
-  }
-  return `${INDENT}async ${name}(annotationText: string = "") {
-${INDENT2}await this.clickByTestId("${formattedDataTestId}", annotationText);
-${INDENT}}
-`;
+  const parameters = hasKey ? [
+    createInlineParameter("key", { type: "string" }),
+    createInlineParameter("annotationText", { type: "string", initializer: '""' })
+  ] : [createInlineParameter("annotationText", { type: "string", initializer: '""' })];
+  const testIdExpr = hasKey ? `\`${formattedDataTestId}\`` : `"${formattedDataTestId}"`;
+  return [
+    createAsyncMethod(name, parameters, (writer) => {
+      writer.writeLine(`await this.clickByTestId(${testIdExpr}, annotationText);`);
+    })
+  ];
 }
 function generateSelectMethod(methodName, formattedDataTestId) {
   const name = `select${methodName}`;
   const needsKey = formattedDataTestId.includes("${key}");
   const selectorExpr = needsKey ? `this.selectorForTestId(\`${formattedDataTestId}\`)` : `this.selectorForTestId("${formattedDataTestId}")`;
-  const content = `${INDENT}async ${name}(value: string, annotationText: string = "") {
-${INDENT2}const selector = ${selectorExpr};
-${INDENT2}await this.animateCursorToElement(selector, false, 500, annotationText);
-${INDENT2}await this.page.selectOption(selector, value);
-${INDENT}}
-
-`;
-  return content;
+  return [
+    createAsyncMethod(
+      name,
+      [
+        createInlineParameter("value", { type: "string" }),
+        createInlineParameter("annotationText", { type: "string", initializer: '""' })
+      ],
+      (writer) => {
+        writer.writeLine(`const selector = ${selectorExpr};`);
+        writer.writeLine("await this.animateCursorToElement(selector, false, 500, annotationText);");
+        writer.writeLine("await this.page.selectOption(selector, value);");
+      }
+    )
+  ];
 }
 function generateVSelectMethod(methodName, formattedDataTestId) {
   const name = `select${methodName}`;
-  const content = [
-    `${INDENT}async ${name}(value: string, timeOut = 500, annotationText: string = "") {
-`,
-    `${INDENT2}await this.selectVSelectByTestId("${formattedDataTestId}", value, timeOut, annotationText);
-`,
-    `${INDENT}}
-`
-  ].join("");
-  return content;
+  return [
+    createAsyncMethod(
+      name,
+      [
+        createInlineParameter("value", { type: "string" }),
+        createInlineParameter("timeOut", { type: "number", initializer: "500" }),
+        createInlineParameter("annotationText", { type: "string", initializer: '""' })
+      ],
+      (writer) => {
+        writer.writeLine(`await this.selectVSelectByTestId("${formattedDataTestId}", value, timeOut, annotationText);`);
+      }
+    )
+  ];
 }
 function generateTypeMethod(methodName, formattedDataTestId) {
   const name = `type${methodName}`;
-  const content = `${INDENT}async ${name}(text: string, annotationText: string = "") {
-${INDENT2}await this.fillInputByTestId("${formattedDataTestId}", text, annotationText);
-${INDENT}}
-`;
-  return content;
+  return [
+    createAsyncMethod(
+      name,
+      [
+        createInlineParameter("text", { type: "string" }),
+        createInlineParameter("annotationText", { type: "string", initializer: '""' })
+      ],
+      (writer) => {
+        writer.writeLine(`await this.fillInputByTestId("${formattedDataTestId}", text, annotationText);`);
+      }
+    )
+  ];
 }
 function isAllDigits(value) {
   if (!value)
@@ -235,90 +368,119 @@ function generateGetElementByDataTestId(methodName, nativeRole, formattedDataTes
   if (needsKey) {
     const keyType = params.key || "string";
     const keyedPropertyName = getterNameOverride ?? removeByKeySegment(propertyName);
-    return `${INDENT}get ${keyedPropertyName}() {
-${INDENT2}return this.keyedLocators((key: ${keyType}) => this.locatorByTestId(\`${formattedDataTestId}\`));
-${INDENT}}
-
-`;
+    return [
+      createClassGetter({
+        name: keyedPropertyName,
+        statements: [
+          `return this.keyedLocators((key: ${keyType}) => this.locatorByTestId(\`${formattedDataTestId}\`));`
+        ]
+      })
+    ];
   }
   const finalPropertyName = getterNameOverride ?? propertyName;
   const alternates = uniqueAlternates(formattedDataTestId, alternateFormattedDataTestIds);
   if (alternates.length > 0) {
     const all = [formattedDataTestId, ...alternates];
     const locatorExpr = all.map((id) => `this.locatorByTestId(${testIdExpression(id)})`).reduce((acc, next) => `${acc}.or(${next})`);
-    return `${INDENT}get ${finalPropertyName}() {
-${INDENT2}return ${locatorExpr};
-${INDENT}}
-
-`;
+    return [
+      createClassGetter({
+        name: finalPropertyName,
+        statements: [`return ${locatorExpr};`]
+      })
+    ];
   }
-  return `${INDENT}get ${finalPropertyName}() {
-${INDENT2}return this.locatorByTestId("${formattedDataTestId}");
-${INDENT}}
-
-`;
+  return [
+    createClassGetter({
+      name: finalPropertyName,
+      statements: [`return this.locatorByTestId("${formattedDataTestId}");`]
+    })
+  ];
 }
 function generateNavigationMethod(args) {
   const { targetPageObjectModelClass: target, baseMethodName, formattedDataTestId, alternateFormattedDataTestIds, params } = args;
   const methodName = baseMethodName ? `goTo${upperFirst$1(baseMethodName)}` : `goTo${target.endsWith("Page") ? target.slice(0, -"Page".length) : target}`;
-  const signature = `public ${methodName}(${formatParams(params)}): Fluent<${target}>`;
+  const parameters = createParameters(params);
   const alternates = uniqueAlternates(formattedDataTestId, alternateFormattedDataTestIds);
   const candidatesExpr = [formattedDataTestId, ...alternates].map(testIdExpression).join(", ");
   if (alternates.length > 0) {
-    return `${INDENT}${signature} {
-${INDENT2}return this.fluent(async () => {
-${INDENT3}const candidates = [${candidatesExpr}] as const;
-${INDENT3}let lastError: unknown;
-${INDENT3}for (const testId of candidates) {
-${INDENT3}${INDENT}const locator = this.locatorByTestId(testId);
-${INDENT3}${INDENT}try {
-${INDENT3}${INDENT2}if (await locator.count()) {
-${INDENT3}${INDENT3}await this.clickLocator(locator);
-${INDENT3}${INDENT3}return new ${target}(this.page);
-${INDENT3}${INDENT2}}
-${INDENT3}${INDENT}} catch (e) {
-${INDENT3}${INDENT2}lastError = e;
-${INDENT3}${INDENT}}
-${INDENT3}}
-${INDENT3}throw (lastError instanceof Error) ? lastError : new Error("[pom] Failed to navigate using any candidate locator for ${methodName}.");
-${INDENT2}});
-${INDENT}}
-`;
+    return [
+      createClassMethod({
+        name: methodName,
+        parameters,
+        returnType: `Fluent<${target}>`,
+        statements: (writer) => {
+          writer.write("return this.fluent(async () => ").block(() => {
+            writer.writeLine(`const candidates = [${candidatesExpr}] as const;`);
+            writer.writeLine("let lastError: unknown;");
+            writer.write("for (const testId of candidates) ").block(() => {
+              writer.writeLine("const locator = this.locatorByTestId(testId);");
+              writer.write("try ").block(() => {
+                writer.write("if (await locator.count()) ").block(() => {
+                  writer.writeLine("await this.clickLocator(locator);");
+                  writer.writeLine(`return new ${target}(this.page);`);
+                });
+              });
+              writer.write("catch (e) ").block(() => {
+                writer.writeLine("lastError = e;");
+              });
+            });
+            writer.writeLine(`throw (lastError instanceof Error) ? lastError : new Error("[pom] Failed to navigate using any candidate locator for ${methodName}.");`);
+          });
+          writer.writeLine(");");
+        }
+      })
+    ];
   }
-  const clickExpr = `\`${formattedDataTestId}\``;
-  return `${INDENT}${signature} {
-${INDENT2}return this.fluent(async () => {
-${INDENT3}await this.clickByTestId(${clickExpr});
-${INDENT3}return new ${target}(this.page);
-${INDENT2}});
-${INDENT}}
-`;
+  return [
+    createClassMethod({
+      name: methodName,
+      parameters,
+      returnType: `Fluent<${target}>`,
+      statements: (writer) => {
+        writer.write("return this.fluent(async () => ").block(() => {
+          writer.writeLine(`await this.clickByTestId(\`${formattedDataTestId}\`);`);
+          writer.writeLine(`return new ${target}(this.page);`);
+        });
+        writer.writeLine(");");
+      }
+    })
+  ];
 }
-function generateViewObjectModelMethodContent(targetPageObjectModelClass, methodName, nativeRole, formattedDataTestId, alternateFormattedDataTestIds, getterNameOverride, params) {
+function generateViewObjectModelMembers(targetPageObjectModelClass, methodName, nativeRole, formattedDataTestId, alternateFormattedDataTestIds, getterNameOverride, params) {
   const baseMethodName = nativeRole === "radio" ? methodName || "Radio" : methodName;
-  const getElementMethod = generateGetElementByDataTestId(baseMethodName, nativeRole, formattedDataTestId, alternateFormattedDataTestIds, getterNameOverride, params);
+  const members = generateGetElementByDataTestId(
+    baseMethodName,
+    nativeRole,
+    formattedDataTestId,
+    alternateFormattedDataTestIds,
+    getterNameOverride,
+    params
+  );
   if (targetPageObjectModelClass) {
-    return getElementMethod + generateNavigationMethod({
-      targetPageObjectModelClass,
-      baseMethodName,
-      formattedDataTestId,
-      alternateFormattedDataTestIds,
-      params
-    });
+    return [
+      ...members,
+      ...generateNavigationMethod({
+        targetPageObjectModelClass,
+        baseMethodName,
+        formattedDataTestId,
+        alternateFormattedDataTestIds,
+        params
+      })
+    ];
   }
   if (nativeRole === "select") {
-    return getElementMethod + generateSelectMethod(baseMethodName, formattedDataTestId);
+    return [...members, ...generateSelectMethod(baseMethodName, formattedDataTestId)];
   }
   if (nativeRole === "vselect") {
-    return getElementMethod + generateVSelectMethod(baseMethodName, formattedDataTestId);
+    return [...members, ...generateVSelectMethod(baseMethodName, formattedDataTestId)];
   }
   if (nativeRole === "input") {
-    return getElementMethod + generateTypeMethod(baseMethodName, formattedDataTestId);
+    return [...members, ...generateTypeMethod(baseMethodName, formattedDataTestId)];
   }
   if (nativeRole === "radio") {
-    return getElementMethod + generateRadioMethod(baseMethodName || "Radio", formattedDataTestId);
+    return [...members, ...generateRadioMethod(baseMethodName || "Radio", formattedDataTestId)];
   }
-  return getElementMethod + generateClickMethod(baseMethodName, formattedDataTestId, alternateFormattedDataTestIds, params);
+  return [...members, ...generateClickMethod(baseMethodName, formattedDataTestId, alternateFormattedDataTestIds, params)];
 }
 function isSimpleExpressionNode(value) {
   return value !== null && "type" in value && value.type === NodeTypes.SIMPLE_EXPRESSION;
@@ -3227,10 +3389,123 @@ async function parseRouterFileFromCwd(routerEntryPath, options = {}) {
     }
   });
 }
-const AUTO_GENERATED_COMMENT = " * DO NOT MODIFY BY HAND\n *\n * This file is auto-generated by vue-pom-generator.\n * Changes should be made in the generator/template, not in the generated output.\n */";
 const GENERATED_GITATTRIBUTES_BLOCK_START = "# BEGIN vue-pom-generator generated files";
 const GENERATED_GITATTRIBUTES_BLOCK_END = "# END vue-pom-generator generated files";
-const eslintSuppressionHeader = "/* eslint-disable perfectionist/sort-imports */\n";
+const VUE_POM_GENERATOR_ERROR_PREFIX = "[vue-pom-generator]";
+class VuePomGeneratorError extends Error {
+  constructor(message) {
+    const normalized = message.startsWith(VUE_POM_GENERATOR_ERROR_PREFIX) ? message : `${VUE_POM_GENERATOR_ERROR_PREFIX} ${message}`;
+    super(normalized);
+    this.name = "VuePomGeneratorError";
+  }
+}
+function splitParameterList(parameters) {
+  const parts = [];
+  let current = "";
+  let braceDepth = 0;
+  let bracketDepth = 0;
+  let parenDepth = 0;
+  let angleDepth = 0;
+  let inSingleQuote = false;
+  let inDoubleQuote = false;
+  let inTemplateString = false;
+  for (let index = 0; index < parameters.length; index += 1) {
+    const char = parameters[index];
+    const previous = index > 0 ? parameters[index - 1] : "";
+    if (char === "'" && !inDoubleQuote && !inTemplateString && previous !== "\\") {
+      inSingleQuote = !inSingleQuote;
+      current += char;
+      continue;
+    }
+    if (char === '"' && !inSingleQuote && !inTemplateString && previous !== "\\") {
+      inDoubleQuote = !inDoubleQuote;
+      current += char;
+      continue;
+    }
+    if (char === "`" && !inSingleQuote && !inDoubleQuote && previous !== "\\") {
+      inTemplateString = !inTemplateString;
+      current += char;
+      continue;
+    }
+    if (inSingleQuote || inDoubleQuote || inTemplateString) {
+      current += char;
+      continue;
+    }
+    switch (char) {
+      case "{":
+        braceDepth += 1;
+        break;
+      case "}":
+        braceDepth -= 1;
+        break;
+      case "[":
+        bracketDepth += 1;
+        break;
+      case "]":
+        bracketDepth -= 1;
+        break;
+      case "(":
+        parenDepth += 1;
+        break;
+      case ")":
+        parenDepth -= 1;
+        break;
+      case "<":
+        angleDepth += 1;
+        break;
+      case ">":
+        angleDepth -= 1;
+        break;
+      case ",":
+        if (braceDepth === 0 && bracketDepth === 0 && parenDepth === 0 && angleDepth === 0) {
+          const trimmed2 = current.trim();
+          if (trimmed2) {
+            parts.push(trimmed2);
+          }
+          current = "";
+          continue;
+        }
+        break;
+    }
+    current += char;
+  }
+  const trimmed = current.trim();
+  if (trimmed) {
+    parts.push(trimmed);
+  }
+  return parts;
+}
+function parseParameterSignature(parameter) {
+  const colonIndex = parameter.indexOf(":");
+  if (colonIndex < 0) {
+    return { name: parameter.trim() };
+  }
+  const rawName = parameter.slice(0, colonIndex).trim();
+  const hasQuestionToken = rawName.endsWith("?");
+  const name = hasQuestionToken ? rawName.slice(0, -1).trim() : rawName;
+  const remainder = parameter.slice(colonIndex + 1).trim();
+  const initializerIndex = remainder.lastIndexOf("=");
+  if (initializerIndex < 0) {
+    return {
+      name,
+      hasQuestionToken,
+      type: remainder || void 0
+    };
+  }
+  return {
+    name,
+    hasQuestionToken,
+    type: remainder.slice(0, initializerIndex).trim() || void 0,
+    initializer: remainder.slice(initializerIndex + 1).trim() || void 0
+  };
+}
+function parseParameterSignatures(parameters) {
+  const trimmed = parameters.trim();
+  if (!trimmed) {
+    return [];
+  }
+  return splitParameterList(trimmed).map(parseParameterSignature);
+}
 function toPosixRelativePath(fromDir, toFile) {
   let rel = path.relative(fromDir, toFile).replace(/\\/g, "/");
   if (!rel.startsWith(".")) {
@@ -3238,12 +3513,6 @@ function toPosixRelativePath(fromDir, toFile) {
   }
   return rel;
 }
-function changeExtension(filePath, expectedExt, nextExtWithDot) {
-  const parsed = path.parse(filePath);
-  if (parsed.ext !== expectedExt)
-    return filePath;
-  return path.format({ ...parsed, base: `${parsed.name}${nextExtWithDot}`, ext: nextExtWithDot });
-}
 function stripExtension(filePath) {
   const posix = (filePath ?? "").replace(/\\/g, "/");
   const parsed = path.posix.parse(posix);
@@ -3256,6 +3525,70 @@ function resolveRouterEntry(projectRoot, routerEntry) {
   const root = projectRoot ?? process.cwd();
   return path.isAbsolute(routerEntry) ? routerEntry : path.resolve(root, routerEntry);
 }
+function createCustomPomImportCollisionError(exportName, requested) {
+  return new VuePomGeneratorError(
+    `Custom POM import name collision detected for "${exportName}".
+The identifier "${requested}" conflicts with a generated POM class.
+Fix by setting generation.playwright.customPoms.importAliases["${exportName}"] to a unique name, or set generation.playwright.customPoms.importNameCollisionBehavior = "alias" to auto-alias collisions.`
+  );
+}
+function normalizeComponentTagToClassName(tag) {
+  const className = toPascalCase(tag);
+  return className || void 0;
+}
+function collectReferencedComponentClassNames(nodes, names) {
+  for (const node of nodes) {
+    switch (node.type) {
+      case NodeTypes$1.ELEMENT: {
+        const element = node;
+        if (element.tagType === ElementTypes.COMPONENT) {
+          const className = normalizeComponentTagToClassName(element.tag);
+          if (className) {
+            names.add(className);
+          }
+        }
+        collectReferencedComponentClassNames(element.children, names);
+        break;
+      }
+      case NodeTypes$1.IF: {
+        const ifNode = node;
+        for (const branch of ifNode.branches) {
+          collectReferencedComponentClassNames(branch.children, names);
+        }
+        break;
+      }
+      case NodeTypes$1.FOR: {
+        const forNode = node;
+        collectReferencedComponentClassNames(forNode.children, names);
+        break;
+      }
+    }
+  }
+}
+function getComponentClassNamesFromVueSource(source) {
+  try {
+    const { descriptor } = parse$1(source);
+    const template = descriptor.template?.content?.trim();
+    if (!template) {
+      return [];
+    }
+    const root = parse$2(template);
+    const names = /* @__PURE__ */ new Set();
+    collectReferencedComponentClassNames(root.children, names);
+    return [...names];
+  } catch {
+    return [];
+  }
+}
+function resolveVueSourcePath(targetClassName, vueFilesPathMap, projectRoot) {
+  const mapped = vueFilesPathMap.get(targetClassName);
+  const candidates = [
+    mapped,
+    path.join(projectRoot, "src", "views", `${targetClassName}.vue`),
+    path.join(projectRoot, "src", "components", `${targetClassName}.vue`)
+  ].filter((candidate) => typeof candidate === "string" && candidate.length > 0);
+  return candidates.find((candidate) => fs.existsSync(candidate));
+}
 async function getRouteMetaByComponent(projectRoot, routerEntry, routerType, options = {}) {
   const root = projectRoot ?? process.cwd();
   const viewsDir = options.viewsDir ?? "src/views";
@@ -3290,35 +3623,40 @@ async function getRouteMetaByComponent(projectRoot, routerEntry, routerType, opt
   );
 }
 function generateRouteProperty(routeMeta) {
-  if (!routeMeta) {
-    return "    static readonly route: { template: string } | null = null;\n";
-  }
   return [
-    "    static readonly route: { template: string } | null = {",
-    `        template: ${JSON.stringify(routeMeta.template)},`,
-    "    } as const;",
-    ""
-  ].join("\n");
+    createClassProperty({
+      name: "route",
+      isStatic: true,
+      isReadonly: true,
+      type: "{ template: string } | null",
+      initializer: routeMeta ? `{ template: ${JSON.stringify(routeMeta.template)} } as const` : "null"
+    })
+  ];
 }
 function generateGoToSelfMethod(componentName) {
   return [
-    "",
-    "    async goTo() {",
-    "        await this.goToSelf();",
-    "    }",
-    "",
-    "    async goToSelf() {",
-    `        const route = ${componentName}.route;`,
-    "        if (!route) {",
-    `            throw new Error("[pom] No router path found for component/page-object '${componentName}'.");`,
-    "        }",
-    "        const runtimeEnv = (globalThis as { process?: { env?: Record<string, string | undefined> } }).process?.env;",
-    "        const runtimeBaseUrl = runtimeEnv?.PLAYWRIGHT_RUNTIME_BASE_URL ?? runtimeEnv?.PLAYWRIGHT_TEST_BASE_URL ?? runtimeEnv?.VITE_PLAYWRIGHT_BASE_URL;",
-    "        const targetUrl = runtimeBaseUrl ? new URL(route.template, runtimeBaseUrl).toString() : route.template;",
-    "        await this.page.goto(targetUrl);",
-    "    }",
-    ""
-  ].join("\n");
+    createClassMethod({
+      name: "goTo",
+      isAsync: true,
+      statements: [
+        "await this.goToSelf();"
+      ]
+    }),
+    createClassMethod({
+      name: "goToSelf",
+      isAsync: true,
+      statements: [
+        `const route = ${componentName}.route;`,
+        "if (!route) {",
+        `    throw new Error("[pom] No router path found for component/page-object '${componentName}'.");`,
+        "}",
+        "const runtimeEnv = (globalThis as { process?: { env?: Record<string, string | undefined> } }).process?.env;",
+        "const runtimeBaseUrl = runtimeEnv?.PLAYWRIGHT_RUNTIME_BASE_URL ?? runtimeEnv?.PLAYWRIGHT_TEST_BASE_URL ?? runtimeEnv?.VITE_PLAYWRIGHT_BASE_URL;",
+        "const targetUrl = runtimeBaseUrl ? new URL(route.template, runtimeBaseUrl).toString() : route.template;",
+        "await this.page.goto(targetUrl);"
+      ]
+    })
+  ];
 }
 function formatMethodParams(params) {
   if (!params)
@@ -3333,21 +3671,13 @@ function formatMethodParams(params) {
   };
   return entries.slice().sort((a, b) => score(a[0]) - score(b[0]) || a[0].localeCompare(b[0])).map(([name, typeExpr]) => `${name}: ${typeExpr}`).join(", ");
 }
-function generateExtraClickMethodContent(spec) {
+function generateExtraClickMethodMembers(spec) {
   if (spec.kind !== "click") {
-    return "";
+    return [];
   }
   const params = spec.params ?? {};
   const signatureParams = formatMethodParams(params);
-  const signature = signatureParams ? `(${signatureParams})` : "()";
-  const lines = [];
-  lines.push(
-    "",
-    `    async ${spec.name}${signature} {`
-  );
-  if (spec.keyLiteral !== void 0) {
-    lines.push(`        const key = ${JSON.stringify(spec.keyLiteral)};`);
-  }
+  const parameters = parseParameterSignatures(signatureParams);
   const hasAnnotationText = Object.prototype.hasOwnProperty.call(params, "annotationText");
   const hasWait = Object.prototype.hasOwnProperty.call(params, "wait");
   const annotationArg = hasAnnotationText ? "annotationText" : '""';
@@ -3355,9 +3685,6 @@ function generateExtraClickMethodContent(spec) {
   if (spec.selector.kind === "testId") {
     const needsTemplate = spec.selector.formattedDataTestId.includes("${");
     const testIdExpr = needsTemplate ? `\`${spec.selector.formattedDataTestId}\`` : JSON.stringify(spec.selector.formattedDataTestId);
-    if (needsTemplate) {
-      lines.push(`        const testId = ${testIdExpr};`);
-    }
     const clickArgs = [];
     clickArgs.push(needsTemplate ? "testId" : testIdExpr);
     if (hasAnnotationText || hasWait) {
@@ -3366,33 +3693,54 @@ function generateExtraClickMethodContent(spec) {
     if (hasWait) {
       clickArgs.push(waitArg);
     }
-    lines.push(`        await this.clickByTestId(${clickArgs.join(", ")});`);
-    lines.push("    }");
-    return `${lines.join("\n")}
-`;
+    return [
+      createClassMethod({
+        name: spec.name,
+        isAsync: true,
+        parameters,
+        statements: (writer) => {
+          if (spec.keyLiteral !== void 0) {
+            writer.writeLine(`const key = ${JSON.stringify(spec.keyLiteral)};`);
+          }
+          if (needsTemplate) {
+            writer.writeLine(`const testId = ${testIdExpr};`);
+          }
+          writer.writeLine(`await this.clickByTestId(${clickArgs.join(", ")});`);
+        }
+      })
+    ];
   }
   const rootNeedsTemplate = spec.selector.rootFormattedDataTestId.includes("${");
   const labelNeedsTemplate = spec.selector.formattedLabel.includes("${");
   const rootExpr = rootNeedsTemplate ? `\`${spec.selector.rootFormattedDataTestId}\`` : JSON.stringify(spec.selector.rootFormattedDataTestId);
   const labelExpr = labelNeedsTemplate ? `\`${spec.selector.formattedLabel}\`` : JSON.stringify(spec.selector.formattedLabel);
-  if (rootNeedsTemplate) {
-    lines.push(`        const rootTestId = ${rootExpr};`);
-  }
-  if (labelNeedsTemplate) {
-    lines.push(`        const label = ${labelExpr};`);
-  }
   const rootArg = rootNeedsTemplate ? "rootTestId" : rootExpr;
   const labelArg = labelNeedsTemplate ? "label" : labelExpr;
-  lines.push(`        await this.clickWithinTestIdByLabel(${rootArg}, ${labelArg}, ${annotationArg}, ${waitArg});`);
-  lines.push("    }");
-  return `${lines.join("\n")}
-`;
+  return [
+    createClassMethod({
+      name: spec.name,
+      isAsync: true,
+      parameters,
+      statements: (writer) => {
+        if (spec.keyLiteral !== void 0) {
+          writer.writeLine(`const key = ${JSON.stringify(spec.keyLiteral)};`);
+        }
+        if (rootNeedsTemplate) {
+          writer.writeLine(`const rootTestId = ${rootExpr};`);
+        }
+        if (labelNeedsTemplate) {
+          writer.writeLine(`const label = ${labelExpr};`);
+        }
+        writer.writeLine(`await this.clickWithinTestIdByLabel(${rootArg}, ${labelArg}, ${annotationArg}, ${waitArg});`);
+      }
+    })
+  ];
 }
-function generateMethodContentFromPom(primary, targetPageObjectModelClass) {
+function generateMethodMembersFromPom(primary, targetPageObjectModelClass) {
   if (primary.emitPrimary === false) {
-    return "";
+    return [];
   }
-  return generateViewObjectModelMethodContent(
+  return generateViewObjectModelMembers(
     targetPageObjectModelClass,
     primary.methodName,
     primary.nativeRole,
@@ -3426,14 +3774,14 @@ function generateMethodsContentForDependencies(dependencies) {
     return true;
   });
   const extras = (dependencies.pomExtraMethods ?? []).slice().sort((a, b) => a.name.localeCompare(b.name));
-  let content = "";
+  const members = [];
   for (const { pom, target } of primarySpecs) {
-    content += generateMethodContentFromPom(pom, target);
+    members.push(...generateMethodMembersFromPom(pom, target));
   }
   for (const extra of extras) {
-    content += generateExtraClickMethodContent(extra);
+    members.push(...generateExtraClickMethodMembers(extra));
   }
-  return content;
+  return members;
 }
 async function generateFiles(componentHierarchyMap, vueFilesPathMap, basePageClassPath, options = {}) {
   const {
@@ -3446,6 +3794,7 @@ async function generateFiles(componentHierarchyMap, vueFilesPathMap, basePageCla
     customPomImportNameCollisionBehavior = "error",
     testIdAttribute,
     emitLanguages: emitLanguagesOverride,
+    typescriptOutputStructure = "aggregated",
     csharp,
     vueRouterFluentChaining,
     routerEntry,
@@ -3467,7 +3816,16 @@ async function generateFiles(componentHierarchyMap, vueFilesPathMap, basePageCla
     generatedFilePaths.push(resolvedFilePath);
   };
   if (emitLanguages.includes("ts")) {
-    const files = await generateAggregatedFiles(componentHierarchyMap, vueFilesPathMap, basePageClassPath, outDir, {
+    const files = typescriptOutputStructure === "split" ? await generateSplitTypeScriptFiles(componentHierarchyMap, vueFilesPathMap, basePageClassPath, outDir, {
+      customPomAttachments,
+      projectRoot,
+      customPomDir,
+      customPomImportAliases,
+      customPomImportNameCollisionBehavior,
+      testIdAttribute,
+      routeMetaByComponent,
+      vueRouterFluentChaining
+    }) : await generateAggregatedFiles(componentHierarchyMap, vueFilesPathMap, basePageClassPath, outDir, {
       customPomAttachments,
       projectRoot,
       customPomDir,
@@ -3504,6 +3862,100 @@ async function generateFiles(componentHierarchyMap, vueFilesPathMap, basePageCla
     createFile(file.filePath, file.content);
   }
 }
+async function generateSplitTypeScriptFiles(componentHierarchyMap, vueFilesPathMap, basePageClassPath, outDir, options = {}) {
+  const projectRoot = options.projectRoot ?? process.cwd();
+  const entries = Array.from(componentHierarchyMap.entries()).sort((a, b) => a[0].localeCompare(b[0]));
+  const base = ensureDir(outDir);
+  const generatedClassNames = new Set(entries.map(([name]) => name));
+  const referencedTargets = /* @__PURE__ */ new Set();
+  for (const [, deps] of entries) {
+    for (const dataTestId of deps.dataTestIdSet ?? []) {
+      if (dataTestId.targetPageObjectModelClass) {
+        referencedTargets.add(dataTestId.targetPageObjectModelClass);
+      }
+    }
+  }
+  const stubTargets = Array.from(referencedTargets).filter((target) => !generatedClassNames.has(target)).sort((a, b) => a.localeCompare(b));
+  const availableClassNames = /* @__PURE__ */ new Set([...generatedClassNames, ...stubTargets]);
+  const depsByClassName = new Map(entries);
+  const generatedTsFilePathByComponent = /* @__PURE__ */ new Map();
+  for (const className of availableClassNames) {
+    generatedTsFilePathByComponent.set(className, path.join(base, `${className}.g.ts`));
+  }
+  const customPomImportResolution = resolveCustomPomImportResolution(generatedClassNames, projectRoot, {
+    customPomDir: options.customPomDir,
+    customPomImportAliases: options.customPomImportAliases,
+    customPomImportNameCollisionBehavior: options.customPomImportNameCollisionBehavior
+  });
+  const runtimeBasePagePath = path.join(base, "_pom-runtime", "class-generation", "BasePage.ts");
+  const files = [];
+  for (const [name, deps] of entries) {
+    const filePath = generatedTsFilePathByComponent.get(name);
+    if (!filePath) {
+      continue;
+    }
+    const content = generateViewObjectModelContent(name, deps, componentHierarchyMap, vueFilesPathMap, runtimeBasePagePath, {
+      outputDir: path.dirname(filePath),
+      customPomAttachments: options.customPomAttachments ?? [],
+      projectRoot,
+      customPomDir: options.customPomDir,
+      customPomImportAliases: options.customPomImportAliases,
+      customPomClassIdentifierMap: customPomImportResolution.classIdentifierMap,
+      customPomAvailableClassIdentifiers: customPomImportResolution.availableClassIdentifiers,
+      customPomImportSpecifiersByClass: customPomImportResolution.importSpecifiersByClass,
+      customPomMethodSignaturesByClass: customPomImportResolution.methodSignaturesByClass,
+      generatedTsFilePathByComponent,
+      testIdAttribute: options.testIdAttribute,
+      vueRouterFluentChaining: options.vueRouterFluentChaining,
+      routeMetaByComponent: options.routeMetaByComponent
+    });
+    files.push({ filePath, content });
+  }
+  for (const targetClassName of stubTargets) {
+    const filePath = generatedTsFilePathByComponent.get(targetClassName);
+    if (!filePath) {
+      continue;
+    }
+    const outputDir = path.dirname(filePath);
+    const basePageImportSpecifier = stripExtension(toPosixRelativePath(outputDir, runtimeBasePagePath));
+    const composed = getComposedStubBody(targetClassName, availableClassNames, depsByClassName, vueFilesPathMap, projectRoot);
+    const childImports = getChildImportSpecifiers(outputDir, composed?.childClassNames ?? [], generatedTsFilePathByComponent);
+    const members = composed?.members ?? getDefaultStubMembers();
+    const content = renderSplitStubPomContent({
+      className: targetClassName,
+      basePageImportSpecifier,
+      childImports,
+      members
+    });
+    files.push({ filePath, content });
+  }
+  const runtimeAssetSpecs = getRuntimeGeneratedAssetSpecs(base, basePageClassPath);
+  const runtimeFiles = buildRuntimeGeneratedFilesFromSpecs(runtimeAssetSpecs);
+  const indexContent = renderSourceFile("index.ts", (sourceFile) => {
+    for (const spec of runtimeAssetSpecs) {
+      addExportAll(sourceFile, stripExtension(toPosixRelativePath(base, spec.outputPath)));
+    }
+    for (const [, filePath] of Array.from(generatedTsFilePathByComponent.entries()).sort((a, b) => a[0].localeCompare(b[0]))) {
+      addExportAll(sourceFile, `./${stripExtension(path.basename(filePath))}`);
+    }
+  }, {
+    prefixText: buildFilePrefix({
+      eslintDisableSortImports: true,
+      commentLines: [
+        "POM exports",
+        "DO NOT MODIFY BY HAND",
+        "",
+        "This file is auto-generated by vue-pom-generator.",
+        "Changes should be made in the generator/template, not in the generated output."
+      ]
+    })
+  });
+  return [
+    ...files,
+    { filePath: path.join(base, "index.ts"), content: indexContent },
+    ...runtimeFiles
+  ];
+}
 function escapeGitAttributesPattern(value) {
   let output = "";
   for (let i = 0; i < value.length; i++) {
@@ -3942,91 +4394,190 @@ function maybeGenerateFixtureRegistry(componentHierarchyMap, options) {
     };
   }).filter((entry) => !!entry);
   const overrideCtorByClassName = new Map(overrideCtorEntries.map((entry) => [entry.className, entry.localIdentifier]));
-  const overrideImports = overrideCtorEntries.length ? `${overrideCtorEntries.map((entry) => `import { ${entry.className} as ${entry.localIdentifier} } from "${entry.importSpecifier}";`).join("\n")}
-
-` : "";
   const fixtureCtorExpression = (name) => overrideCtorByClassName.get(name) ?? `Pom.${name}`;
-  const header = `${eslintSuppressionHeader}/**
- * DO NOT MODIFY BY HAND
- *
- * This file is auto-generated by vue-pom-generator.
- * Changes should be made in the generator/template, not in the generated output.
- */
-
-`;
-  const fixturesTypeEntries = viewClassNames.map((name) => `  ${lowerFirst(name)}: ${fixtureCtorExpression(name)},`).join("\n");
-  const componentFixturesTypeEntries = componentClassNames.map((name) => `  ${lowerFirst(name)}: ${fixtureCtorExpression(name)},`).join("\n");
-  const pomFactoryType = `export type PomConstructor<T> = new (page: PwPage) => T;
-
-export interface PomFactory {
-  create<T>(ctor: PomConstructor<T>): T;
-}
-
-`;
-  const fixturesContent = `${header}/** Generated Playwright fixtures (typed page objects). */
-
-import { expect, test as base } from "@playwright/test";
-import type { Page as PwPage } from "@playwright/test";
-import * as Pom from "${pomImport}";
-${overrideImports}export interface PlaywrightOptions {
-  animation: Pom.PlaywrightAnimationOptions;
-}
-
-${pomFactoryType}type PomSetupFixture = { pomSetup: void };
-type PomFactoryFixture = { pomFactory: PomFactory };
-
-const pageCtors = {
-${fixturesTypeEntries}
-} as const;
-const componentCtors = {
-${componentFixturesTypeEntries}
-} as const;
-
-export type GeneratedPageFixtures = { [K in keyof typeof pageCtors]: InstanceType<(typeof pageCtors)[K]> };
-export type GeneratedComponentFixtures = { [K in keyof typeof componentCtors]: InstanceType<(typeof componentCtors)[K]> };
-
-const makePomFixture = <T>(Ctor: PomConstructor<T>) => async ({ page }: { page: PwPage }, use: (t: T) => Promise<void>) => {
-  await use(new Ctor(page));
-};
-
-const createPomFixtures = <TMap extends Record<string, PomConstructor<any>>>(ctors: TMap) => {
-  const out: Record<string, any> = {};
-  for (const [key, Ctor] of Object.entries(ctors)) {
-    out[key] = makePomFixture(Ctor as PomConstructor<any>);
-  }
-  return out as any;
-};
-
-const test = base.extend<PlaywrightOptions & PomSetupFixture & PomFactoryFixture & GeneratedPageFixtures & GeneratedComponentFixtures>({
-  animation: [{
-    pointer: { durationMilliseconds: 250, transitionStyle: "ease-in-out", clickDelayMilliseconds: 0 },
-    keyboard: { typeDelayMilliseconds: 100 },
-  }, { option: true }],
-  pomSetup: [async ({ animation }, use) => {
-    Pom.setPlaywrightAnimationOptions(animation);
-    await use();
-  }, { auto: true }],
-  pomFactory: async ({ page }, use) => {
-    await use({
-      create: <T>(ctor: PomConstructor<T>) => new ctor(page),
+  const pageCtorEntries = viewClassNames.map((name) => ({
+    fixtureName: lowerFirst(name),
+    ctorExpression: fixtureCtorExpression(name)
+  }));
+  const componentCtorEntries = componentClassNames.map((name) => ({
+    fixtureName: lowerFirst(name),
+    ctorExpression: fixtureCtorExpression(name)
+  }));
+  const fixturesContent = renderSourceFile(fixtureFileName, (sourceFile) => {
+    sourceFile.addStatements("/** Generated Playwright fixtures (typed page objects). */");
+    addNamedImport(sourceFile, {
+      moduleSpecifier: "@playwright/test",
+      namedImports: [
+        "expect",
+        { name: "test", alias: "base" }
+      ]
     });
-  },
-  ...createPomFixtures(pageCtors),
-  ...createPomFixtures(componentCtors),
-});
-
-export { test, expect };
-`;
-  return {
-    filePath: path.resolve(fixtureOutDirAbs, fixtureFileName),
+    addNamedImport(sourceFile, {
+      moduleSpecifier: "@playwright/test",
+      isTypeOnly: true,
+      namedImports: [{ name: "Page", alias: "PwPage" }]
+    });
+    sourceFile.addImportDeclaration({
+      namespaceImport: "Pom",
+      moduleSpecifier: pomImport
+    });
+    for (const entry of overrideCtorEntries) {
+      addNamedImport(sourceFile, {
+        moduleSpecifier: entry.importSpecifier,
+        namedImports: [{ name: entry.className, alias: entry.localIdentifier }]
+      });
+    }
+    sourceFile.addInterface({
+      isExported: true,
+      name: "PlaywrightOptions",
+      properties: [{
+        name: "animation",
+        type: "Pom.PlaywrightAnimationOptions"
+      }]
+    });
+    sourceFile.addTypeAlias({
+      isExported: true,
+      name: "PomConstructor",
+      typeParameters: [{ name: "T" }],
+      type: "new (page: PwPage) => T"
+    });
+    sourceFile.addInterface({
+      isExported: true,
+      name: "PomFactory",
+      methods: [{
+        name: "create",
+        typeParameters: [{ name: "T" }],
+        parameters: [{ name: "ctor", type: "PomConstructor<T>" }],
+        returnType: "T"
+      }]
+    });
+    sourceFile.addTypeAlias({
+      name: "PomSetupFixture",
+      type: "{ pomSetup: void }"
+    });
+    sourceFile.addTypeAlias({
+      name: "PomFactoryFixture",
+      type: "{ pomFactory: PomFactory }"
+    });
+    sourceFile.addVariableStatement({
+      declarationKind: VariableDeclarationKind.Const,
+      declarations: [{
+        name: "pageCtors",
+        initializer: (writer) => {
+          writer.write("{").newLine();
+          writer.indent(() => {
+            for (const entry of pageCtorEntries) {
+              writer.writeLine(`${entry.fixtureName}: ${entry.ctorExpression},`);
+            }
+          });
+          writer.write("} as const");
+        }
+      }]
+    });
+    sourceFile.addVariableStatement({
+      declarationKind: VariableDeclarationKind.Const,
+      declarations: [{
+        name: "componentCtors",
+        initializer: (writer) => {
+          writer.write("{").newLine();
+          writer.indent(() => {
+            for (const entry of componentCtorEntries) {
+              writer.writeLine(`${entry.fixtureName}: ${entry.ctorExpression},`);
+            }
+          });
+          writer.write("} as const");
+        }
+      }]
+    });
+    sourceFile.addTypeAlias({
+      isExported: true,
+      name: "GeneratedPageFixtures",
+      type: "{ [K in keyof typeof pageCtors]: InstanceType<(typeof pageCtors)[K]> }"
+    });
+    sourceFile.addTypeAlias({
+      isExported: true,
+      name: "GeneratedComponentFixtures",
+      type: "{ [K in keyof typeof componentCtors]: InstanceType<(typeof componentCtors)[K]> }"
+    });
+    sourceFile.addFunction({
+      name: "makePomFixture",
+      typeParameters: [{ name: "T" }],
+      parameters: [{ name: "Ctor", type: "PomConstructor<T>" }],
+      statements: [
+        "return async ({ page }: { page: PwPage }, use: (t: T) => Promise<void>) => {",
+        "    await use(new Ctor(page));",
+        "};"
+      ]
+    });
+    sourceFile.addFunction({
+      name: "createPomFixtures",
+      typeParameters: [{ name: "TMap", constraint: "Record<string, PomConstructor<any>>" }],
+      parameters: [{ name: "ctors", type: "TMap" }],
+      statements: [
+        "const out: Record<string, any> = {};",
+        "for (const [key, Ctor] of Object.entries(ctors)) {",
+        "    out[key] = makePomFixture(Ctor as PomConstructor<any>);",
+        "}",
+        "return out as any;"
+      ]
+    });
+    sourceFile.addVariableStatement({
+      declarationKind: VariableDeclarationKind.Const,
+      declarations: [{
+        name: "test",
+        initializer: (writer) => {
+          writer.write("base.extend<PlaywrightOptions & PomSetupFixture & PomFactoryFixture & GeneratedPageFixtures & GeneratedComponentFixtures>(");
+          writer.block(() => {
+            writer.writeLine("animation: [{");
+            writer.indent(() => {
+              writer.writeLine('pointer: { durationMilliseconds: 250, transitionStyle: "ease-in-out", clickDelayMilliseconds: 0 },');
+              writer.writeLine("keyboard: { typeDelayMilliseconds: 100 },");
+            });
+            writer.writeLine("}, { option: true }],");
+            writer.writeLine("pomSetup: [async ({ animation }, use) => {");
+            writer.indent(() => {
+              writer.writeLine("Pom.setPlaywrightAnimationOptions(animation);");
+              writer.writeLine("await use();");
+            });
+            writer.writeLine("}, { auto: true }],");
+            writer.writeLine("pomFactory: async ({ page }, use) => {");
+            writer.indent(() => {
+              writer.writeLine("await use({");
+              writer.indent(() => {
+                writer.writeLine("create: <T>(ctor: PomConstructor<T>) => new ctor(page),");
+              });
+              writer.writeLine("});");
+            });
+            writer.writeLine("},");
+            writer.writeLine("...createPomFixtures(pageCtors),");
+            writer.writeLine("...createPomFixtures(componentCtors),");
+          });
+          writer.write(")");
+        }
+      }]
+    });
+    sourceFile.addExportDeclaration({
+      namedExports: ["test", "expect"]
+    });
+  }, {
+    prefixText: buildFilePrefix({
+      eslintDisableSortImports: true,
+      commentLines: [
+        "DO NOT MODIFY BY HAND",
+        "",
+        "This file is auto-generated by vue-pom-generator.",
+        "Changes should be made in the generator/template, not in the generated output."
+      ]
+    })
+  });
+  return {
+    filePath: path.resolve(fixtureOutDirAbs, fixtureFileName),
     content: fixturesContent
   };
 }
-function generateViewObjectModelContent(componentName, dependencies, componentHierarchyMap, vueFilesPathMap, basePageClassPath, options = {}) {
-  const { isView, childrenComponentSet, usedComponentSet, filePath } = dependencies;
+function prepareViewObjectModelClass(componentName, dependencies, componentHierarchyMap, options = {}) {
+  const { isView, childrenComponentSet, usedComponentSet } = dependencies;
   const {
-    outputDir = path.dirname(filePath),
-    aggregated = false,
     customPomAttachments = [],
     testIdAttribute
   } = options;
@@ -4060,45 +4611,9 @@ function generateViewObjectModelContent(componentName, dependencies, componentHi
     flatten: a.flatten ?? false,
     methodSignatures: a.flatten ? customPomMethodSignaturesByClass.get(a.className) ?? /* @__PURE__ */ new Map() : /* @__PURE__ */ new Map()
   }));
-  let content = "";
-  const sourceRel = toPosixRelativePath(outputDir, filePath);
-  const kind = isView ? "Page" : "Component";
-  const doc = `/** ${kind} POM: ${componentName} (source: ${sourceRel}) */
-`;
-  if (!aggregated) {
-    content = `${eslintSuppressionHeader}${doc}`;
-    if (isView || attachmentsForThisClass.length > 0) {
-      content += 'import type { Page as PwPage } from "@playwright/test";\n';
-    }
-    const projectRoot = options.projectRoot ?? process.cwd();
-    const fromAbs = path.isAbsolute(outputDir) ? outputDir : path.resolve(projectRoot, outputDir);
-    const toAbs = basePageClassPath ? path.isAbsolute(basePageClassPath) ? basePageClassPath : path.resolve(projectRoot, basePageClassPath) : "";
-    const basePageImport = path.relative(fromAbs, toAbs).replace(/\\/g, "/");
-    const basePageImportNoExt = stripExtension(basePageImport).replace(/\\/g, "/");
-    const basePageImportSpecifier = basePageImportNoExt.startsWith(".") ? basePageImportNoExt : `./${basePageImportNoExt}`;
-    content += `import { BasePage, Fluent } from '${basePageImportSpecifier}';
-
-`;
-    if (isView && childrenComponentSet.size > 0) {
-      childrenComponentSet.forEach((child) => {
-        if (componentHierarchyMap.has(child) && componentHierarchyMap.get(child)?.dataTestIdSet.size) {
-          const childPath = vueFilesPathMap.get(child);
-          let relativePath = path.relative(outputDir, childPath || "");
-          relativePath = changeExtension(relativePath, ".vue", ".g").replace(/\\/g, "/");
-          content += `import { ${child} } from '${relativePath}';
-`;
-        }
-      });
-    }
-  } else {
-    content = doc;
-  }
-  const className = toPascalCaseLocal(componentName);
-  content += `
-export class ${className} extends BasePage {
-`;
   const widgetInstances = isView ? getWidgetInstancesForView(componentName, dependencies.dataTestIdSet, customPomAvailableClassIdentifiers) : [];
   const componentRefsForInstances = isView ? usedComponentSet?.size ? usedComponentSet : childrenComponentSet : childrenComponentSet;
+  const className = toPascalCaseLocal(componentName);
   const childInstancePropertyNames = Array.from(componentRefsForInstances).filter((child) => componentHierarchyMap.has(child) && componentHierarchyMap.get(child)?.dataTestIdSet.size).map((child) => child.split(".vue")[0]);
   const blockedViewPassthroughMethodNames = new Set(
     attachmentsForThisClass.filter((a) => a.flatten).flatMap((a) => Array.from(a.methodSignatures.keys()))
@@ -4108,26 +4623,144 @@ export class ${className} extends BasePage {
     ...widgetInstances.map((w) => w.propertyName),
     ...childInstancePropertyNames
   ]);
+  const members = [];
   if (isView && (componentRefsForInstances.size > 0 || attachmentsForThisClass.length > 0 || widgetInstances.length > 0)) {
-    content += getComponentInstances(componentRefsForInstances, componentHierarchyMap, attachmentsForThisClass, widgetInstances);
-    content += getConstructor(componentRefsForInstances, componentHierarchyMap, attachmentsForThisClass, widgetInstances, { testIdAttribute });
+    members.push(...getComponentInstances(componentRefsForInstances, componentHierarchyMap, attachmentsForThisClass, widgetInstances));
+    members.push(getConstructor(componentRefsForInstances, componentHierarchyMap, attachmentsForThisClass, widgetInstances, { testIdAttribute }));
   }
   if (!isView && attachmentsForThisClass.length > 0) {
-    content += getComponentInstances(/* @__PURE__ */ new Set(), componentHierarchyMap, attachmentsForThisClass);
-    content += getConstructor(/* @__PURE__ */ new Set(), componentHierarchyMap, attachmentsForThisClass, [], { testIdAttribute });
+    members.push(...getComponentInstances(/* @__PURE__ */ new Set(), componentHierarchyMap, attachmentsForThisClass));
+    members.push(getConstructor(/* @__PURE__ */ new Set(), componentHierarchyMap, attachmentsForThisClass, [], { testIdAttribute }));
   }
-  content += getAttachmentPassthroughMethods(componentName, dependencies, attachmentsForThisClass, reservedAttachmentPassthroughNames);
+  members.push(
+    ...getAttachmentPassthroughMethods(componentName, dependencies, attachmentsForThisClass, reservedAttachmentPassthroughNames)
+  );
   if (isView && componentRefsForInstances.size === 1) {
-    content += getViewPassthroughMethods(componentName, dependencies, componentRefsForInstances, componentHierarchyMap, blockedViewPassthroughMethodNames);
+    members.push(
+      ...getViewPassthroughMethods(
+        componentName,
+        dependencies,
+        componentRefsForInstances,
+        componentHierarchyMap,
+        blockedViewPassthroughMethodNames
+      )
+    );
   }
   if (isView && options.vueRouterFluentChaining) {
     const routeMeta = options.routeMetaByComponent?.[componentName] ?? null;
-    content += generateRouteProperty(routeMeta);
-    content += generateGoToSelfMethod(className);
+    members.push(...generateRouteProperty(routeMeta));
+    members.push(...generateGoToSelfMethod(className));
   }
-  content += generateMethodsContentForDependencies(dependencies);
-  content += "}\n";
-  return content;
+  members.push(...generateMethodsContentForDependencies(dependencies));
+  return {
+    className,
+    componentRefsForInstances,
+    attachmentsForThisClass,
+    widgetInstances,
+    isView,
+    members
+  };
+}
+function generateViewObjectModelContent(componentName, dependencies, componentHierarchyMap, _vueFilesPathMap, basePageClassPath, options = {}) {
+  const { filePath } = dependencies;
+  const outputDir = options.outputDir ?? path.dirname(filePath);
+  const prepared = prepareViewObjectModelClass(componentName, dependencies, componentHierarchyMap, options);
+  const sourceRel = toPosixRelativePath(outputDir, filePath);
+  const kind = prepared.isView ? "Page" : "Component";
+  const doc = `/** ${kind} POM: ${componentName} (source: ${sourceRel}) */`;
+  const projectRoot = options.projectRoot ?? process.cwd();
+  const fromAbs = path.isAbsolute(outputDir) ? outputDir : path.resolve(projectRoot, outputDir);
+  const toAbs = basePageClassPath ? path.isAbsolute(basePageClassPath) ? basePageClassPath : path.resolve(projectRoot, basePageClassPath) : "";
+  const basePageImport = path.relative(fromAbs, toAbs).replace(/\\/g, "/");
+  const basePageImportNoExt = stripExtension(basePageImport).replace(/\\/g, "/");
+  const basePageImportSpecifier = basePageImportNoExt.startsWith(".") ? basePageImportNoExt : `./${basePageImportNoExt}`;
+  const needsPlaywrightPageImport = prepared.isView || prepared.attachmentsForThisClass.length > 0;
+  const customPomImportSpecifiersByClass = options.customPomImportSpecifiersByClass ?? {};
+  const customImports = Array.from(
+    /* @__PURE__ */ new Set([
+      ...prepared.attachmentsForThisClass.map((attachment) => attachment.className),
+      ...prepared.widgetInstances.map((widget) => widget.className)
+    ])
+  ).reduce((imports, localIdentifier) => {
+    const specifier = Object.values(customPomImportSpecifiersByClass).find((spec) => spec.localIdentifier === localIdentifier);
+    if (!specifier) {
+      return imports;
+    }
+    imports.push({
+      moduleSpecifier: stripExtension(toPosixRelativePath(fromAbs, specifier.absolutePath)),
+      name: specifier.exportName,
+      alias: specifier.localIdentifier !== specifier.exportName ? specifier.localIdentifier : void 0
+    });
+    return imports;
+  }, []).sort((a, b) => (a.alias ?? a.name).localeCompare(b.alias ?? b.name));
+  const generatedImports = [];
+  const importedGeneratedClasses = /* @__PURE__ */ new Set();
+  const generatedTsFilePathByComponent = options.generatedTsFilePathByComponent;
+  const addGeneratedImport = (className) => {
+    if (!generatedTsFilePathByComponent || importedGeneratedClasses.has(className) || className === componentName) {
+      return;
+    }
+    const generatedFilePath = generatedTsFilePathByComponent.get(className);
+    if (!generatedFilePath) {
+      return;
+    }
+    generatedImports.push({
+      className,
+      moduleSpecifier: stripExtension(toPosixRelativePath(fromAbs, generatedFilePath))
+    });
+    importedGeneratedClasses.add(className);
+  };
+  for (const child of prepared.componentRefsForInstances) {
+    const childName = child.endsWith(".vue") ? child.slice(0, -4) : child;
+    const childDeps = componentHierarchyMap.get(child) ?? componentHierarchyMap.get(childName);
+    if (childDeps?.dataTestIdSet.size) {
+      addGeneratedImport(childName);
+    }
+  }
+  const targetClassNames = Array.from(
+    new Set(
+      Array.from(dependencies.dataTestIdSet ?? []).map((entry) => entry.targetPageObjectModelClass).filter((target) => typeof target === "string" && target.length > 0)
+    )
+  ).sort((a, b) => a.localeCompare(b));
+  for (const targetClassName of targetClassNames) {
+    addGeneratedImport(targetClassName);
+  }
+  generatedImports.sort((a, b) => a.className.localeCompare(b.className));
+  const prefixText = `${buildFilePrefix({ eslintDisableSortImports: true })}${doc}
+`;
+  return renderSourceFile(`${prepared.className}.ts`, (sourceFile) => {
+    if (needsPlaywrightPageImport) {
+      addNamedImport(sourceFile, {
+        moduleSpecifier: "@playwright/test",
+        isTypeOnly: true,
+        namedImports: [{ name: "Page", alias: "PwPage" }]
+      });
+    }
+    addNamedImport(sourceFile, {
+      moduleSpecifier: basePageImportSpecifier,
+      namedImports: ["BasePage", "Fluent"]
+    });
+    for (const customImport of customImports) {
+      addNamedImport(sourceFile, {
+        moduleSpecifier: customImport.moduleSpecifier,
+        namedImports: [{ name: customImport.name, alias: customImport.alias }]
+      });
+    }
+    for (const generatedImport of generatedImports) {
+      addNamedImport(sourceFile, {
+        moduleSpecifier: generatedImport.moduleSpecifier,
+        namedImports: [generatedImport.className]
+      });
+    }
+    const classDeclaration = sourceFile.addClass({
+      name: prepared.className,
+      isExported: true,
+      extends: "BasePage"
+    });
+    for (const member of prepared.members) {
+      addClassMember(classDeclaration, member);
+    }
+  }, { prefixText });
 }
 function getViewPassthroughMethods(viewName, viewDependencies, childrenComponentSet, componentHierarchyMap, blockedMethodNames = /* @__PURE__ */ new Set()) {
   const existingOnView = viewDependencies.generatedMethods ?? /* @__PURE__ */ new Map();
@@ -4151,32 +4784,26 @@ function getViewPassthroughMethods(viewName, viewDependencies, childrenComponent
     }
   }
   const sorted = Array.from(methodToChildren.entries()).sort((a, b) => a[0].localeCompare(b[0]));
-  const lines = [];
-  for (const [methodName, candidates] of sorted) {
-    if (candidates.length !== 1)
-      continue;
+  const passthroughs = sorted.filter(([, candidates]) => candidates.length === 1);
+  if (!passthroughs.length) {
+    return [];
+  }
+  return passthroughs.map(([methodName, candidates]) => {
     const { childProp, params, argNames } = candidates[0];
     const callArgs = argNames.join(", ");
-    lines.push(
-      "",
-      `    async ${methodName}(${params}) {`,
-      `        return await this.${childProp}.${methodName}(${callArgs});`,
-      "    }"
-    );
-  }
-  if (!lines.length) {
-    return "";
-  }
-  return [
-    "",
-    `    // Passthrough methods composed from child component POMs of ${viewName}.`,
-    ...lines,
-    ""
-  ].join("\n");
+    return createClassMethod({
+      name: methodName,
+      isAsync: true,
+      parameters: parseParameterSignatures(params),
+      statements: [
+        `return await this.${childProp}.${methodName}(${callArgs});`
+      ]
+    });
+  });
 }
 function getAttachmentPassthroughMethods(ownerName, ownerDependencies, attachmentsForThisClass, reservedMemberNames) {
   if (!attachmentsForThisClass.some((a) => a.flatten && a.methodSignatures.size > 0)) {
-    return "";
+    return [];
   }
   const existingOnClass = ownerDependencies.generatedMethods ?? /* @__PURE__ */ new Map();
   const methodToAttachments = /* @__PURE__ */ new Map();
@@ -4198,30 +4825,22 @@ function getAttachmentPassthroughMethods(ownerName, ownerDependencies, attachmen
     }
   }
   const sorted = Array.from(methodToAttachments.entries()).sort((a, b) => a[0].localeCompare(b[0]));
-  const lines = [];
-  for (const [methodName, candidates] of sorted) {
-    if (candidates.length !== 1) {
-      continue;
-    }
+  const passthroughs = sorted.filter(([, candidates]) => candidates.length === 1);
+  if (!passthroughs.length) {
+    return [];
+  }
+  return passthroughs.map(([methodName, candidates]) => {
     const { propertyName, params, argNames } = candidates[0];
     const callArgs = argNames.join(", ");
     const invocation = callArgs ? `this.${propertyName}.${methodName}(${callArgs})` : `this.${propertyName}.${methodName}()`;
-    lines.push(
-      "",
-      `    ${methodName}(${params}) {`,
-      `        return ${invocation};`,
-      "    }"
-    );
-  }
-  if (!lines.length) {
-    return "";
-  }
-  return [
-    "",
-    `    // Passthrough methods composed from custom helper attachments of ${ownerName}.`,
-    ...lines,
-    ""
-  ].join("\n");
+    return createClassMethod({
+      name: methodName,
+      parameters: parseParameterSignatures(params),
+      statements: [
+        `return ${invocation};`
+      ]
+    });
+  });
 }
 function sliceNodeSource(source, node) {
   if (node.start == null || node.end == null) {
@@ -4305,12 +4924,292 @@ function ensureDir(dir) {
   }
   return normalized;
 }
+function resolvePluginAsset(relative) {
+  try {
+    return fileURLToPath(new URL(relative, import.meta.url));
+  } catch {
+    return path.resolve(__dirname, relative);
+  }
+}
+function readTextAsset(absPath, description) {
+  try {
+    return fs.readFileSync(absPath, "utf8");
+  } catch {
+    throw new VuePomGeneratorError(`Failed to read ${description} at ${absPath}`);
+  }
+}
+function getDefaultStubMembers() {
+  return [
+    createClassConstructor({
+      parameters: [{ name: "page", type: "PwPage" }],
+      statements: [
+        "super(page);"
+      ]
+    })
+  ];
+}
+function renderSplitStubPomContent(options) {
+  const prefixText = buildFilePrefix({
+    eslintDisableSortImports: true,
+    commentLines: [
+      `Stub POM: ${options.className}`,
+      "DO NOT MODIFY BY HAND",
+      "",
+      "This file is auto-generated by vue-pom-generator.",
+      "Changes should be made in the generator/template, not in the generated output."
+    ]
+  });
+  return renderSourceFile(`${options.className}.ts`, (sourceFile) => {
+    addNamedImport(sourceFile, {
+      moduleSpecifier: "@playwright/test",
+      isTypeOnly: true,
+      namedImports: [{ name: "Page", alias: "PwPage" }]
+    });
+    addNamedImport(sourceFile, {
+      moduleSpecifier: options.basePageImportSpecifier,
+      namedImports: ["BasePage"]
+    });
+    for (const childImport of options.childImports) {
+      addNamedImport(sourceFile, {
+        moduleSpecifier: childImport.importPath,
+        namedImports: [childImport.className]
+      });
+    }
+    sourceFile.addStatements(buildCommentBlock([
+      "Stub POM generated because it is referenced as a navigation target but",
+      "did not have any generated test ids in this build."
+    ]).trimEnd());
+    const classDeclaration = sourceFile.addClass({
+      name: options.className,
+      isExported: true,
+      extends: "BasePage"
+    });
+    for (const member of options.members) {
+      addClassMember(classDeclaration, member);
+    }
+  }, { prefixText });
+}
+function getChildImportSpecifiers(outputDir, childClassNames, generatedTsFilePathByComponent) {
+  return childClassNames.map((childClassName) => {
+    const childFilePath = generatedTsFilePathByComponent.get(childClassName);
+    if (!childFilePath) {
+      return null;
+    }
+    return {
+      className: childClassName,
+      importPath: stripExtension(toPosixRelativePath(outputDir, childFilePath))
+    };
+  }).filter((entry) => !!entry).sort((a, b) => a.className.localeCompare(b.className));
+}
+function isConstructorMember(member) {
+  return member.kind === StructureKind.Constructor;
+}
+function isGetterMember(member) {
+  return member.kind === StructureKind.GetAccessor;
+}
+function isMethodMember(member) {
+  return member.kind === StructureKind.Method;
+}
+function isPropertyMember(member) {
+  return member.kind === StructureKind.Property;
+}
+function addClassMember(classDeclaration, member) {
+  if (isConstructorMember(member)) {
+    classDeclaration.addConstructor(member);
+    return;
+  }
+  if (isGetterMember(member)) {
+    classDeclaration.addGetAccessor(member);
+    return;
+  }
+  if (isMethodMember(member)) {
+    classDeclaration.addMethod(member);
+    return;
+  }
+  if (isPropertyMember(member)) {
+    classDeclaration.addProperty(member);
+    return;
+  }
+  throw new Error(`Unsupported class member structure: ${String(member)}`);
+}
+function getRuntimeGeneratedAssetSpecs(baseDir, basePageClassPath) {
+  const runtimeDirAbs = path.join(baseDir, "_pom-runtime");
+  const runtimeClassGenAbs = path.join(runtimeDirAbs, "class-generation");
+  const runtimeClassGenSourceDir = resolvePluginAsset("../class-generation");
+  const runtimeClassGenFiles = fs.readdirSync(runtimeClassGenSourceDir).filter((file) => file.endsWith(".ts")).filter((file) => file !== "BasePage.ts" && file !== "index.ts").sort((left, right) => left.localeCompare(right));
+  return [
+    {
+      absolutePath: resolvePluginAsset("../click-instrumentation.ts"),
+      description: "click-instrumentation.ts",
+      outputPath: path.join(runtimeDirAbs, "click-instrumentation.ts")
+    },
+    ...runtimeClassGenFiles.map((file) => ({
+      absolutePath: path.join(runtimeClassGenSourceDir, file),
+      description: file,
+      outputPath: path.join(runtimeClassGenAbs, file)
+    })),
+    {
+      absolutePath: basePageClassPath,
+      description: "BasePage.ts",
+      outputPath: path.join(runtimeClassGenAbs, "BasePage.ts")
+    }
+  ];
+}
+function buildRuntimeGeneratedFiles(baseDir, basePageClassPath) {
+  return buildRuntimeGeneratedFilesFromSpecs(getRuntimeGeneratedAssetSpecs(baseDir, basePageClassPath));
+}
+function buildRuntimeGeneratedFilesFromSpecs(assetSpecs) {
+  return assetSpecs.map((spec) => ({
+    filePath: spec.outputPath,
+    content: readTextAsset(spec.absolutePath, spec.description)
+  }));
+}
+function resolveCustomPomImportResolution(generatedClassNames, projectRoot, options = {}) {
+  const importAliases = {
+    Toggle: "ToggleWidget",
+    Checkbox: "CheckboxWidget",
+    ...options.customPomImportAliases
+  };
+  const importCollisionBehavior = options.customPomImportNameCollisionBehavior ?? "error";
+  const reservedIdentifiers = /* @__PURE__ */ new Set([
+    "PwLocator",
+    "PwPage",
+    "BasePage",
+    "Fluent",
+    ...generatedClassNames
+  ]);
+  const usedImportIdentifiers = /* @__PURE__ */ new Set();
+  const classIdentifierMap = {};
+  const methodSignaturesByClass = /* @__PURE__ */ new Map();
+  const importSpecifiersByClass = {};
+  const ensureUniqueIdentifier = (base) => {
+    let candidate = base;
+    let i = 2;
+    while (reservedIdentifiers.has(candidate) || usedImportIdentifiers.has(candidate)) {
+      candidate = `${base}${i}`;
+      i++;
+    }
+    usedImportIdentifiers.add(candidate);
+    return candidate;
+  };
+  const customDirRelOrAbs = options.customPomDir ?? "tests/playwright/pom/custom";
+  const customDirAbs = path.isAbsolute(customDirRelOrAbs) ? customDirRelOrAbs : path.resolve(projectRoot, customDirRelOrAbs);
+  if (!fs.existsSync(customDirAbs)) {
+    return {
+      classIdentifierMap,
+      methodSignaturesByClass,
+      availableClassIdentifiers: /* @__PURE__ */ new Set(),
+      importSpecifiersByClass
+    };
+  }
+  const files = fs.readdirSync(customDirAbs).filter((f) => f.endsWith(".ts")).sort((a, b) => a.localeCompare(b));
+  for (const file of files) {
+    const exportName = file.replace(/\.ts$/i, "");
+    const requested = importAliases[exportName] ?? exportName;
+    const collidesWithGeneratedClass = generatedClassNames.has(requested);
+    const explicitAliasProvided = Object.prototype.hasOwnProperty.call(importAliases, exportName);
+    if (collidesWithGeneratedClass && importCollisionBehavior === "error") {
+      throw createCustomPomImportCollisionError(exportName, requested);
+    }
+    let localIdentifier = requested;
+    if (collidesWithGeneratedClass && importCollisionBehavior === "alias") {
+      const aliasBase = explicitAliasProvided ? requested : `${exportName}Custom`;
+      localIdentifier = ensureUniqueIdentifier(aliasBase);
+    } else {
+      localIdentifier = ensureUniqueIdentifier(requested);
+    }
+    const customFileAbs = path.join(customDirAbs, file);
+    classIdentifierMap[exportName] = localIdentifier;
+    importSpecifiersByClass[exportName] = {
+      exportName,
+      localIdentifier,
+      absolutePath: customFileAbs
+    };
+    const customPomMethodSignatures = extractCustomPomMethodSignatures(fs.readFileSync(customFileAbs, "utf8"), exportName);
+    if (customPomMethodSignatures.size > 0) {
+      methodSignaturesByClass.set(exportName, customPomMethodSignatures);
+    }
+  }
+  return {
+    classIdentifierMap,
+    methodSignaturesByClass,
+    availableClassIdentifiers: new Set(Object.values(classIdentifierMap)),
+    importSpecifiersByClass
+  };
+}
+function getComposedStubBody(targetClassName, availableClassNames, depsByClassName, vueFilesPathMap, projectRoot) {
+  const filePath = resolveVueSourcePath(targetClassName, vueFilesPathMap, projectRoot);
+  if (!filePath)
+    return void 0;
+  let source = "";
+  try {
+    source = fs.readFileSync(filePath, "utf8");
+  } catch {
+    return void 0;
+  }
+  const tags = getComponentClassNamesFromVueSource(source);
+  const childClassNames = Array.from(
+    new Set(
+      tags.filter((name) => availableClassNames.has(name)).filter((name) => name !== targetClassName)
+    )
+  ).sort((a, b) => a.localeCompare(b));
+  if (!childClassNames.length)
+    return void 0;
+  const methodToChildren = /* @__PURE__ */ new Map();
+  for (const child of childClassNames) {
+    const childDeps = depsByClassName.get(child);
+    const methods = childDeps?.generatedMethods;
+    if (!methods)
+      continue;
+    for (const [name, sig] of methods.entries()) {
+      if (!sig)
+        continue;
+      const list = methodToChildren.get(name) ?? [];
+      list.push({ child, params: sig.params, argNames: sig.argNames });
+      methodToChildren.set(name, list);
+    }
+  }
+  const passthroughMembers = [];
+  for (const [methodName, candidatesForMethod] of methodToChildren.entries()) {
+    if (candidatesForMethod.length !== 1 || methodName === "constructor")
+      continue;
+    const { child, params, argNames } = candidatesForMethod[0];
+    const callArgs = argNames.join(", ");
+    passthroughMembers.push(createClassMethod({
+      name: methodName,
+      isAsync: true,
+      parameters: parseParameterSignatures(params),
+      statements: [
+        `return await this.${child}.${methodName}(${callArgs});`
+      ]
+    }));
+  }
+  return {
+    childClassNames,
+    members: [
+      ...childClassNames.map((childClassName) => createClassProperty({
+        name: childClassName,
+        type: childClassName
+      })),
+      createClassConstructor({
+        parameters: [{ name: "page", type: "PwPage" }],
+        statements: (writer) => {
+          writer.writeLine("super(page);");
+          for (const childClassName of childClassNames) {
+            writer.writeLine(`this.${childClassName} = new ${childClassName}(page);`);
+          }
+        }
+      }),
+      ...passthroughMembers
+    ]
+  };
+}
 async function generateAggregatedFiles(componentHierarchyMap, vueFilesPathMap, basePageClassPath, outDir, options = {}) {
   const projectRoot = options.projectRoot ?? process.cwd();
   const entries = Array.from(componentHierarchyMap.entries()).sort((a, b) => a[0].localeCompare(b[0]));
   const views = entries.filter(([, d]) => d.isView);
   const components = entries.filter(([, d]) => !d.isView);
-  const makeAggregatedContent = (header2, outputDir, items) => {
+  const makeAggregatedContent = (outputDir, items) => {
     const imports = [];
     const generatedClassNames = new Set(items.map(([name]) => name));
     if (!basePageClassPath) {
@@ -4325,84 +5224,22 @@ async function generateAggregatedFiles(componentHierarchyMap, vueFilesPathMap, b
     imports.push(`export * from "${runtimeClassGenRel}/playwright-types";`);
     imports.push(`export * from "${runtimeClassGenRel}/Pointer";`);
     imports.push(`export * from "${runtimeClassGenRel}/BasePage";`);
-    const addCustomPomImports = () => {
-      const importAliases = {
-        Toggle: "ToggleWidget",
-        Checkbox: "CheckboxWidget",
-        ...options.customPomImportAliases
-      };
-      const importCollisionBehavior = options.customPomImportNameCollisionBehavior ?? "error";
-      const reservedIdentifiers = /* @__PURE__ */ new Set([
-        "PwLocator",
-        "PwPage",
-        "BasePage",
-        "Fluent",
-        ...generatedClassNames
-      ]);
-      const usedImportIdentifiers = /* @__PURE__ */ new Set();
-      const customPomClassIdentifierMap2 = {};
-      const customPomMethodSignaturesByClass2 = /* @__PURE__ */ new Map();
-      const ensureUniqueIdentifier = (base2) => {
-        let candidate = base2;
-        let i = 2;
-        while (reservedIdentifiers.has(candidate) || usedImportIdentifiers.has(candidate)) {
-          candidate = `${base2}${i}`;
-          i++;
-        }
-        usedImportIdentifiers.add(candidate);
-        return candidate;
-      };
-      const customDirRelOrAbs = options.customPomDir ?? "tests/playwright/pom/custom";
-      const customDirAbs = path.isAbsolute(customDirRelOrAbs) ? customDirRelOrAbs : path.resolve(projectRoot, customDirRelOrAbs);
-      if (!fs.existsSync(customDirAbs)) {
-        return {
-          classIdentifierMap: customPomClassIdentifierMap2,
-          methodSignaturesByClass: customPomMethodSignaturesByClass2
-        };
-      }
-      const files = fs.readdirSync(customDirAbs).filter((f) => f.endsWith(".ts")).sort((a, b) => a.localeCompare(b));
-      for (const file of files) {
-        const exportName = file.replace(/\.ts$/i, "");
-        const requested = importAliases[exportName] ?? exportName;
-        const collidesWithGeneratedClass = generatedClassNames.has(requested);
-        const explicitAliasProvided = Object.prototype.hasOwnProperty.call(importAliases, exportName);
-        if (collidesWithGeneratedClass && importCollisionBehavior === "error") {
-          throw new Error(
-            `[vue-pom-generator] Custom POM import name collision detected for "${exportName}".
-The identifier "${requested}" conflicts with a generated POM class.
-Fix by setting generation.playwright.customPoms.importAliases["${exportName}"] to a unique name, or set generation.playwright.customPoms.importNameCollisionBehavior = "alias" to auto-alias collisions.`
-          );
-        }
-        let localIdentifier = requested;
-        if (collidesWithGeneratedClass && importCollisionBehavior === "alias") {
-          const aliasBase = explicitAliasProvided ? requested : `${exportName}Custom`;
-          localIdentifier = ensureUniqueIdentifier(aliasBase);
-        } else {
-          localIdentifier = ensureUniqueIdentifier(requested);
-        }
-        const customFileAbs = path.join(customDirAbs, file);
-        customPomClassIdentifierMap2[exportName] = localIdentifier;
-        const customPomMethodSignatures = extractCustomPomMethodSignatures(fs.readFileSync(customFileAbs, "utf8"), exportName);
-        if (customPomMethodSignatures.size > 0) {
-          customPomMethodSignaturesByClass2.set(exportName, customPomMethodSignatures);
-        }
-        const fromOutputDir = outputDir;
-        const importPath = stripExtension(toPosixRelativePath(fromOutputDir, customFileAbs));
-        if (localIdentifier !== exportName) {
-          imports.push(`import { ${exportName} as ${localIdentifier} } from "${importPath}";`);
-        } else {
-          imports.push(`import { ${exportName} } from "${importPath}";`);
-        }
+    const customPomImportResolution = resolveCustomPomImportResolution(generatedClassNames, projectRoot, {
+      customPomDir: options.customPomDir,
+      customPomImportAliases: options.customPomImportAliases,
+      customPomImportNameCollisionBehavior: options.customPomImportNameCollisionBehavior
+    });
+    const customPomClassIdentifierMap = customPomImportResolution.classIdentifierMap;
+    const customPomMethodSignaturesByClass = customPomImportResolution.methodSignaturesByClass;
+    const customPomAvailableClassIdentifiers = customPomImportResolution.availableClassIdentifiers;
+    for (const importSpecifier of Object.values(customPomImportResolution.importSpecifiersByClass).sort((left, right) => left.exportName.localeCompare(right.exportName))) {
+      const importPath = stripExtension(toPosixRelativePath(outputDir, importSpecifier.absolutePath));
+      if (importSpecifier.localIdentifier !== importSpecifier.exportName) {
+        imports.push(`import { ${importSpecifier.exportName} as ${importSpecifier.localIdentifier} } from "${importPath}";`);
+        continue;
       }
-      return {
-        classIdentifierMap: customPomClassIdentifierMap2,
-        methodSignaturesByClass: customPomMethodSignaturesByClass2
-      };
-    };
-    const customPomImportResolution = addCustomPomImports();
-    const customPomClassIdentifierMap = customPomImportResolution?.classIdentifierMap ?? {};
-    const customPomMethodSignaturesByClass = customPomImportResolution?.methodSignaturesByClass ?? /* @__PURE__ */ new Map();
-    const customPomAvailableClassIdentifiers = new Set(Object.values(customPomClassIdentifierMap));
+      imports.push(`import { ${importSpecifier.exportName} } from "${importPath}";`);
+    }
     const referencedTargets = /* @__PURE__ */ new Set();
     for (const [, deps] of items) {
       for (const dt of deps.dataTestIdSet) {
@@ -4414,145 +5251,18 @@ Fix by setting generation.playwright.customPoms.importAliases["${exportName}"] t
     const stubTargets = Array.from(referencedTargets).filter((t) => !generatedClassNames.has(t)).sort((a, b) => a.localeCompare(b));
     const availableClassNames = /* @__PURE__ */ new Set([...generatedClassNames, ...stubTargets]);
     const depsByClassName = new Map(entries);
-    const scanPascalCaseTags = (template) => {
-      const names = [];
-      const len = template.length;
-      let i = 0;
-      while (i < len) {
-        const ch = template[i];
-        if (ch !== "<") {
-          i++;
-          continue;
-        }
-        i++;
-        if (i >= len)
-          break;
-        if (template[i] === "/" || template[i] === "!" || template[i] === "?") {
-          i++;
-          continue;
-        }
-        while (i < len && (template[i] === " " || template[i] === "\n" || template[i] === "	" || template[i] === "\r")) i++;
-        if (i >= len)
-          break;
-        const first = template[i];
-        if (first < "A" || first > "Z") {
-          continue;
-        }
-        const start = i;
-        i++;
-        while (i < len) {
-          const c = template[i];
-          const isLetter = c >= "A" && c <= "Z" || c >= "a" && c <= "z";
-          const isDigit = c >= "0" && c <= "9";
-          const isUnderscore = c === "_";
-          if (isLetter || isDigit || isUnderscore) {
-            i++;
-            continue;
-          }
-          break;
-        }
-        const name = template.slice(start, i);
-        if (name)
-          names.push(name);
-      }
-      return Array.from(new Set(names));
-    };
-    const getComposedStubBody = (targetClassName) => {
-      const mapped = vueFilesPathMap.get(targetClassName);
-      const candidates = [
-        mapped,
-        path.join(projectRoot, "src", "views", `${targetClassName}.vue`),
-        path.join(projectRoot, "src", "components", `${targetClassName}.vue`)
-      ].filter((p) => typeof p === "string" && p.length > 0);
-      const filePath = candidates.find((p) => fs.existsSync(p));
-      if (!filePath)
-        return void 0;
-      let source = "";
-      try {
-        source = fs.readFileSync(filePath, "utf8");
-      } catch {
-        return void 0;
-      }
-      const templateOpen = source.indexOf("<template");
-      const templateClose = source.lastIndexOf("</template>");
-      if (templateOpen === -1 || templateClose === -1 || templateClose <= templateOpen)
-        return void 0;
-      const afterOpenTag = source.indexOf(">", templateOpen);
-      if (afterOpenTag === -1 || afterOpenTag >= templateClose)
-        return void 0;
-      const template = source.slice(afterOpenTag + 1, templateClose);
-      if (!template)
-        return void 0;
-      const tags = scanPascalCaseTags(template);
-      const childClassNames = Array.from(
-        new Set(
-          tags.filter((name) => availableClassNames.has(name)).filter((name) => name !== targetClassName)
-        )
-      ).sort((a, b) => a.localeCompare(b));
-      if (!childClassNames.length)
-        return void 0;
-      const methodToChildren = /* @__PURE__ */ new Map();
-      for (const child of childClassNames) {
-        const childDeps = depsByClassName.get(child);
-        const methods = childDeps?.generatedMethods;
-        if (!methods)
-          continue;
-        for (const [name, sig] of methods.entries()) {
-          if (!sig)
-            continue;
-          const list = methodToChildren.get(name) ?? [];
-          list.push({ child, params: sig.params, argNames: sig.argNames });
-          methodToChildren.set(name, list);
-        }
-      }
-      const passthroughLines = [];
-      for (const [methodName, candidatesForMethod] of methodToChildren.entries()) {
-        if (candidatesForMethod.length !== 1)
-          continue;
-        if (methodName === "constructor")
-          continue;
-        const { child, params, argNames } = candidatesForMethod[0];
-        const callArgs = argNames.join(", ");
-        passthroughLines.push(
-          "",
-          `    async ${methodName}(${params}) {`,
-          `        return await this.${child}.${methodName}(${callArgs});`,
-          "    }"
-        );
-      }
-      return {
-        childClassNames,
-        lines: [
-          ...childClassNames.map((c) => `    ${c}: ${c};`),
-          "",
-          "    constructor(page: PwPage) {",
-          "        super(page);",
-          ...childClassNames.map((c) => `        this.${c} = new ${c}(page);`),
-          "    }",
-          ...passthroughLines
-        ]
-      };
-    };
     const stubs = stubTargets.map(
       (t) => (() => {
-        const composed = getComposedStubBody(t);
-        const body = composed?.lines ?? [
-          "    constructor(page: PwPage) {",
-          "        super(page);",
-          "    }"
-        ];
-        return [
-          "/**\n * Stub POM generated because it is referenced as a navigation target but\n * did not have any generated test ids in this build.\n */",
-          `export class ${t} extends BasePage {`,
-          ...body,
-          "}"
-        ].join("\n");
+        const composed = getComposedStubBody(t, availableClassNames, depsByClassName, vueFilesPathMap, projectRoot);
+        return {
+          className: t,
+          members: composed?.members ?? getDefaultStubMembers(),
+          isStub: true
+        };
       })()
     );
-    const classes = items.map(
-      ([name, deps]) => generateViewObjectModelContent(name, deps, componentHierarchyMap, vueFilesPathMap, basePageClassPath, {
-        outputDir,
-        aggregated: true,
+    const classes = items.map(([name, deps]) => {
+      const prepared = prepareViewObjectModelClass(name, deps, componentHierarchyMap, {
         customPomAttachments: options.customPomAttachments ?? [],
         customPomClassIdentifierMap,
         customPomAvailableClassIdentifiers,
@@ -4560,67 +5270,70 @@ Fix by setting generation.playwright.customPoms.importAliases["${exportName}"] t
         testIdAttribute: options.testIdAttribute,
         vueRouterFluentChaining: options.vueRouterFluentChaining,
         routeMetaByComponent: options.routeMetaByComponent
-      })
-    );
-    const baseContent = [
-      header2,
-      ...imports,
-      ...classes,
-      ...stubs.length ? ["", ...stubs] : []
-    ].filter(Boolean).join("\n\n");
-    return baseContent;
+      });
+      const sourceRel = toPosixRelativePath(outputDir, deps.filePath);
+      const kind = deps.isView ? "Page" : "Component";
+      return {
+        className: prepared.className,
+        doc: `/** ${kind} POM: ${name} (source: ${sourceRel}) */`,
+        members: prepared.members,
+        isStub: false
+      };
+    });
+    const prefixText = buildFilePrefix({
+      referenceLib: "es2015",
+      eslintDisableSortImports: true,
+      commentLines: [
+        "Aggregated generated POMs",
+        "DO NOT MODIFY BY HAND",
+        "",
+        "This file is auto-generated by vue-pom-generator.",
+        "Changes should be made in the generator/template, not in the generated output."
+      ]
+    });
+    return renderSourceFile("page-object-models.g.ts", (sourceFile) => {
+      for (const line of imports) {
+        sourceFile.addStatements(line);
+      }
+      for (const entry of [...classes, ...stubs]) {
+        if (entry.isStub) {
+          sourceFile.addStatements(buildCommentBlock([
+            "Stub POM generated because it is referenced as a navigation target but",
+            "did not have any generated test ids in this build."
+          ]).trimEnd());
+        } else {
+          sourceFile.addStatements(entry.doc);
+        }
+        const classDeclaration = sourceFile.addClass({
+          name: entry.className,
+          isExported: true,
+          extends: "BasePage"
+        });
+        for (const member of entry.members) {
+          addClassMember(classDeclaration, member);
+        }
+      }
+    }, { prefixText });
   };
   const base = ensureDir(outDir);
   const outputFile = path.join(base, "page-object-models.g.ts");
-  const header = `/// <reference lib="es2015" />
-${eslintSuppressionHeader}/**
- * Aggregated generated POMs
-${AUTO_GENERATED_COMMENT}`;
-  const content = makeAggregatedContent(header, path.dirname(outputFile), [...views, ...components]);
+  const content = makeAggregatedContent(path.dirname(outputFile), [...views, ...components]);
   const indexFile = path.join(base, "index.ts");
-  const indexContent = `${eslintSuppressionHeader}/**
- * POM exports
-${AUTO_GENERATED_COMMENT}
-
-export * from "./page-object-models.g";
-`;
-  const runtimeDirAbs = path.join(base, "_pom-runtime");
-  const runtimeClassGenAbs = path.join(runtimeDirAbs, "class-generation");
-  const readText = (absPath, description) => {
-    try {
-      return fs.readFileSync(absPath, "utf8");
-    } catch {
-      throw new Error(`Failed to read ${description} at ${absPath}`);
-    }
-  };
-  const resolvePluginAsset = (relative) => {
-    try {
-      return fileURLToPath(new URL(relative, import.meta.url));
-    } catch {
-      return path.resolve(__dirname, relative);
-    }
-  };
-  const clickInstrumentationAbs = resolvePluginAsset("../click-instrumentation.ts");
-  const pointerAbs = resolvePluginAsset("../class-generation/Pointer.ts");
-  const playwrightTypesAbs = resolvePluginAsset("../class-generation/playwright-types.ts");
-  const runtimeFiles = [
-    {
-      filePath: path.join(runtimeDirAbs, "click-instrumentation.ts"),
-      content: readText(clickInstrumentationAbs, "click-instrumentation.ts")
-    },
-    {
-      filePath: path.join(runtimeClassGenAbs, "Pointer.ts"),
-      content: readText(pointerAbs, "Pointer.ts")
-    },
-    {
-      filePath: path.join(runtimeClassGenAbs, "playwright-types.ts"),
-      content: readText(playwrightTypesAbs, "playwright-types.ts")
-    },
-    {
-      filePath: path.join(runtimeClassGenAbs, "BasePage.ts"),
-      content: readText(basePageClassPath, "BasePage.ts")
-    }
-  ];
+  const indexContent = renderSourceFile("index.ts", (sourceFile) => {
+    addExportAll(sourceFile, "./page-object-models.g");
+  }, {
+    prefixText: buildFilePrefix({
+      eslintDisableSortImports: true,
+      commentLines: [
+        "POM exports",
+        "DO NOT MODIFY BY HAND",
+        "",
+        "This file is auto-generated by vue-pom-generator.",
+        "Changes should be made in the generator/template, not in the generated output."
+      ]
+    })
+  });
+  const runtimeFiles = buildRuntimeGeneratedFiles(base, basePageClassPath);
   return [
     { filePath: outputFile, content },
     { filePath: indexFile, content: indexContent },
@@ -4710,48 +5423,50 @@ function getWidgetInstancesForView(componentName, dataTestIdSet, availableClassI
   return out;
 }
 function getComponentInstances(childrenComponent, componentHierarchyMap, attachmentsForThisView = [], widgetInstances = []) {
-  let content = "\n";
+  const declarations = [];
   for (const a of attachmentsForThisView) {
-    content += `    ${a.propertyName}: ${a.className};
-`;
+    declarations.push(createClassProperty({
+      name: a.propertyName,
+      type: a.className
+    }));
   }
   for (const w of widgetInstances) {
-    content += `    ${w.propertyName}: ${w.className};
-`;
+    declarations.push(createClassProperty({
+      name: w.propertyName,
+      type: w.className
+    }));
   }
   childrenComponent.forEach((child) => {
     if (componentHierarchyMap.has(child) && componentHierarchyMap.get(child)?.dataTestIdSet.size) {
       const childName = child.split(".vue")[0];
-      content += `    ${childName}: ${childName};
-`;
+      declarations.push(createClassProperty({
+        name: childName,
+        type: childName
+      }));
     }
   });
-  return `${content}
-`;
+  return declarations;
 }
 function getConstructor(childrenComponent, componentHierarchyMap, attachmentsForThisView = [], widgetInstances = [], options) {
-  let content = "    constructor(page: PwPage) {\n";
   const attr = (options?.testIdAttribute ?? "data-testid").trim() || "data-testid";
-  content += `        super(page, { testIdAttribute: ${JSON.stringify(attr)} });
-`;
-  for (const a of attachmentsForThisView) {
-    content += `        this.${a.propertyName} = new ${a.className}(page, this);
-`;
-  }
-  for (const w of widgetInstances) {
-    content += `        this.${w.propertyName} = new ${w.className}(page, ${JSON.stringify(w.testId)});
-`;
-  }
-  childrenComponent.forEach((child) => {
-    if (componentHierarchyMap.has(child) && componentHierarchyMap.get(child)?.dataTestIdSet.size) {
-      const childName = child.split(".vue")[0];
-      content += `        this.${childName} = new ${childName}(page);
-`;
+  return createClassConstructor({
+    parameters: [{ name: "page", type: "PwPage" }],
+    statements: (writer) => {
+      writer.writeLine(`super(page, { testIdAttribute: ${JSON.stringify(attr)} });`);
+      for (const a of attachmentsForThisView) {
+        writer.writeLine(`this.${a.propertyName} = new ${a.className}(page, this);`);
+      }
+      for (const w of widgetInstances) {
+        writer.writeLine(`this.${w.propertyName} = new ${w.className}(page, ${JSON.stringify(w.testId)});`);
+      }
+      childrenComponent.forEach((child) => {
+        if (componentHierarchyMap.has(child) && componentHierarchyMap.get(child)?.dataTestIdSet.size) {
+          const childName = child.split(".vue")[0];
+          writer.writeLine(`this.${childName} = new ${childName}(page);`);
+        }
+      });
     }
   });
-  content += "    }";
-  return `${content}
-`;
 }
 const TESTID_CLICK_EVENT_NAME = "__testid_event__";
 const TESTID_CLICK_EVENT_STRICT_FLAG = "__testid_click_event_strict__";
@@ -5886,6 +6601,7 @@ function createBuildProcessorPlugin(options) {
     normalizedBasePagePath,
     outDir,
     emitLanguages,
+    typescriptOutputStructure,
     csharp,
     generateFixtures,
     customPomAttachments,
@@ -6090,6 +6806,7 @@ function createBuildProcessorPlugin(options) {
       await generateFiles(componentHierarchyMap, vueFilesPathMap, normalizedBasePagePath, {
         outDir,
         emitLanguages,
+        typescriptOutputStructure,
         csharp,
         generateFixtures,
         customPomAttachments,
@@ -6124,6 +6841,7 @@ function createDevProcessorPlugin(options) {
     basePageClassPath,
     outDir,
     emitLanguages,
+    typescriptOutputStructure,
     csharp,
     generateFixtures,
     customPomAttachments,
@@ -6337,6 +7055,7 @@ function createDevProcessorPlugin(options) {
         generateFiles(snapshotHierarchy, snapshotVuePathMap, normalizedBasePagePath, {
           outDir,
           emitLanguages,
+          typescriptOutputStructure,
           csharp,
           generateFixtures,
           customPomAttachments,
@@ -6510,14 +7229,37 @@ function createDevProcessorPlugin(options) {
   };
 }
 function generateTestIdsModule(componentTestIds) {
-  const manifestEntries = Array.from(componentTestIds.entries()).sort((a, b) => a[0].localeCompare(b[0])).map(([c, set]) => `  ${JSON.stringify(c)}: ${JSON.stringify(Array.from(set).sort())}`).join(",\n");
-  return `// Virtual module: test id manifest
-export const testIdManifest = {
-${manifestEntries}
-} as const;
-export type TestIdManifest = typeof testIdManifest;
-export type ComponentName = keyof TestIdManifest;
-`;
+  const manifestEntries = Array.from(componentTestIds.entries()).sort((a, b) => a[0].localeCompare(b[0]));
+  return renderSourceFile("virtual-testids.ts", (sourceFile) => {
+    sourceFile.addStatements("// Virtual module: test id manifest");
+    sourceFile.addVariableStatement({
+      declarationKind: VariableDeclarationKind.Const,
+      isExported: true,
+      declarations: [{
+        name: "testIdManifest",
+        initializer: (writer) => {
+          writer.write("{").newLine();
+          writer.indent(() => {
+            manifestEntries.forEach(([componentName, testIds], index) => {
+              const suffix = index === manifestEntries.length - 1 ? "" : ",";
+              writer.writeLine(`${JSON.stringify(componentName)}: ${JSON.stringify(Array.from(testIds).sort())}${suffix}`);
+            });
+          });
+          writer.write("} as const");
+        }
+      }]
+    });
+    sourceFile.addTypeAlias({
+      isExported: true,
+      name: "TestIdManifest",
+      type: "typeof testIdManifest"
+    });
+    sourceFile.addTypeAlias({
+      isExported: true,
+      name: "ComponentName",
+      type: "keyof TestIdManifest"
+    });
+  });
 }
 function createTestIdsVirtualModulesPlugin(componentTestIds) {
   const maybeModule = virtualImport;
@@ -6541,6 +7283,7 @@ function createSupportPlugins(options) {
     existingIdBehavior,
     outDir,
     emitLanguages,
+    typescriptOutputStructure,
     csharp,
     routerAwarePoms,
     routerEntry,
@@ -6584,6 +7327,7 @@ function createSupportPlugins(options) {
     normalizedBasePagePath,
     outDir,
     emitLanguages,
+    typescriptOutputStructure,
     csharp,
     generateFixtures,
     customPomAttachments,
@@ -6615,6 +7359,7 @@ function createSupportPlugins(options) {
     basePageClassPath,
     outDir,
     emitLanguages,
+    typescriptOutputStructure,
     csharp,
     generateFixtures,
     customPomAttachments,
@@ -7166,6 +7911,7 @@ function createVuePomGeneratorPlugins(options = {}) {
   const csharp = generationOptions?.csharp;
   const errorBehavior = options.errorBehavior;
   const missingSemanticNameBehavior = resolveMissingSemanticNameBehavior(errorBehavior);
+  const typescriptOutputStructure = generationOptions?.playwright?.outputStructure ?? "aggregated";
   const generateFixtures = generationOptions?.playwright?.fixtures;
   const customPoms = generationOptions?.playwright?.customPoms;
   const resolvedCustomPomAttachments = customPoms?.attachments ?? [];
@@ -7200,6 +7946,7 @@ function createVuePomGeneratorPlugins(options = {}) {
       assertErrorBehavior(errorBehavior, "[vue-pom-generator] errorBehavior");
       if (generationEnabled) {
         assertNonEmptyString(outDir, "[vue-pom-generator] generation.outDir");
+        assertOneOf(typescriptOutputStructure, ["aggregated", "split"], "[vue-pom-generator] generation.playwright.outputStructure");
         assertRouterModuleShims(routerModuleShims, "[vue-pom-generator] generation.router.moduleShims");
         if (generationOptions?.router && routerType === "vue-router") {
           assertNonEmptyString(routerEntry, "[vue-pom-generator] generation.router.entry");
@@ -7247,6 +7994,7 @@ function createVuePomGeneratorPlugins(options = {}) {
     existingIdBehavior,
     outDir,
     emitLanguages,
+    typescriptOutputStructure,
     csharp,
     routerAwarePoms,
     routerEntry,