@tontoko/fast-playwright-mcp 0.0.4

package/lib/utils/common-formatters.js

@@ -0,0 +1,252 @@
+import { createRequire } from "node:module";
+var __create = Object.create;
+var __getProtoOf = Object.getPrototypeOf;
+var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __toESM = (mod, isNodeMode, target) => {
+  target = mod != null ? __create(__getProtoOf(mod)) : {};
+  const to = isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target;
+  for (let key of __getOwnPropNames(mod))
+    if (!__hasOwnProp.call(to, key))
+      __defProp(to, key, {
+        get: () => mod[key],
+        enumerable: true
+      });
+  return to;
+};
+var __require = /* @__PURE__ */ createRequire(import.meta.url);
+
+// src/utils/common-formatters.ts
+import debug from "debug";
+var formattersDebug = debug("pw:mcp:formatters");
+function formatPerformanceMetric(name, value, unit, threshold) {
+  const icon = threshold && value > threshold ? "⚠️" : "✅";
+  const thresholdText = threshold ? ` (threshold: ${threshold}${unit})` : "";
+  return `${icon} **${name}**: ${value}${unit}${thresholdText}`;
+}
+function formatConfidence(confidence) {
+  return `${Math.round(confidence * 100)}%`;
+}
+function formatExecutionTime(ms) {
+  if (ms < 1000) {
+    return `${Math.round(ms)}ms`;
+  }
+  if (ms < 60000) {
+    return `${(ms / 1000).toFixed(1)}s`;
+  }
+  const minutes = Math.floor(ms / 60000);
+  const seconds = Math.round(ms % 60000 / 1000);
+  return `${minutes}m ${seconds}s`;
+}
+function getPerformanceIcon(input) {
+  if ("significance" in input) {
+    switch (input.significance) {
+      case "significant":
+        return "\uD83D\uDD34";
+      case "notable":
+        return "\uD83D\uDFE1";
+      default:
+        return "\uD83D\uDFE2";
+    }
+  }
+  const { value, thresholds } = input;
+  if (value <= thresholds.good) {
+    return "\uD83D\uDFE2";
+  }
+  if (value <= thresholds.warning) {
+    return "\uD83D\uDFE1";
+  }
+  return "\uD83D\uDD34";
+}
+function getImpactIcon(impact) {
+  switch (impact) {
+    case "high":
+      return "\uD83D\uDD34";
+    case "medium":
+      return "\uD83D\uDFE1";
+    case "low":
+      return "\uD83D\uDFE2";
+    default:
+      return "⚪";
+  }
+}
+function getRecommendationIcon(type) {
+  switch (type) {
+    case "warning":
+      return "⚠️";
+    case "optimization":
+      return "⚡";
+    default:
+      return "ℹ️";
+  }
+}
+function formatDiagnosticPair(key, value) {
+  let formattedValue;
+  if (typeof value === "boolean") {
+    formattedValue = value ? "Yes" : "No";
+  } else {
+    formattedValue = value.toString();
+  }
+  return `- **${key}:** ${formattedValue}`;
+}
+function buildSection(title, content, level = 2, options = {}) {
+  const { emptyLineAfter = false, emptyLineBefore = true } = options;
+  const prefix = "#".repeat(level);
+  const result = [];
+  if (emptyLineBefore) {
+    result.push("");
+  }
+  result.push(`${prefix} ${title}`, ...content);
+  if (emptyLineAfter) {
+    result.push("");
+  }
+  return result;
+}
+function addConditional(array, condition, items) {
+  if (condition) {
+    if (Array.isArray(items)) {
+      array.push(...items);
+    } else {
+      array.push(items);
+    }
+  }
+}
+function generateMouseMoveCode(x, y) {
+  return `await page.mouse.move(${x}, ${y});`;
+}
+function generateMouseClickCode() {
+  return ["await page.mouse.down();", "await page.mouse.up();"];
+}
+function generateMouseDragCode(startX, startY, endX, endY) {
+  return [
+    `// Drag mouse from (${startX}, ${startY}) to (${endX}, ${endY})`,
+    generateMouseMoveCode(startX, startY),
+    "await page.mouse.down();",
+    generateMouseMoveCode(endX, endY),
+    "await page.mouse.up();"
+  ];
+}
+function generateNavigationCode(url) {
+  return `await page.goto('${url}');`;
+}
+function generateBackCode() {
+  return "await page.goBack();";
+}
+function generateForwardCode() {
+  return "await page.goForward();";
+}
+function generateKeyPressCode(key) {
+  return `await page.keyboard.press('${key}');`;
+}
+function generateEvaluationCode(functionCode) {
+  return `await page.evaluate(${quote(functionCode)});`;
+}
+function generateLocatorEvaluationCode(locator, functionCode) {
+  return `await page.${locator}.evaluate(${quote(functionCode)});`;
+}
+function quote(str) {
+  return `'${str.replace(/'/g, "\\'")}'`;
+}
+function getErrorMessage(error, fallback = "Unknown error") {
+  if (error instanceof Error) {
+    return error.message;
+  }
+  return fallback;
+}
+function createDiagnosticErrorInfo(error, operation = "Unknown operation", component = "Unknown component") {
+  return {
+    error: getErrorMessage(error),
+    operation,
+    component
+  };
+}
+function handleResourceDisposalError(error, resourceType, logger = formattersDebug) {
+  logger(`${resourceType} disposal failed: ${getErrorMessage(error)}`);
+}
+function handleFrameAccessError(error, frameInfo) {
+  return {
+    reason: getErrorMessage(error, "Access denied"),
+    ...frameInfo && { frameInfo }
+  };
+}
+function formatStatusString(text, status, iconType, additionalText) {
+  let icon;
+  switch (iconType) {
+    case "performance":
+      if (["significant", "notable", "minimal", "normal"].includes(status)) {
+        icon = getPerformanceIcon({
+          significance: status
+        });
+      } else {
+        icon = getPerformanceIcon({ significance: "normal" });
+      }
+      break;
+    case "impact":
+      icon = getImpactIcon(status);
+      break;
+    case "recommendation":
+      icon = getRecommendationIcon(status);
+      break;
+    default:
+      icon = "⚪";
+  }
+  const formattedText = additionalText ? `${text} ${additionalText}` : text;
+  return `  ${icon} ${formattedText}`;
+}
+function formatPerformanceComparison(component, expected, actual, deviation) {
+  const significance = deviation?.significance ?? "normal";
+  const icon = getPerformanceIcon({
+    significance
+  });
+  let deviationText = "";
+  if (deviation) {
+    const sign = deviation.percent > 0 ? "+" : "";
+    deviationText = ` (${sign}${deviation.percent}% ${deviation.significance})`;
+  }
+  return `  ${icon} **${component}**: Expected ${expected}ms, Actual ${actual.toFixed(0)}ms${deviationText}`;
+}
+function formatMetricName(key, nameMap) {
+  const defaultNameMap = {
+    domContentLoaded: "DOM Content Loaded",
+    loadComplete: "Load Complete",
+    firstPaint: "First Paint",
+    firstContentfulPaint: "First Contentful Paint"
+  };
+  const combinedMap = { ...defaultNameMap, ...nameMap };
+  return combinedMap[key] || key;
+}
+function processBrowserMetrics(browserMetrics, nameMap) {
+  return Object.entries(browserMetrics).filter(([_, value]) => typeof value === "number" && value > 0).map(([key, value]) => [
+    formatMetricName(key, nameMap),
+    `${value.toFixed(2)}ms`
+  ]);
+}
+export {
+  processBrowserMetrics,
+  handleResourceDisposalError,
+  handleFrameAccessError,
+  getRecommendationIcon,
+  getPerformanceIcon,
+  getImpactIcon,
+  getErrorMessage,
+  generateNavigationCode,
+  generateMouseMoveCode,
+  generateMouseDragCode,
+  generateMouseClickCode,
+  generateLocatorEvaluationCode,
+  generateKeyPressCode,
+  generateForwardCode,
+  generateEvaluationCode,
+  generateBackCode,
+  formatStatusString,
+  formatPerformanceMetric,
+  formatPerformanceComparison,
+  formatMetricName,
+  formatExecutionTime,
+  formatDiagnosticPair,
+  formatConfidence,
+  createDiagnosticErrorInfo,
+  buildSection,
+  addConditional
+};

