pass down compareAfterShot

docs/api-reference/lostpixel.config.js-or-ts.md

@@ -108,9 +108,9 @@ description: >-
   * **Optional**
   * Defaults to `2000`
   * Time to wait between flakyness retries.
-* **compareAfterShots**: `boolean`
+* **compareAfterShot**: `boolean`
   * **Optional**
   * Defaults to `false`
   * Compare the shots right after taking them, instead of taking all the shots and them comparing them all.
 
-      Further information on [compareAfterShots.md](../recipes/general-recipes/compareAfterShots.md "mention").
+      Further information on [compareAfterShot.md](../recipes/general-recipes/compareAfterShot.md "mention").

docs/recipes/general-recipes/compareAfterShots.md

@@ -2,12 +2,12 @@
 
 By default, only a single screenshot of the page is taken.
 
-The [lostpixel.config.ts|js](../../api-reference/lostpixel.config.js-or-ts.md) file has a boolean property called `compareAfterShots`.
+The [lostpixel.config.ts|js](../../api-reference/lostpixel.config.js-or-ts.md) file has a boolean property called `compareAfterShot`.
 
 By default, Lost Pixel first takes all of the screenshots and then compare them all with the baseline images.
 
 In the default behavior, together with `flakynessRetries`, it takes at least 2 screenshots until a stable image hash is reached, being this second one possibly unnecessary if the first one was already correct.
 
-The `compareAfterShots` option changes this strategy so it only retries if the image fails, possibly halving the time taken if all of the first shots are correct and reducing the run flakiness as a stable hash of a shot could be reached while the image could still not be in its final UI state.
+The `compareAfterShot` option changes this strategy so it only retries if the image fails, possibly halving the time taken if all of the first shots are correct and reducing the run flakiness as a stable hash of a shot could be reached while the image could still not be in its final UI state.
 
 The option `compareConcurrency` isn't considered if this option is used.

src/config.ts

@@ -366,7 +366,7 @@ const BaseConfigSchema = z.object({
    * taking all the shots and them comparing them all.
    * @default false
    */
-  compareAfterShots: z.boolean().default(false),
+  compareAfterShot: z.boolean().default(false),
 });
 
 export const PlatformModeConfigSchema = BaseConfigSchema.extend({

src/createShots.ts

@@ -33,9 +33,11 @@ import {
 import type { Differences } from './checkDifferences';
 import { takeScreenShots } from './shots/shots';
 
-export const createShots = async (): Promise<{
+export const createShots = async ({ compareAfterShot }: {
+  compareAfterShot?: boolean
+} = {}): Promise<{
   shotItems: ShotItem[];
-  /** Defined if using compareAfterShots option */
+  /** Defined if using compareAfterShot option */
   differences?: Differences;
 }> => {
   const {
@@ -127,7 +129,7 @@ export const createShots = async (): Promise<{
           } ladle stories for screenshots on ${browser.name()}`,
         );
 
-        mergeDifferences(await takeScreenShots(shotItems, browser));
+        mergeDifferences(await takeScreenShots(shotItems, { browser, compareAfterShot }));
       });
 
       localServer?.close();
@@ -194,7 +196,7 @@ export const createShots = async (): Promise<{
           } Histoire stories for screenshots on ${browser.name()}`,
         );
 
-        mergeDifferences(await takeScreenShots(shotItems, browser));
+        mergeDifferences(await takeScreenShots(shotItems, { browser, compareAfterShot }));
       });
 
       localServer?.close();
@@ -260,7 +262,7 @@ export const createShots = async (): Promise<{
           } stories for screenshots on ${browser.name()}`,
         );
 
-        mergeDifferences(await takeScreenShots(shotItems, browser));
+        mergeDifferences(await takeScreenShots(shotItems, { browser, compareAfterShot }));
       });
 
       localServer?.close();
@@ -319,7 +321,7 @@ export const createShots = async (): Promise<{
         } pages for screenshots on ${browser.name()}`,
       );
 
-      mergeDifferences(await takeScreenShots(shotItems, browser));
+      mergeDifferences(await takeScreenShots(shotItems, { browser, compareAfterShot }));
     });
 
     log.process('info', 'general', 'Screenshots done!');

