@argos-ci/webdriverio 0.4.0 → 0.5.0

package/dist/index.cjs

@@ -1,8 +1,6 @@
-// @ts-ignore
-const argosScreenshot = async (...args)=>{
-    // @ts-ignore
-    const { argosScreenshot } = await import('./index.mjs');
-    return argosScreenshot(...args);
+const argosScreenshot = async (...args) => {
+  const { argosScreenshot } = await import("./index.mjs");
+  return argosScreenshot(...args);
 };
-// @ts-ignore
+
 exports.argosScreenshot = argosScreenshot;

package/dist/index.d.ts

@@ -31,4 +31,5 @@ type ArgosScreenshotOptions = {
  * Default color is pink #FF00FF.
  */
 declare function argosScreenshot(browser: WebdriverIO.Browser, name: string, { mask, maskColor }?: ArgosScreenshotOptions): Promise<Buffer>;
-export { ArgosScreenshotOptions, argosScreenshot };
+
+export { type ArgosScreenshotOptions, argosScreenshot };

package/dist/index.js

@@ -0,0 +1,74 @@
+// src/index.ts
+import sharp from "sharp";
+import { resolve } from "node:path";
+import { mkdir } from "node:fs/promises";
+async function createMask(dimensions, areas, maskColor) {
+  let mask = sharp({
+    create: {
+      width: dimensions.width,
+      height: dimensions.height,
+      channels: 4,
+      background: { r: 0, g: 0, b: 0, alpha: 0 }
+    }
+  });
+  const areasImages = areas.map((coords) => ({
+    input: Buffer.from(
+      '<svg><rect x="0" y="0" width="' + coords.width + '" height="' + coords.height + `" fill="${maskColor}"/></svg>`
+    ),
+    top: coords.y,
+    left: coords.x
+  }));
+  mask = mask.composite(areasImages);
+  return mask.png().toBuffer();
+}
+async function applyMask(image, mask) {
+  try {
+    return await sharp(image).composite([
+      {
+        input: mask,
+        blend: "over"
+      }
+    ]).png().toBuffer();
+  } catch (err) {
+    throw new Error("Error applying mask", { cause: err });
+  }
+}
+async function getImageDimensions(buffer) {
+  try {
+    const imageInfo = await sharp(buffer).metadata();
+    const { width, height } = imageInfo;
+    if (!width || !height) {
+      throw new Error("Dimensions not found.");
+    }
+    return { width, height };
+  } catch (err) {
+    throw new Error("Error getting image dimensions", { cause: err });
+  }
+}
+async function getScreenshotPath(name) {
+  if (name.endsWith(".png")) return name;
+  const screenshotFolder = resolve(process.cwd(), "screenshots/argos");
+  await mkdir(screenshotFolder, { recursive: true });
+  return resolve(screenshotFolder, name + ".png");
+}
+async function argosScreenshot(browser, name, { mask, maskColor = "#FF00FF" } = {}) {
+  if (!browser) {
+    throw new Error("A WebdriverIO `browser` object is required.");
+  }
+  if (!name) {
+    throw new Error("The `name` argument is required.");
+  }
+  const screenshotPath = await getScreenshotPath(name);
+  const imageBuffer = await browser.saveScreenshot(screenshotPath);
+  if (!mask) {
+    return imageBuffer;
+  }
+  const dimensions = await getImageDimensions(imageBuffer);
+  const maskBuffer = await createMask(dimensions, mask, maskColor);
+  const maskedBuffer = await applyMask(imageBuffer, maskBuffer);
+  await sharp(maskedBuffer).toFile(screenshotPath);
+  return maskedBuffer;
+}
+export {
+  argosScreenshot
+};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@argos-ci/webdriverio",
   "description": "WebdriverIO SDK for visual testing with Argos.",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "author": "Smooth Code",
   "license": "MIT",
   "repository": {
@@ -30,9 +30,9 @@
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
-      "import": "./dist/index.mjs",
+      "import": "./dist/index.js",
       "require": "./dist/index.cjs",
-      "default": "./dist/index.mjs"
+      "default": "./dist/index.cjs"
     },
     "./package.json": "./package.json"
   },
@@ -46,7 +46,7 @@
     "sharp": "^0.33.5"
   },
   "devDependencies": {
-    "@argos-ci/cli": "2.4.7",
+    "@argos-ci/cli": "2.5.0",
     "@wdio/cli": "^9.2.1",
     "@wdio/globals": "^9.2.1",
     "@wdio/local-runner": "^9.2.1",
@@ -59,11 +59,10 @@
     "webdriverio": "^9.2.1"
   },
   "scripts": {
-    "prebuild": "rm -rf dist",
-    "build": "rollup -c",
+    "build": "tsup && cp ./src/index.cjs ./dist",
     "test": "wdio run ./wdio.conf.ts",
     "argos-upload": "pnpm exec argos upload screenshots --build-name \"argos-webdriverio-e2e-node-$NODE_VERSION-$OS\"",
     "e2e": "pnpm run test && pnpm run argos-upload"
   },
