@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.
package/dist/index.cjs CHANGED
@@ -6301,18 +6301,15 @@ var DEFAULT_STRIP_PROMPT_MAX_LINES = 3;
6301
6301
  var DEFAULT_STRIP_CONTENT_SAFE_PADDING_X = 12;
6302
6302
  var DEFAULT_STRIP_TEXT_WIDTH_SAFETY = 10;
6303
6303
  var DEFAULT_BROWSER_COMPOSITOR_VIEWPORT_HEIGHT = 1200;
6304
- var MOBILE_STRIP_HEIGHT = 104;
6304
+ var MOBILE_STRIP_HEIGHT = 78;
6305
6305
  var MOBILE_STRIP_PADDING_X = 14;
6306
6306
  var MOBILE_STRIP_PADDING_Y = 13;
6307
6307
  var MOBILE_STRIP_ROW_HEIGHT = 22;
6308
- var MOBILE_STRIP_ROW_GAP = 7;
6308
+ var MOBILE_STRIP_ROW_GAP = 8;
6309
6309
  var MOBILE_STRIP_LABEL_FONT_SIZE = 12.5;
6310
6310
  var MOBILE_STRIP_VALUE_FONT_SIZE = 13.5;
6311
- var MOBILE_STRIP_LABEL_WIDTH = 45;
6312
- var MOBILE_STRIP_PROMPT_LABEL_WIDTH = 60;
6313
- var MOBILE_STRIP_LOC_LABEL_WIDTH = 30;
6314
- var MOBILE_STRIP_IP_LABEL_WIDTH = 22;
6315
- var MOBILE_STRIP_META_GAP = 12;
6311
+ var MOBILE_STRIP_META_GAP = 16;
6312
+ var MOBILE_STRIP_VALUE_WIDTH_SAFETY = 10;
6316
6313
  var WEAK_LOCATION_VALUES = /* @__PURE__ */ new Set(["cn", "\u4E2D\u56FD"]);
6317
6314
  var LOCATION_NETWORK_SUFFIX_PATTERNS = [
6318
6315
  /(?:中国)?移动$/i,
@@ -6709,9 +6706,10 @@ var readImageInfo = (buffer) => {
6709
6706
  height: 0
6710
6707
  };
6711
6708
  };