src/runner.ts

@@ -47,7 +47,7 @@ export const runner = async (config: GenerateOnlyModeConfig) => {
 
     log.process('info', 'general', '📸 Creating shots');
     const { shotItems, differences: differencesCreateShots } =
-      await createShots();
+      await createShots({ compareAfterShot: config.compareAfterShot });
 
     const createShotsStop = process.hrtime(createShotsStart);
 
@@ -339,8 +339,7 @@ export const platformRunner = async (
         [
           `🏙 `,
           `${shotItems.length} shot(s) in total.`,
-          `${shotItems.length - requiredFileHashes.length
-          } shot(s) already exist on platform.`,
+          `${shotItems.length - requiredFileHashes.length} shot(s) already exist on platform.`,
           `${requiredFileHashes.length} shot(s) will be uploaded at ${uploadUrl}.`,
         ].join(' '),
       );

src/shots/shots.ts

@@ -21,10 +21,12 @@ const takeScreenShot = async ({
   browser,
   item: [index, shotItem],
   logger,
+  compareAfterShot
 }: {
   browser: Browser;
   item: [number, ShotItem];
   logger: ReturnType<typeof log.item>;
+  compareAfterShot?: boolean
 }): Promise<{
   success: boolean;
   /** Defined if using compareAfterShot */
@@ -156,6 +158,9 @@ const takeScreenShot = async ({
       retryCount <= config.flakynessRetries;
       retryCount++
     ) {
+      if (retryCount > 0)
+        await sleep(config.waitBetweenFlakynessRetries);
+
       const screenshotOptions: PageScreenshotOptions = {
         path: shotItem.filePathCurrent,
         animations: 'disabled',
@@ -176,11 +181,11 @@ const takeScreenShot = async ({
         });
       }
 
-      if (config.compareAfterShots) {
+      if (compareAfterShot) {
         logger.process(
           'info',
           'general',
-          `Screenshot of '${shotItem.shotName}' taken (Retry ${retryCount}). Now comparing.`,
+          `Screenshot of '${shotItem.shotName}' taken${config.flakynessRetries > 0 ? ` (Retry ${retryCount})` : ''}. Now comparing.`,
         );
         difference = await checkDifference({
           item: [index, shotItem],
@@ -197,17 +202,12 @@ const takeScreenShot = async ({
             `Screenshot of '${shotItem.shotName}' taken (Retry ${retryCount}). Hash: ${currentShotHash} - Previous hash: ${lastShotHash}`,
           );
 
-          if (lastShotHash === currentShotHash) {
+          if (lastShotHash === currentShotHash)
             break;
-          }
         }
 
         lastShotHash = currentShotHash;
       }
-
-      if (retryCount < config.flakynessRetries) {
-        await sleep(config.waitBetweenFlakynessRetries);
-      }
     }
 
     success = true;
@@ -239,13 +239,16 @@ const takeScreenShot = async ({
 
 export const takeScreenShots = async (
   shotItems: ShotItem[],
-  _browser?: BrowserType,
+  props: {
+    browser?: BrowserType,
+    compareAfterShot?: boolean
+  }
 ): Promise<{ differences?: Differences }> => {
-  const browser = await (_browser ?? getBrowser()).launch();
+  const browser = await (props.browser ?? getBrowser()).launch();
   const total = shotItems.length;
 
   const differences: Differences | undefined =
-    config.compareAfterShots
+    props.compareAfterShot
       ? {
         aboveThresholdDifferenceItems: [],
         comparisonResults: {},
@@ -284,7 +287,7 @@ export const takeScreenShots = async (
           `Screenshot of '${shotItem.shotName}' taken and saved to '${shotItem.filePathCurrent}' in ${elapsedTime}s`,
         );
 
-        if (config.compareAfterShots && differences && result.difference)
+        if (config.compareAfterShot && differences && result.difference)
           addDifferenceToDifferences({ difference: result.difference, differences, shotItem });
 
       } else {