package/lib/utils/console-filter.js

@@ -0,0 +1,64 @@
+import { createRequire } from "node:module";
+var __create = Object.create;
+var __getProtoOf = Object.getPrototypeOf;
+var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __toESM = (mod, isNodeMode, target) => {
+  target = mod != null ? __create(__getProtoOf(mod)) : {};
+  const to = isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target;
+  for (let key of __getOwnPropNames(mod))
+    if (!__hasOwnProp.call(to, key))
+      __defProp(to, key, {
+        get: () => mod[key],
+        enumerable: true
+      });
+  return to;
+};
+var __require = /* @__PURE__ */ createRequire(import.meta.url);
+
+// src/utils/console-filter.ts
+function filterConsoleMessages(messages, options) {
+  if (!options) {
+    return messages;
+  }
+  let filtered = messages;
+  if (options.levels && options.levels.length > 0) {
+    filtered = filtered.filter((msg) => {
+      const level = msg.type ?? "log";
+      return options.levels?.includes(level);
+    });
+  }
+  if (options.patterns && options.patterns.length > 0) {
+    filtered = filtered.filter((msg) => {
+      const text = msg.toString();
+      return options.patterns?.some((pattern) => {
+        try {
+          const regex = new RegExp(pattern, "i");
+          return regex.test(text);
+        } catch {
+          return text.includes(pattern);
+        }
+      });
+    });
+  }
+  if (options.removeDuplicates) {
+    const seen = new Set;
+    filtered = filtered.filter((msg) => {
+      const key = `${msg.type ?? "log"}:${msg.toString()}`;
+      if (seen.has(key)) {
+        return false;
+      }
+      seen.add(key);
+      return true;
+    });
+  }
+  const maxMessages = options.maxMessages ?? 10;
+  if (filtered.length > maxMessages) {
+    filtered = filtered.slice(-maxMessages);
+  }
+  return filtered;
+}
+export {
+  filterConsoleMessages
+};