6712
- var buildWatermarkifyRenderHtml = ({ imageSrc, overlaySvg, width, height }) => {
6709
+ var buildWatermarkifyRenderHtml = ({ imageSrc, overlaySvg, width, height, imageHeight }) => {
6713
6710
  const safeWidth = Math.max(1, Number(width) || 1);
6714
6711
  const safeHeight = Math.max(1, Number(height) || 1);
6712
+ const safeImageHeight = Math.max(1, Number(imageHeight || height) || 1);
6715
6713
  return `
6716
6714
  <!doctype html>
6717
6715
  <html lang="zh-CN">
@@ -6740,10 +6738,11 @@ var buildWatermarkifyRenderHtml = ({ imageSrc, overlaySvg, width, height }) => {
6740
6738
 
6741
6739
  #pk-base-image {
6742
6740
  position: absolute;
6743
- inset: 0;
6741
+ top: 0;
6742
+ left: 0;
6744
6743
  display: block;
6745
6744
  width: ${safeWidth}px;
6746
- height: ${safeHeight}px;
6745
+ height: ${safeImageHeight}px;
6747
6746
  }
6748
6747
 
6749
6748
  #pk-overlay {
@@ -6777,7 +6776,8 @@ var composeScreenshotBufferWithBrowser = async (page, buffer, overlaySvg, imageI
6777
6776
  try {
6778
6777
  const renderPage = renderScope.page;
6779
6778
  const safeWidth = Math.max(1, Number(imageInfo.width) || 1);
6780
- const safeHeight = Math.max(1, Number(imageInfo.height) || 1);
6779
+ const safeImageHeight = Math.max(1, Number(imageInfo.imageHeight || imageInfo.height) || 1);
6780
+ const safeHeight = Math.max(safeImageHeight, Number(imageInfo.height) || safeImageHeight);
6781
6781
  const viewportHeight = Math.max(
6782
6782
  1,
6783
6783
  Math.min(safeHeight, DEFAULT_BROWSER_COMPOSITOR_VIEWPORT_HEIGHT)
@@ -6791,7 +6791,8 @@ var composeScreenshotBufferWithBrowser = async (page, buffer, overlaySvg, imageI
6791
6791
  imageSrc: `data:${imageInfo.mimeType || "image/png"};base64,${buffer.toString("base64")}`,
6792
6792
  overlaySvg,
6793
6793
  width: safeWidth,
6794
- height: safeHeight
6794
+ height: safeHeight,
6795
+ imageHeight: safeImageHeight
6795
6796
  }), {
6796
6797
  waitUntil: "load"
6797
6798
  });
@@ -7438,15 +7439,15 @@ var renderMobileStripText = ({
7438
7439
  label,
7439
7440
  value,
7440
7441
  labelX,
7442
+ valueX,
7441
7443
  y,
7442
7444
  valueWidth,
7443
- labelWidth = MOBILE_STRIP_LABEL_WIDTH,
7444
7445
  fontFamily
7445
7446
  }) => {
7446
7447
  const safeLabel = normalizeWhitespace(label) || "-";
7447
7448
  const safeValue = fitTextWithEllipsis(
7448
7449
  Array.from(normalizeWhitespace(value) || "-"),
7449
- Math.max(18, valueWidth),
7450
+ Math.max(18, valueWidth - MOBILE_STRIP_VALUE_WIDTH_SAFETY),
7450
7451
  MOBILE_STRIP_VALUE_FONT_SIZE
7451
7452
  );
7452
7453
  return `
@@ -7461,7 +7462,7 @@ var renderMobileStripText = ({
7461
7462
  dominant-baseline="middle"
7462
7463
  >${escapeXml(safeLabel)}</text>
7463
7464
  <text
7464
- x="${labelX + labelWidth}"
7465
+ x="${valueX}"
7465
7466
  y="${y}"
7466
7467
  fill="#111111"
7467
7468
  font-family="${fontFamily}"
@@ -7471,9 +7472,9 @@ var renderMobileStripText = ({
7471
7472
  >${escapeXml(safeValue)}</text>
7472
7473
  `;
7473
7474
  };
7474
- var renderMobileStrip = ({ meta, width, height, fontFamily }) => {
7475
+ var renderMobileStrip = ({ meta, width, baseHeight, fontFamily }) => {
7475
7476
  const stripHeight = MOBILE_STRIP_HEIGHT;
7476
- const stripY = height - stripHeight;
7477
+ const stripY = baseHeight;
7477
7478
  const contentX = MOBILE_STRIP_PADDING_X;
7478
7479
  const contentWidth = Math.max(1, width - MOBILE_STRIP_PADDING_X * 2);
7479
7480
  const prompt = findStripSegment(meta.stripSegments, "prompt");
@@ -7482,63 +7483,70 @@ var renderMobileStrip = ({ meta, width, height, fontFamily }) => {
7482
7483
  const ip = findStripSegment(meta.stripSegments, "ip");
7483
7484
  const row1Y = stripY + MOBILE_STRIP_PADDING_Y + MOBILE_STRIP_ROW_HEIGHT / 2;
7484
7485
  const row2Y = row1Y + MOBILE_STRIP_ROW_HEIGHT + MOBILE_STRIP_ROW_GAP;
7485
- const row3Y = row2Y + MOBILE_STRIP_ROW_HEIGHT + MOBILE_STRIP_ROW_GAP;
7486
- const promptValueWidth = contentWidth - MOBILE_STRIP_PROMPT_LABEL_WIDTH;
7487
- const locValueX = contentX + MOBILE_STRIP_LOC_LABEL_WIDTH;
7488
- const ipLabelX = Math.min(
7489
- width - MOBILE_STRIP_PADDING_X - MOBILE_STRIP_IP_LABEL_WIDTH - 70,
7486
+ const rightColumnX = Math.min(
7487
+ width - MOBILE_STRIP_PADDING_X - 112,
7490
7488
  Math.max(
7491
- locValueX + 80 + MOBILE_STRIP_META_GAP,
7492
- contentX + Math.round(contentWidth * 0.52)
7489
+ contentX + 200,
7490
+ contentX + Math.round(contentWidth * 0.62)
7493
7491
  )
7494
7492
  );
7493
+ const leftValueX = contentX + 48;
7494
+ const rightValueX = rightColumnX + 28;
7495
+ const promptValueWidth = Math.max(
7496
+ 28,
7497
+ rightColumnX - leftValueX - MOBILE_STRIP_META_GAP
7498
+ );
7499
+ const timeValueWidth = Math.max(
7500
+ 28,
7501
+ rightColumnX - leftValueX - MOBILE_STRIP_META_GAP
7502
+ );
7495
7503
  const locValueWidth = Math.max(
7496
7504
  28,
7497
- ipLabelX - locValueX - MOBILE_STRIP_META_GAP
7505
+ width - MOBILE_STRIP_PADDING_X - rightValueX
7498
7506
  );
7499
7507
  const ipValueWidth = Math.max(
7500
7508
  28,
7501
- width - MOBILE_STRIP_PADDING_X - (ipLabelX + MOBILE_STRIP_IP_LABEL_WIDTH)
7509
+ width - MOBILE_STRIP_PADDING_X - rightValueX
7502
7510
  );
7503
7511
  return `
7504
7512
  <g id="strip">
7505
7513
  <rect x="0" y="${stripY}" width="${width}" height="${stripHeight}" fill="#ffffff" fill-opacity="0.985" />
7506
7514
  <rect x="0" y="${stripY}" width="${width}" height="1" fill="#111111" fill-opacity="0.10" />
7507
- <rect x="${contentX}" y="${stripY}" width="${Math.max(96, Math.round(width * 0.36))}" height="2" fill="url(#stripAccent)" />
7515
+ <rect x="${contentX}" y="${stripY}" width="${Math.max(96, Math.round(width * 0.34))}" height="2" fill="url(#stripAccent)" />
7508
7516
  ${renderMobileStripText({
7509
7517
  label: "Prompt",
7510
7518
  value: prompt.rawValue || prompt.value || "-",
7511
7519
  labelX: contentX,
7520
+ valueX: leftValueX,
7512
7521
  y: row1Y,
7513
7522
  valueWidth: promptValueWidth,
7514
- labelWidth: MOBILE_STRIP_PROMPT_LABEL_WIDTH,
7515
7523
  fontFamily
7516
7524
  })}
7517
7525
  ${renderMobileStripText({
7518
- label: "Time",
7519
- value: time.rawValue || time.value || "-",
7520
- labelX: contentX,
7521
- y: row2Y,
7522
- valueWidth: promptValueWidth,
7523
- labelWidth: MOBILE_STRIP_LABEL_WIDTH,
7526
+ label: "Loc",
7527
+ value: location.rawValue || location.value || "-",
7528
+ labelX: rightColumnX,
7529
+ valueX: rightValueX,
7530
+ y: row1Y,
7531
+ valueWidth: locValueWidth,
7524
7532
  fontFamily
7525
7533
  })}
7526
7534
  ${renderMobileStripText({
7527
- label: "Loc",
7528
- value: location.rawValue || location.value || "-",
7535
+ label: "Time",
7536
+ value: time.rawValue || time.value || "-",
7529
7537
  labelX: contentX,
7530
- y: row3Y,
7531
- valueWidth: locValueWidth,
7532
- labelWidth: MOBILE_STRIP_LOC_LABEL_WIDTH,
7538
+ valueX: leftValueX,
7539
+ y: row2Y,
7540
+ valueWidth: timeValueWidth,
7533
7541
  fontFamily
7534
7542
  })}
7535
7543
  ${renderMobileStripText({
7536
7544
  label: "IP",
7537
7545
  value: ip.rawValue || ip.value || "-",
7538
- labelX: ipLabelX,
7539
- y: row3Y,
7546
+ labelX: rightColumnX,
7547
+ valueX: rightValueX,
7548
+ y: row2Y,
7540
7549
  valueWidth: ipValueWidth,
7541
- labelWidth: MOBILE_STRIP_IP_LABEL_WIDTH,
7542
7550
  fontFamily
7543
7551
  })}
7544
7552
  </g>
@@ -7551,7 +7559,8 @@ var buildWatermarkifySvg = (meta, imageWidth, imageHeight) => {
7551
7559
  return "";
7552
7560
  }
7553
7561
  const width = Math.max(1, Number(imageWidth) || 1);
7554
- const height = Math.max(1, Number(imageHeight) || 1);
7562
+ const baseHeight = Math.max(1, Number(imageHeight) || 1);
7563
+ const canvasHeight = normalizeDevice(meta.device) === Device.Mobile && hasStrip ? baseHeight + MOBILE_STRIP_HEIGHT : baseHeight;
7555
7564
  const fontFamily = escapeXml(buildFontFamily());
7556
7565
  const parts = [];
7557
7566
  if (hasWatermark) {
@@ -7564,7 +7573,7 @@ var buildWatermarkifySvg = (meta, imageWidth, imageHeight) => {
7564
7573
  const startX = -Math.round(cellWidth * 0.16);
7565
7574
  const startY = -Math.round(cellHeight * 0.12);
7566
7575
  const cols = Math.ceil((width + cellWidth * 1.1) / cellWidth) + 1;
7567
- const rows = Math.ceil((height + cellHeight * 0.9) / cellHeight) + 1;
7576
+ const rows = Math.ceil((baseHeight + cellHeight * 0.9) / cellHeight) + 1;
7568
7577
  const stamps = [];
7569
7578
  for (let row = 0; row < rows; row += 1) {
7570
7579
  for (let col = 0; col < cols; col += 1) {
@@ -7596,11 +7605,11 @@ var buildWatermarkifySvg = (meta, imageWidth, imageHeight) => {
7596
7605
  parts.push(renderMobileStrip({
7597
7606
  meta,
7598
7607
  width,
7599
- height,
7608
+ baseHeight,
7600
7609
  fontFamily
7601
7610
  }));
7602
7611
  return `
7603
- <svg xmlns="http://www.w3.org/2000/svg" width="${width}" height="${height}" viewBox="0 0 ${width} ${height}">
7612
+ <svg xmlns="http://www.w3.org/2000/svg" width="${width}" height="${canvasHeight}" viewBox="0 0 ${width} ${canvasHeight}">
7604
7613
  <defs>
7605
7614
  <linearGradient id="stripAccent" x1="0%" y1="0%" x2="100%" y2="0%">
7606
7615
  <stop offset="0%" stop-color="#111111" stop-opacity="0.98" />
@@ -7619,7 +7628,7 @@ var buildWatermarkifySvg = (meta, imageWidth, imageHeight) => {
7619
7628
  const contentWidth = width - contentStartX - DEFAULT_STRIP_PADDING_RIGHT;
7620
7629
  const stripLayout = buildStripLayout(meta.stripSegments, contentWidth);
7621
7630
  const stripHeight = stripLayout.height;
7622
- const stripY = height - stripHeight;
7631
+ const stripY = baseHeight - stripHeight;
7623
7632
  const logoY = Number((stripY + (stripHeight - logoSize) / 2).toFixed(2));
7624
7633
  let stripContentSvg = "";
7625
7634
  const centerY = stripY + stripHeight / 2 + 1;
@@ -7708,7 +7717,7 @@ var buildWatermarkifySvg = (meta, imageWidth, imageHeight) => {
7708
7717
  `);
7709
7718
  }
7710
7719
  return `
7711
- <svg xmlns="http://www.w3.org/2000/svg" width="${width}" height="${height}" viewBox="0 0 ${width} ${height}">
7720
+ <svg xmlns="http://www.w3.org/2000/svg" width="${width}" height="${canvasHeight}" viewBox="0 0 ${width} ${canvasHeight}">
7712
7721
  <defs>
7713
7722
  <linearGradient id="stripAccent" x1="0%" y1="0%" x2="100%" y2="0%">
7714
7723
  <stop offset="0%" stop-color="#111111" stop-opacity="0.98" />
@@ -7732,11 +7741,17 @@ var watermarkifyScreenshotBuffer = async (buffer, meta, page = null) => {
7732
7741
  logger13.warning("watermarkify \u8DF3\u8FC7: \u65E0\u6CD5\u89E3\u6790\u622A\u56FE\u5C3A\u5BF8\u6216\u683C\u5F0F");
7733
7742
  return buffer;
7734
7743
  }
7744
+ const isMobileStrip = normalizeDevice(meta.device) === Device.Mobile && hasStrip;
7745
+ const outputImageInfo = isMobileStrip ? {
7746
+ ...imageInfo,
7747
+ imageHeight: imageInfo.height,
7748
+ height: imageInfo.height + MOBILE_STRIP_HEIGHT
7749
+ } : imageInfo;
7735
7750
  const overlaySvg = buildWatermarkifySvg(meta, imageInfo.width, imageInfo.height);
7736
7751
  if (!overlaySvg) {
7737
7752
  return buffer;
7738
7753
  }
7739
- return await composeScreenshotBufferWithBrowser(page, buffer, overlaySvg, imageInfo);
7754
+ return await composeScreenshotBufferWithBrowser(page, buffer, overlaySvg, outputImageInfo);
7740
7755
  };
7741
7756
 
7742
7757
  // src/internals/compression.js