npm - @skrillex1224/playwright-toolkit - Versions diffs - 2.1.212 → 2.1.213 - Mend

@skrillex1224/playwright-toolkit 2.1.212 → 2.1.213

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/dist/index.js CHANGED Viewed

@@ -4559,7 +4559,6 @@ var Logger = {
 import delay2 from "delay";
 // src/internals/watermarkify.js
-import sharp from "sharp";
 var DEFAULT_TIMEZONE_OFFSET = 8;
 var DEFAULT_RESOLVER_TIMEOUT_MS = 180;
 var DEFAULT_IP_LOOKUP_TIMEOUT_MS = 1e4;
@@ -4590,6 +4589,7 @@ var DEFAULT_STRIP_LINE_HEIGHT_RATIO = 1.28;
 var DEFAULT_STRIP_PROMPT_MAX_LINES = 3;
 var DEFAULT_STRIP_CONTENT_SAFE_PADDING_X = 12;
 var DEFAULT_STRIP_TEXT_WIDTH_SAFETY = 10;
+var DEFAULT_BROWSER_COMPOSITOR_VIEWPORT_HEIGHT = 1200;
 var WEAK_LOCATION_VALUES = /* @__PURE__ */ new Set(["cn", "\u4E2D\u56FD"]);
 var LOCATION_NETWORK_SUFFIX_PATTERNS = [
   /(?:中国)?移动$/i,
@@ -4912,6 +4912,198 @@ var openProbePage = async (page) => {
   }
   return null;
 };
+var readPngDimensions = (buffer) => {
+  if (!Buffer.isBuffer(buffer) || buffer.length < 24) {
+    return { width: 0, height: 0 };
+  }
+  const pngSignature = [137, 80, 78, 71, 13, 10, 26, 10];
+  for (let index = 0; index < pngSignature.length; index += 1) {
+    if (buffer[index] !== pngSignature[index]) {
+      return { width: 0, height: 0 };
+    }
+  }
+  return {
+    width: buffer.readUInt32BE(16),
+    height: buffer.readUInt32BE(20)
+  };
+};
+var readJpegDimensions = (buffer) => {
+  if (!Buffer.isBuffer(buffer) || buffer.length < 4 || buffer[0] !== 255 || buffer[1] !== 216) {
+    return { width: 0, height: 0 };
+  }
+  let offset = 2;
+  while (offset + 9 <= buffer.length) {
+    if (buffer[offset] !== 255) {
+      offset += 1;
+      continue;
+    }
+    const marker = buffer[offset + 1];
+    offset += 2;
+    if (marker === 216 || marker === 217) {
+      continue;
+    }
+    if (marker === 218) {
+      break;
+    }
+    if (offset + 2 > buffer.length) {
+      break;
+    }
+    const segmentLength = buffer.readUInt16BE(offset);
+    if (segmentLength < 2 || offset + segmentLength > buffer.length) {
+      break;
+    }
+    const isStartOfFrame = marker >= 192 && marker <= 207 && marker !== 196 && marker !== 200 && marker !== 204;
+    if (isStartOfFrame && offset + 7 <= buffer.length) {
+      return {
+        height: buffer.readUInt16BE(offset + 3),
+        width: buffer.readUInt16BE(offset + 5)
+      };
+    }
+    offset += segmentLength;
+  }
+  return { width: 0, height: 0 };
+};
+var readImageInfo = (buffer) => {
+  const png = readPngDimensions(buffer);
+  if (png.width && png.height) {
+    return {
+      mimeType: "image/png",
+      width: png.width,
+      height: png.height
+    };
+  }
+  const jpeg = readJpegDimensions(buffer);
+  if (jpeg.width && jpeg.height) {
+    return {
+      mimeType: "image/jpeg",
+      width: jpeg.width,
+      height: jpeg.height
+    };
+  }
+  return {
+    mimeType: "",
+    width: 0,
+    height: 0
+  };
+};
+var buildWatermarkifyRenderHtml = ({ imageSrc, overlaySvg, width, height }) => {
+  const safeWidth = Math.max(1, Number(width) || 1);
+  const safeHeight = Math.max(1, Number(height) || 1);
+  return `
+        <!doctype html>
+        <html lang="zh-CN">
+        <head>
+            <meta charset="utf-8" />
+            <style>
+                html, body {
+                    margin: 0;
+                    padding: 0;
+                    width: ${safeWidth}px;
+                    height: ${safeHeight}px;
+                    overflow: hidden;
+                    background: #ffffff;
+                }
+                body {
+                    position: relative;
+                }
+                #pk-stage {
+                    position: relative;
+                    width: ${safeWidth}px;
+                    height: ${safeHeight}px;
+                    overflow: hidden;
+                }
+                #pk-base-image {
+                    position: absolute;
+                    inset: 0;
+                    display: block;
+                    width: ${safeWidth}px;
+                    height: ${safeHeight}px;
+                }
+                #pk-overlay {
+                    position: absolute;
+                    inset: 0;
+                    width: ${safeWidth}px;
+                    height: ${safeHeight}px;
+                    pointer-events: none;
+                }
+            </style>
+        </head>
+        <body>
+            <div id="pk-stage">
+                <img id="pk-base-image" src="${escapeHtmlAttribute(imageSrc)}" alt="" />
+                <div id="pk-overlay">${overlaySvg}</div>
+            </div>
+        </body>
+        </html>
+    `;
+};
+var composeScreenshotBufferWithBrowser = async (page, buffer, overlaySvg, imageInfo = {}) => {
+  if (!page || typeof page.context !== "function") {
+    logger11.warning("watermarkify \u6D4F\u89C8\u5668\u5408\u6210\u8DF3\u8FC7: \u7F3A\u5C11\u53EF\u7528 page");
+    return buffer;
+  }
+  const renderScope = await openProbePage(page);
+  if (!renderScope?.page) {
+    logger11.warning("watermarkify \u6D4F\u89C8\u5668\u5408\u6210\u8DF3\u8FC7: \u65E0\u6CD5\u521B\u5EFA render page");
+    return buffer;
+  }
+  try {
+    const renderPage = renderScope.page;
+    const safeWidth = Math.max(1, Number(imageInfo.width) || 1);
+    const safeHeight = Math.max(1, Number(imageInfo.height) || 1);
+    const viewportHeight = Math.max(
+      1,
+      Math.min(safeHeight, DEFAULT_BROWSER_COMPOSITOR_VIEWPORT_HEIGHT)
+    );
+    await renderPage.setViewportSize({
+      width: safeWidth,
+      height: viewportHeight
+    }).catch(() => {
+    });
+    await renderPage.setContent(buildWatermarkifyRenderHtml({
+      imageSrc: `data:${imageInfo.mimeType || "image/png"};base64,${buffer.toString("base64")}`,
+      overlaySvg,
+      width: safeWidth,
+      height: safeHeight
+    }), {
+      waitUntil: "load"
+    });
+    await renderPage.waitForFunction(() => {
+      const image = document.getElementById("pk-base-image");
+      return image instanceof HTMLImageElement && image.complete && image.naturalWidth > 0 && image.naturalHeight > 0;
+    }, {
+      timeout: 5e3
+    }).catch(() => {
+    });
+    await renderPage.evaluate(async () => {
+      if (document.fonts?.ready) {
+        await document.fonts.ready.catch(() => {
+        });
+      }
+    }).catch(() => {
+    });
+    const composed = await renderPage.screenshot({
+      type: "png",
+      fullPage: true,
+      animations: "disabled"
+    }).catch((error) => {
+      logger11.warning(`watermarkify \u6D4F\u89C8\u5668\u5408\u6210\u5931\u8D25: ${error instanceof Error ? error.message : String(error)}`);
+      return null;
+    });
+    if (Buffer.isBuffer(composed) && composed.length > 0) {
+      return composed;
+    }
+    logger11.warning("watermarkify \u6D4F\u89C8\u5668\u5408\u6210\u5931\u8D25: \u672A\u5F97\u5230\u6709\u6548\u622A\u56FE\u7ED3\u679C");
+    return buffer;
+  } finally {
+    await renderScope.close().catch(() => {
+    });
+  }
+};
 var resolveWithIpLookup = async (page, options = {}) => {
   if (!page || typeof page.context !== "function" || options.ipLookup === false) {
     return null;
@@ -5057,6 +5249,7 @@ var buildStripSegments = ({ prompt, captureTime, ip, location }) => {
   ];
 };
 var escapeXml = (value) => String(value || "").replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
+var escapeHtmlAttribute = (value) => String(value || "").replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
 var estimateTextWidth = (value, fontSize = 16) => {
   const text = String(value || "");
   let width = 0;
@@ -5668,24 +5861,22 @@ var buildWatermarkifySvg = (meta, imageWidth, imageHeight) => {
         </svg>
     `;
 };
-var watermarkifyScreenshotBuffer = async (buffer, meta) => {
+var watermarkifyScreenshotBuffer = async (buffer, meta, page = null) => {
   const hasWatermark = meta?.watermark?.enabled !== false && normalizeText(meta?.watermarkText);
   const hasStrip = meta?.strip?.enabled !== false && Array.isArray(meta?.stripSegments) && meta.stripSegments.length > 0;
   if (!Buffer.isBuffer(buffer) || !meta || !hasWatermark && !hasStrip) {
     return buffer;
   }
-  const image = sharp(buffer, { failOn: "none" });
-  const metadata = await image.metadata().catch(() => null);
-  const width = Math.max(1, Number(metadata?.width) || 0);
-  const height = Math.max(1, Number(metadata?.height) || 0);
-  if (!width || !height) {
+  const imageInfo = readImageInfo(buffer);
+  if (!imageInfo.width || !imageInfo.height || !imageInfo.mimeType) {
+    logger11.warning("watermarkify \u8DF3\u8FC7: \u65E0\u6CD5\u89E3\u6790\u622A\u56FE\u5C3A\u5BF8\u6216\u683C\u5F0F");
     return buffer;
   }
-  const overlaySvg = buildWatermarkifySvg(meta, width, height);
+  const overlaySvg = buildWatermarkifySvg(meta, imageInfo.width, imageInfo.height);
   if (!overlaySvg) {
     return buffer;
   }
-  return await image.composite([{ input: Buffer.from(overlaySvg), top: 0, left: 0 }]).png().toBuffer();
+  return await composeScreenshotBufferWithBrowser(page, buffer, overlaySvg, imageInfo);
 };
 // src/share.js
@@ -6149,7 +6340,7 @@ var Share = {
         ...screenshotWatermarkify,
         capturedAt
       });
-      const buffer_ = await watermarkifyScreenshotBuffer(rawBuffer, watermarkifyMeta);
+      const buffer_ = await watermarkifyScreenshotBuffer(rawBuffer, watermarkifyMeta, page);
       return buffer_.toString("base64");
     } finally {
       if (restore) {