package/lib/utils/diagnostic-report-utils.js

@@ -0,0 +1,178 @@
+import { createRequire } from "node:module";
+var __create = Object.create;
+var __getProtoOf = Object.getPrototypeOf;
+var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __toESM = (mod, isNodeMode, target) => {
+  target = mod != null ? __create(__getProtoOf(mod)) : {};
+  const to = isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target;
+  for (let key of __getOwnPropNames(mod))
+    if (!__hasOwnProp.call(to, key))
+      __defProp(to, key, {
+        get: () => mod[key],
+        enumerable: true
+      });
+  return to;
+};
+var __require = /* @__PURE__ */ createRequire(import.meta.url);
+
+// src/utils/diagnostic-report-utils.ts
+import { getErrorMessage } from "./common-formatters.js";
+function addKeyValuePairs(builder, configs) {
+  let currentBuilder = builder;
+  for (const config of configs) {
+    const formattedValue = config.formatter ? config.formatter(config.value) : formatValue(config.value);
+    currentBuilder = currentBuilder.addKeyValue(config.key, formattedValue);
+  }
+  return currentBuilder;
+}
+function addSystemHealthSection(builder, stats, sectionTitle = "Unified System Health") {
+  builder.addSection(sectionTitle, (sectionBuilder) => {
+    addKeyValuePairs(sectionBuilder, [
+      { key: "System Status", value: stats.status },
+      { key: "Total Operations", value: stats.totalOperations },
+      {
+        key: "Success Rate",
+        value: stats.successRate,
+        formatter: (value) => `${(value * 100).toFixed(1)}%`
+      },
+      { key: "Active Handles", value: stats.activeHandles },
+      { key: "Total Errors", value: stats.totalErrors }
+    ]);
+  });
+}
+function addBasicPageStructure(builder, config) {
+  let currentBuilder = builder.addKeyValue("URL", config.url);
+  if (config.title) {
+    currentBuilder = currentBuilder.addKeyValue("Title", config.title);
+  }
+  return currentBuilder.addEmptyLine();
+}
+function addComprehensivePageStructure(builder, config) {
+  return addKeyValuePairs(builder, [
+    { key: "URL", value: config.url },
+    { key: "Title", value: config.title ?? "N/A" },
+    {
+      key: "IFrames",
+      value: `${config.iframes.count} iframes detected: ${config.iframes.detected}`
+    },
+    { key: "Accessible iframes", value: config.iframes.accessible },
+    { key: "Inaccessible iframes", value: config.iframes.inaccessible },
+    { key: "Total visible elements", value: config.elements.totalVisible },
+    {
+      key: "Total interactable elements",
+      value: config.elements.totalInteractable
+    },
+    { key: "Elements missing ARIA", value: config.elements.missingAria }
+  ]).addEmptyLine();
+}
+function addDomComplexityMetrics(builder, metrics) {
+  if (!metrics.domMetrics) {
+    return;
+  }
+  const domMetrics = metrics.domMetrics;
+  builder.addEmptyLine().addHeader("DOM Complexity", 3);
+  addKeyValuePairs(builder, [
+    { key: "Total DOM elements", value: domMetrics.totalElements ?? 0 },
+    {
+      key: "Max DOM depth",
+      value: domMetrics.maxDepth ?? 0,
+      formatter: (value) => `${value} levels`
+    }
+  ]);
+  if (domMetrics.largeSubtrees?.length) {
+    builder.addKeyValue("Large subtrees detected", domMetrics.largeSubtrees.length);
+    for (const [index, subtree] of domMetrics.largeSubtrees.slice(0, 3).entries()) {
+      builder.addLine(`  ${index + 1}. **${subtree.selector}**: ${subtree.elementCount} elements (${subtree.description})`);
+    }
+  }
+}
+function addInteractionMetrics(builder, metrics) {
+  if (!metrics.interactionMetrics) {
+    return;
+  }
+  builder.addEmptyLine().addHeader("Interaction Elements", 3);
+  addKeyValuePairs(builder, [
+    {
+      key: "Clickable elements",
+      value: metrics.interactionMetrics.clickableElements ?? 0
+    },
+    {
+      key: "Form elements",
+      value: metrics.interactionMetrics.formElements ?? 0
+    },
+    {
+      key: "Disabled elements",
+      value: metrics.interactionMetrics.disabledElements ?? 0
+    }
+  ]);
+}
+function addResourceMetrics(builder, metrics) {
+  if (!metrics.resourceMetrics) {
+    return;
+  }
+  const resourceMetrics = metrics.resourceMetrics;
+  builder.addEmptyLine().addHeader("Resource Load", 3);
+  addKeyValuePairs(builder, [
+    {
+      key: "Images",
+      value: `${resourceMetrics.imageCount ?? 0} (${resourceMetrics.estimatedImageSize ?? "Unknown"}))`
+    },
+    {
+      key: "Script tags",
+      value: `${resourceMetrics.scriptTags ?? 0} (${resourceMetrics.externalScripts ?? 0} external, ${resourceMetrics.inlineScripts ?? 0} inline)`
+    },
+    { key: "Stylesheets", value: resourceMetrics.stylesheetCount ?? 0 }
+  ]);
+}
+function addModalStatesIfPresent(builder, modalStates) {
+  if (modalStates.blockedBy.length > 0) {
+    builder.addHeader("Modal States", 2).addKeyValue("Active modals", modalStates.blockedBy.join(", ")).addEmptyLine();
+  }
+}
+function addErrorSection(builder, error, context) {
+  builder.addEmptyLine().addKeyValue(`Error ${context}`, getErrorMessage(error));
+}
+function formatValue(value) {
+  if (value === null || value === undefined) {
+    return "N/A";
+  }
+  if (typeof value === "boolean") {
+    return value.toString();
+  }
+  return String(value);
+}
+function addElementList(builder, title, elements, formatter, maxItems = 5) {
+  if (!elements?.length) {
+    return;
+  }
+  builder.addEmptyLine().addLine(`**${title}:**`);
+  const limitedElements = elements.slice(0, maxItems);
+  for (let index = 0;index < limitedElements.length; index++) {
+    builder.addLine(formatter(limitedElements[index], index));
+  }
+}
+function addOptionalListSection(builder, title, items, formatter, headerLevel = 2) {
+  if (!items?.length) {
+    return;
+  }
+  builder.addSection(title, (sectionBuilder) => {
+    for (const item of items) {
+      sectionBuilder.addListItem(formatter(item));
+    }
+  }, headerLevel);
+}
+export {
+  addSystemHealthSection,
+  addResourceMetrics,
+  addOptionalListSection,
+  addModalStatesIfPresent,
+  addKeyValuePairs,
+  addInteractionMetrics,
+  addErrorSection,
+  addElementList,
+  addDomComplexityMetrics,
+  addComprehensivePageStructure,
+  addBasicPageStructure
+};

