npm - @skrillex1224/playwright-toolkit - Versions diffs - 2.1.228 → 2.1.229 - Mend

@skrillex1224/playwright-toolkit 2.1.228 → 2.1.229

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

@@ -6273,18 +6273,15 @@ 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 MOBILE_STRIP_HEIGHT = 104;
+var MOBILE_STRIP_HEIGHT = 78;
 var MOBILE_STRIP_PADDING_X = 14;
 var MOBILE_STRIP_PADDING_Y = 13;
 var MOBILE_STRIP_ROW_HEIGHT = 22;
-var MOBILE_STRIP_ROW_GAP = 7;
+var MOBILE_STRIP_ROW_GAP = 8;
 var MOBILE_STRIP_LABEL_FONT_SIZE = 12.5;
 var MOBILE_STRIP_VALUE_FONT_SIZE = 13.5;
-var MOBILE_STRIP_LABEL_WIDTH = 45;
-var MOBILE_STRIP_PROMPT_LABEL_WIDTH = 60;
-var MOBILE_STRIP_LOC_LABEL_WIDTH = 30;
-var MOBILE_STRIP_IP_LABEL_WIDTH = 22;
-var MOBILE_STRIP_META_GAP = 12;
+var MOBILE_STRIP_META_GAP = 16;
+var MOBILE_STRIP_VALUE_WIDTH_SAFETY = 10;
 var WEAK_LOCATION_VALUES = /* @__PURE__ */ new Set(["cn", "\u4E2D\u56FD"]);
 var LOCATION_NETWORK_SUFFIX_PATTERNS = [
   /(?:中国)?移动$/i,
@@ -6681,9 +6678,10 @@ var readImageInfo = (buffer) => {
     height: 0
   };
 };
