fix: produce screenshots data always (#623)

* fix: produce screenshots data always * add comment
elastic · Oct 6, 2022 · 622a35e · 622a35e
1 parent 3372f03
commit 622a35e
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 11 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -53,7 +53,7 @@
     "micromatch": "^4.0.5",
     "playwright-chromium": "=1.26.0",
     "playwright-core": "=1.26.0",
-    "sharp": "^0.31.0",
+    "sharp": "^0.31.1",
     "snakecase-keys": "^4.0.0",
     "sonic-boom": "^3.2.0",
     "ts-node": "^10.9.1",

diff --git a/src/reporters/json.ts b/src/reporters/json.ts
@@ -224,8 +224,7 @@ function stepInfo(
 }
 
 export async function getScreenshotBlocks(screenshot: Buffer) {
-  const img = sharp(screenshot, { sequentialRead: true });
-  const { width, height } = await img.metadata();
+  const { width, height } = await sharp(screenshot).metadata();
   /**
    * Chop the screenshot image (1280*720) which is the default
    * viewport size in to 64 equal blocks for a given image
@@ -248,7 +247,9 @@ export async function getScreenshotBlocks(screenshot: Buffer) {
     const top = row * blockHeight;
     for (let col = 0; col < divisions; col++) {
       const left = col * blockWidth;
-      const buf = await img
+      // We create a new sharp instance for each block to avoid
+      // running in to extraction/orientation issues
+      const buf = await sharp(screenshot, { sequentialRead: true })
         .extract({ top, left, width: blockWidth, height: blockHeight })
         .jpeg()
         .toBuffer();