package/lib/utils/diff-formatter.js

@@ -0,0 +1,126 @@
+import { createRequire } from "node:module";
+var __create = Object.create;
+var __getProtoOf = Object.getPrototypeOf;
+var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __toESM = (mod, isNodeMode, target) => {
+  target = mod != null ? __create(__getProtoOf(mod)) : {};
+  const to = isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target;
+  for (let key of __getOwnPropNames(mod))
+    if (!__hasOwnProp.call(to, key))
+      __defProp(to, key, {
+        get: () => mod[key],
+        enumerable: true
+      });
+  return to;
+};
+var __require = /* @__PURE__ */ createRequire(import.meta.url);
+
+// src/utils/diff-formatter.ts
+class DiffFormatter {
+  formatUnified(segments, context = 3) {
+    if (segments.length === 0) {
+      return "";
+    }
+    const lines = [];
+    let hasChanges = false;
+    for (const segment of segments) {
+      const processedSegment = this.processUnifiedSegment(segment, lines, hasChanges, context);
+      hasChanges = processedSegment.hasChanges;
+      if (processedSegment.shouldBreak) {
+        break;
+      }
+    }
+    return hasChanges ? lines.join(`
+`) : "";
+  }
+  processUnifiedSegment(segment, lines, hasChanges, context) {
+    if (segment.type === "add") {
+      this.addUnifiedLines(segment, lines, "+ ");
+      return { hasChanges: true, shouldBreak: false };
+    }
+    if (segment.type === "remove") {
+      this.addUnifiedLines(segment, lines, "- ");
+      return { hasChanges: true, shouldBreak: false };
+    }
+    if (segment.type === "equal" && hasChanges) {
+      return this.processEqualSegment(segment, lines, context);
+    }
+    return { hasChanges, shouldBreak: false };
+  }
+  addUnifiedLines(segment, lines, prefix) {
+    for (const line of segment.value.split(`
+`)) {
+      if (line || segment.value.endsWith(`
+`)) {
+        lines.push(`${prefix}${line}`);
+      }
+    }
+  }
+  processEqualSegment(segment, lines, context) {
+    const contextLines = segment.value.split(`
+`);
+    const showLines = Math.min(context, contextLines.length);
+    for (let j = 0;j < showLines && j < contextLines.length - 1; j++) {
+      lines.push(`  ${contextLines[j]}`);
+    }
+    const shouldBreak = contextLines.length > showLines;
+    return { hasChanges: true, shouldBreak };
+  }
+  formatSplit(segments) {
+    const { removedLines, addedLines } = this.extractSplitLines(segments);
+    return this.buildSplitOutput(removedLines, addedLines);
+  }
+  extractSplitLines(segments) {
+    const removedLines = [];
+    const addedLines = [];
+    for (const segment of segments) {
+      if (segment.type === "remove") {
+        this.addSplitLines(segment, removedLines);
+      } else if (segment.type === "add") {
+        this.addSplitLines(segment, addedLines);
+      }
+    }
+    return { removedLines, addedLines };
+  }
+  addSplitLines(segment, targetLines) {
+    for (const line of segment.value.split(`
+`)) {
+      if (line || segment.value.endsWith(`
+`)) {
+        targetLines.push(line);
+      }
+    }
+  }
+  buildSplitOutput(removedLines, addedLines) {
+    const result = [];
+    this.addSplitSection(result, removedLines, "--- Removed");
+    this.addSplitSection(result, addedLines, "+++ Added", result.length > 0);
+    return result.join(`
+`);
+  }
+  addSplitSection(result, lines, header, addSeparator = false) {
+    if (lines.length > 0) {
+      if (addSeparator) {
+        result.push("");
+      }
+      result.push(header);
+      result.push(...lines);
+    }
+  }
+  formatMinimal(segments) {
+    const changes = [];
+    for (const segment of segments) {
+      if (segment.type === "add") {
+        changes.push(`+${segment.value}`);
+      } else if (segment.type === "remove") {
+        changes.push(`-${segment.value}`);
+      }
+    }
+    return changes.join("");
+  }
+}
+export {
+  DiffFormatter
+};