-  "gitHead": "d0fa8cd790ffd2343d1cd32706bcb757c4f3b26e"
+  "gitHead": "fe6e055a43e955e7df362ddaec59c84dc274bbb2"
 }

package/dist/index.mjs

@@ -1,99 +0,0 @@
-import sharp from 'sharp';
-import { resolve } from 'node:path';
-import { mkdir } from 'node:fs/promises';
-
-// Function to create a mask with Sharp
-async function createMask(dimensions, areas, maskColor) {
-    // Start with a black image
-    let mask = sharp({
-        create: {
-            width: dimensions.width,
-            height: dimensions.height,
-            channels: 4,
-            background: {
-                r: 0,
-                g: 0,
-                b: 0,
-                alpha: 0
-            }
-        }
-    });
-    const areasImages = areas.map((coords)=>({
-            input: Buffer.from('<svg><rect x="0" y="0" width="' + coords.width + '" height="' + coords.height + `" fill="${maskColor}"/></svg>`),
-            top: coords.y,
-            left: coords.x
-        }));
-    mask = mask.composite(areasImages);
-    return mask.png().toBuffer();
-}
-async function applyMask(image, mask) {
-    try {
-        return await sharp(image).composite([
-            {
-                input: mask,
-                blend: "over"
-            }
-        ]).png().toBuffer();
-    } catch (err) {
-        throw new Error("Error applying mask", {
-            cause: err
-        });
-    }
-}
-async function getImageDimensions(buffer) {
-    try {
-        const imageInfo = await sharp(buffer).metadata();
-        const { width, height } = imageInfo;
-        if (!width || !height) {
-            throw new Error("Dimensions not found.");
-        }
-        return {
-            width,
-            height
-        };
-    } catch (err) {
-        throw new Error("Error getting image dimensions", {
-            cause: err
-        });
-    }
-}
-async function getScreenshotPath(name) {
-    if (name.endsWith(".png")) return name;
-    const screenshotFolder = resolve(process.cwd(), "screenshots/argos");
-    await mkdir(screenshotFolder, {
-        recursive: true
-    });
-    return resolve(screenshotFolder, name + ".png");
-}
-/**
- * Take a screenshot of the current page, optionally masking certain areas.
- * @param browser A WebdriverIO `browser` object.
- * @param name The name of the screenshot or the full path to the screenshot.
- * @param options Options to customize the screenshot.
- * @param options.mask
- * Specify ares that should be masked when the screenshot is taken.
- * Masked elements will be overlaid with a pink box #FF00FF (customized by maskColor)
- * that completely covers its bounding box.
- * @param options.maskColor
- * Specify the color of the overlay box for masked elements, in CSS color format.
- * Default color is pink #FF00FF.
- */ async function argosScreenshot(browser, name, { mask, maskColor = "#FF00FF" } = {}) {
-    if (!browser) {
-        throw new Error("A WebdriverIO `browser` object is required.");
-    }
-    if (!name) {
-        throw new Error("The `name` argument is required.");
-    }
-    const screenshotPath = await getScreenshotPath(name);
-    const imageBuffer = await browser.saveScreenshot(screenshotPath);
-    if (!mask) {
-        return imageBuffer;
-    }
-    const dimensions = await getImageDimensions(imageBuffer);
-    const maskBuffer = await createMask(dimensions, mask, maskColor);
-    const maskedBuffer = await applyMask(imageBuffer, maskBuffer);
-    await sharp(maskedBuffer).toFile(screenshotPath);
-    return maskedBuffer;
-}
-
-export { argosScreenshot };