-var buildWatermarkifyRenderHtml = ({ imageSrc, overlaySvg, width, height }) => {
+var buildWatermarkifyRenderHtml = ({ imageSrc, overlaySvg, width, height, imageHeight }) => {
   const safeWidth = Math.max(1, Number(width) || 1);
   const safeHeight = Math.max(1, Number(height) || 1);
+  const safeImageHeight = Math.max(1, Number(imageHeight || height) || 1);
   return `
         <!doctype html>
         <html lang="zh-CN">
@@ -6712,10 +6710,11 @@ var buildWatermarkifyRenderHtml = ({ imageSrc, overlaySvg, width, height }) => {
                 #pk-base-image {
                     position: absolute;
-                    inset: 0;
+                    top: 0;
+                    left: 0;
                     display: block;
                     width: ${safeWidth}px;
-                    height: ${safeHeight}px;
+                    height: ${safeImageHeight}px;
                 }
                 #pk-overlay {
@@ -6749,7 +6748,8 @@ var composeScreenshotBufferWithBrowser = async (page, buffer, overlaySvg, imageI
   try {
     const renderPage = renderScope.page;
     const safeWidth = Math.max(1, Number(imageInfo.width) || 1);
-    const safeHeight = Math.max(1, Number(imageInfo.height) || 1);
+    const safeImageHeight = Math.max(1, Number(imageInfo.imageHeight || imageInfo.height) || 1);
+    const safeHeight = Math.max(safeImageHeight, Number(imageInfo.height) || safeImageHeight);
     const viewportHeight = Math.max(
       1,
       Math.min(safeHeight, DEFAULT_BROWSER_COMPOSITOR_VIEWPORT_HEIGHT)
@@ -6763,7 +6763,8 @@ var composeScreenshotBufferWithBrowser = async (page, buffer, overlaySvg, imageI
       imageSrc: `data:${imageInfo.mimeType || "image/png"};base64,${buffer.toString("base64")}`,
       overlaySvg,
       width: safeWidth,
-      height: safeHeight
+      height: safeHeight,
+      imageHeight: safeImageHeight
     }), {
       waitUntil: "load"
     });
@@ -7410,15 +7411,15 @@ var renderMobileStripText = ({
   label,
   value,
   labelX,
+  valueX,
   y,
   valueWidth,
-  labelWidth = MOBILE_STRIP_LABEL_WIDTH,
   fontFamily
 }) => {
   const safeLabel = normalizeWhitespace(label) || "-";
   const safeValue = fitTextWithEllipsis(
     Array.from(normalizeWhitespace(value) || "-"),
-    Math.max(18, valueWidth),
+    Math.max(18, valueWidth - MOBILE_STRIP_VALUE_WIDTH_SAFETY),
     MOBILE_STRIP_VALUE_FONT_SIZE
   );
   return `
@@ -7433,7 +7434,7 @@ var renderMobileStripText = ({
             dominant-baseline="middle"
         >${escapeXml(safeLabel)}</text>
         <text
-            x="${labelX + labelWidth}"
+            x="${valueX}"
             y="${y}"
             fill="#111111"
             font-family="${fontFamily}"
@@ -7443,9 +7444,9 @@ var renderMobileStripText = ({
         >${escapeXml(safeValue)}</text>
     `;
 };
-var renderMobileStrip = ({ meta, width, height, fontFamily }) => {
+var renderMobileStrip = ({ meta, width, baseHeight, fontFamily }) => {
   const stripHeight = MOBILE_STRIP_HEIGHT;
-  const stripY = height - stripHeight;
+  const stripY = baseHeight;
   const contentX = MOBILE_STRIP_PADDING_X;
   const contentWidth = Math.max(1, width - MOBILE_STRIP_PADDING_X * 2);
   const prompt = findStripSegment(meta.stripSegments, "prompt");
@@ -7454,63 +7455,70 @@ var renderMobileStrip = ({ meta, width, height, fontFamily }) => {
   const ip = findStripSegment(meta.stripSegments, "ip");
   const row1Y = stripY + MOBILE_STRIP_PADDING_Y + MOBILE_STRIP_ROW_HEIGHT / 2;
   const row2Y = row1Y + MOBILE_STRIP_ROW_HEIGHT + MOBILE_STRIP_ROW_GAP;
-  const row3Y = row2Y + MOBILE_STRIP_ROW_HEIGHT + MOBILE_STRIP_ROW_GAP;
-  const promptValueWidth = contentWidth - MOBILE_STRIP_PROMPT_LABEL_WIDTH;
-  const locValueX = contentX + MOBILE_STRIP_LOC_LABEL_WIDTH;
-  const ipLabelX = Math.min(
-    width - MOBILE_STRIP_PADDING_X - MOBILE_STRIP_IP_LABEL_WIDTH - 70,
+  const rightColumnX = Math.min(
+    width - MOBILE_STRIP_PADDING_X - 112,
     Math.max(
-      locValueX + 80 + MOBILE_STRIP_META_GAP,
-      contentX + Math.round(contentWidth * 0.52)
+      contentX + 200,
+      contentX + Math.round(contentWidth * 0.62)
     )
   );
+  const leftValueX = contentX + 48;
+  const rightValueX = rightColumnX + 28;
+  const promptValueWidth = Math.max(
+    28,
+    rightColumnX - leftValueX - MOBILE_STRIP_META_GAP
+  );
+  const timeValueWidth = Math.max(
+    28,
+    rightColumnX - leftValueX - MOBILE_STRIP_META_GAP
+  );
   const locValueWidth = Math.max(
     28,
-    ipLabelX - locValueX - MOBILE_STRIP_META_GAP
+    width - MOBILE_STRIP_PADDING_X - rightValueX
   );
   const ipValueWidth = Math.max(
     28,
-    width - MOBILE_STRIP_PADDING_X - (ipLabelX + MOBILE_STRIP_IP_LABEL_WIDTH)
+    width - MOBILE_STRIP_PADDING_X - rightValueX
   );
   return `
         <g id="strip">
             <rect x="0" y="${stripY}" width="${width}" height="${stripHeight}" fill="#ffffff" fill-opacity="0.985" />
             <rect x="0" y="${stripY}" width="${width}" height="1" fill="#111111" fill-opacity="0.10" />
-            <rect x="${contentX}" y="${stripY}" width="${Math.max(96, Math.round(width * 0.36))}" height="2" fill="url(#stripAccent)" />
+            <rect x="${contentX}" y="${stripY}" width="${Math.max(96, Math.round(width * 0.34))}" height="2" fill="url(#stripAccent)" />
             ${renderMobileStripText({
     label: "Prompt",
     value: prompt.rawValue || prompt.value || "-",
     labelX: contentX,
+    valueX: leftValueX,
     y: row1Y,
     valueWidth: promptValueWidth,
-    labelWidth: MOBILE_STRIP_PROMPT_LABEL_WIDTH,
     fontFamily
   })}
             ${renderMobileStripText({
-    label: "Time",
-    value: time.rawValue || time.value || "-",
-    labelX: contentX,
-    y: row2Y,
-    valueWidth: promptValueWidth,
-    labelWidth: MOBILE_STRIP_LABEL_WIDTH,
+    label: "Loc",
+    value: location.rawValue || location.value || "-",
+    labelX: rightColumnX,
+    valueX: rightValueX,
+    y: row1Y,
+    valueWidth: locValueWidth,
     fontFamily
   })}
             ${renderMobileStripText({
-    label: "Loc",
-    value: location.rawValue || location.value || "-",
+    label: "Time",
+    value: time.rawValue || time.value || "-",
     labelX: contentX,
-    y: row3Y,
-    valueWidth: locValueWidth,
-    labelWidth: MOBILE_STRIP_LOC_LABEL_WIDTH,
+    valueX: leftValueX,
+    y: row2Y,
+    valueWidth: timeValueWidth,
     fontFamily
   })}
             ${renderMobileStripText({
     label: "IP",
     value: ip.rawValue || ip.value || "-",
-    labelX: ipLabelX,
-    y: row3Y,
+    labelX: rightColumnX,
+    valueX: rightValueX,
+    y: row2Y,
     valueWidth: ipValueWidth,
-    labelWidth: MOBILE_STRIP_IP_LABEL_WIDTH,
     fontFamily
   })}
         </g>
@@ -7523,7 +7531,8 @@ var buildWatermarkifySvg = (meta, imageWidth, imageHeight) => {
     return "";
   }
   const width = Math.max(1, Number(imageWidth) || 1);
-  const height = Math.max(1, Number(imageHeight) || 1);
+  const baseHeight = Math.max(1, Number(imageHeight) || 1);
+  const canvasHeight = normalizeDevice(meta.device) === Device.Mobile && hasStrip ? baseHeight + MOBILE_STRIP_HEIGHT : baseHeight;
   const fontFamily = escapeXml(buildFontFamily());
   const parts = [];
   if (hasWatermark) {
@@ -7536,7 +7545,7 @@ var buildWatermarkifySvg = (meta, imageWidth, imageHeight) => {
     const startX = -Math.round(cellWidth * 0.16);
     const startY = -Math.round(cellHeight * 0.12);
     const cols = Math.ceil((width + cellWidth * 1.1) / cellWidth) + 1;
-    const rows = Math.ceil((height + cellHeight * 0.9) / cellHeight) + 1;
+    const rows = Math.ceil((baseHeight + cellHeight * 0.9) / cellHeight) + 1;
     const stamps = [];
     for (let row = 0; row < rows; row += 1) {
       for (let col = 0; col < cols; col += 1) {
@@ -7568,11 +7577,11 @@ var buildWatermarkifySvg = (meta, imageWidth, imageHeight) => {
       parts.push(renderMobileStrip({
         meta,
         width,
-        height,
+        baseHeight,
         fontFamily
       }));
       return `
-                <svg xmlns="http://www.w3.org/2000/svg" width="${width}" height="${height}" viewBox="0 0 ${width} ${height}">
+                <svg xmlns="http://www.w3.org/2000/svg" width="${width}" height="${canvasHeight}" viewBox="0 0 ${width} ${canvasHeight}">
                     <defs>
                         <linearGradient id="stripAccent" x1="0%" y1="0%" x2="100%" y2="0%">
                             <stop offset="0%" stop-color="#111111" stop-opacity="0.98" />
@@ -7591,7 +7600,7 @@ var buildWatermarkifySvg = (meta, imageWidth, imageHeight) => {
     const contentWidth = width - contentStartX - DEFAULT_STRIP_PADDING_RIGHT;
     const stripLayout = buildStripLayout(meta.stripSegments, contentWidth);
     const stripHeight = stripLayout.height;
-    const stripY = height - stripHeight;
+    const stripY = baseHeight - stripHeight;
     const logoY = Number((stripY + (stripHeight - logoSize) / 2).toFixed(2));
     let stripContentSvg = "";
     const centerY = stripY + stripHeight / 2 + 1;
@@ -7680,7 +7689,7 @@ var buildWatermarkifySvg = (meta, imageWidth, imageHeight) => {
         `);
   }
   return `
-        <svg xmlns="http://www.w3.org/2000/svg" width="${width}" height="${height}" viewBox="0 0 ${width} ${height}">
+        <svg xmlns="http://www.w3.org/2000/svg" width="${width}" height="${canvasHeight}" viewBox="0 0 ${width} ${canvasHeight}">
             <defs>
                 <linearGradient id="stripAccent" x1="0%" y1="0%" x2="100%" y2="0%">
                     <stop offset="0%" stop-color="#111111" stop-opacity="0.98" />
@@ -7704,11 +7713,17 @@ var watermarkifyScreenshotBuffer = async (buffer, meta, page = null) => {
     logger13.warning("watermarkify \u8DF3\u8FC7: \u65E0\u6CD5\u89E3\u6790\u622A\u56FE\u5C3A\u5BF8\u6216\u683C\u5F0F");
     return buffer;
   }
+  const isMobileStrip = normalizeDevice(meta.device) === Device.Mobile && hasStrip;
+  const outputImageInfo = isMobileStrip ? {
+    ...imageInfo,
+    imageHeight: imageInfo.height,
+    height: imageInfo.height + MOBILE_STRIP_HEIGHT
+  } : imageInfo;
   const overlaySvg = buildWatermarkifySvg(meta, imageInfo.width, imageInfo.height);
   if (!overlaySvg) {
     return buffer;
   }
-  return await composeScreenshotBufferWithBrowser(page, buffer, overlaySvg, imageInfo);
+  return await composeScreenshotBufferWithBrowser(page, buffer, overlaySvg, outputImageInfo);
 };
 // src/internals/compression.js