@applitools/eyes-storybook 3.53.5 → 3.53.6

package/CHANGELOG.md

@@ -1,5 +1,58 @@
 # Changelog
 
+## [3.53.6](https://github.com/Applitools-Dev/sdk/compare/js/eyes-storybook@3.53.5...js/eyes-storybook@3.53.6) (2025-01-30)
+
+
+### Bug Fixes
+
+* storybook exception and add logs ([#2760](https://github.com/Applitools-Dev/sdk/issues/2760)) ([357193a](https://github.com/Applitools-Dev/sdk/commit/357193ad0f18eae729b4064d14d781e2401c70f7))
+
+
+### Dependencies
+
+* @applitools/dom-snapshot bumped to 4.11.15
+
+* @applitools/driver bumped to 1.20.4
+  #### Bug Fixes
+
+  * handle device screen info extraction gracefully ([#2757](https://github.com/Applitools-Dev/sdk/issues/2757)) ([92d0118](https://github.com/Applitools-Dev/sdk/commit/92d0118137b77e49d780092d110973df8ed8b40c))
+* @applitools/eyes bumped to 1.32.0
+  #### Features
+
+  * remove iPhoneX from list of available UFG Safari devices ([#2756](https://github.com/Applitools-Dev/sdk/issues/2756)) ([e24d054](https://github.com/Applitools-Dev/sdk/commit/e24d054328df900fbc4988fdbf8213aadffa9a37))
+
+
+
+* @applitools/spec-driver-webdriver bumped to 1.1.25
+
+* @applitools/spec-driver-selenium bumped to 1.5.95
+
+* @applitools/spec-driver-puppeteer bumped to 1.4.24
+
+* @applitools/screenshoter bumped to 3.10.5
+
+* @applitools/nml-client bumped to 1.8.24
+
+* @applitools/ufg-client bumped to 1.16.3
+  #### Bug Fixes
+
+  * unthrottle renders in offline mode ([#2754](https://github.com/Applitools-Dev/sdk/issues/2754)) ([b65d816](https://github.com/Applitools-Dev/sdk/commit/b65d81610504ae725b7b52611282a1bb28a049fe))
+* @applitools/ec-client bumped to 1.10.3
+
+* @applitools/core bumped to 4.31.0
+  #### Features
+
+  * remove iPhoneX from list of available UFG Safari devices ([#2756](https://github.com/Applitools-Dev/sdk/issues/2756)) ([e24d054](https://github.com/Applitools-Dev/sdk/commit/e24d054328df900fbc4988fdbf8213aadffa9a37))
+
+
+  #### Bug Fixes
+
+  * handle device screen info extraction gracefully ([#2757](https://github.com/Applitools-Dev/sdk/issues/2757)) ([92d0118](https://github.com/Applitools-Dev/sdk/commit/92d0118137b77e49d780092d110973df8ed8b40c))
+  * unthrottle renders in offline mode ([#2754](https://github.com/Applitools-Dev/sdk/issues/2754)) ([b65d816](https://github.com/Applitools-Dev/sdk/commit/b65d81610504ae725b7b52611282a1bb28a049fe))
+
+
+
+
 ## [3.53.5](https://github.com/Applitools-Dev/sdk/compare/js/eyes-storybook@3.53.4...js/eyes-storybook@3.53.5) (2025-01-23)
 
 

package/dist/getClientAPI.js

@@ -38,7 +38,16 @@ function __getClientAPI(...args) {
       ) {
         return API_VERSIONS.v4;
       } else {
-        throw new Error("Cannot get client API: couldn't detect storybook version");
+        const storybookVariablesOnWindow = Object.keys(frameWindow).filter(key =>
+          key.includes('STORYBOOK'),
+        );
+        throw new Error(
+          `Cannot get client API: couldn't detect storybook version.${
+          storybookVariablesOnWindow.length
+            ? ` Found the following storybook variables: ${storybookVariablesOnWindow.join(', ')}`
+            : ' - no STORYBOOK variables found in global scope'
+        }`,
+        );
       }
     }
     function onStoryRendered(callback) {
@@ -181,13 +190,18 @@ function __getClientAPI(...args) {
     throw new Error('Cannot get client API: no frameWindow');
   }
 
-  async function getClientAPIWithRetries() {
+  async function getClientAPIWithRetries({timeout = 10000} = {}) {
     let error = 'Unknown error';
-    for (let attempt = 1; attempt <= 100; attempt++) {
-      await new Promise(resolve => setTimeout(resolve, 100));
+    const RETRY_INTERVAL = 100;
+    const totalAttempts = timeout / RETRY_INTERVAL;
+    for (let attempt = 1; attempt <= totalAttempts; attempt++) {
+      await new Promise(resolve => setTimeout(resolve, RETRY_INTERVAL));
       try {
         return getClientAPI();
       } catch (e) {
+        if (!(attempt % 10)) {
+          console.log(`Error in getClientAPI: ${e.message}, attempt ${attempt}/${totalAttempts}`);
+        }
         error = e;
       }
     }

package/dist/getStories.js

@@ -38,7 +38,16 @@ function __getStories(...args) {
       ) {
         return API_VERSIONS.v4;
       } else {
-        throw new Error("Cannot get client API: couldn't detect storybook version");
+        const storybookVariablesOnWindow = Object.keys(frameWindow).filter(key =>
+          key.includes('STORYBOOK'),
+        );
+        throw new Error(
+          `Cannot get client API: couldn't detect storybook version.${
+          storybookVariablesOnWindow.length
+            ? ` Found the following storybook variables: ${storybookVariablesOnWindow.join(', ')}`
+            : ' - no STORYBOOK variables found in global scope'
+        }`,
+        );
       }
     }
     function onStoryRendered(callback) {
@@ -181,13 +190,18 @@ function __getStories(...args) {
     throw new Error('Cannot get client API: no frameWindow');
   }
 
-  async function getClientAPIWithRetries() {
+  async function getClientAPIWithRetries({timeout = 10000} = {}) {
     let error = 'Unknown error';
-    for (let attempt = 1; attempt <= 100; attempt++) {
-      await new Promise(resolve => setTimeout(resolve, 100));
+    const RETRY_INTERVAL = 100;
+    const totalAttempts = timeout / RETRY_INTERVAL;
+    for (let attempt = 1; attempt <= totalAttempts; attempt++) {
+      await new Promise(resolve => setTimeout(resolve, RETRY_INTERVAL));
       try {
         return getClientAPI();
       } catch (e) {
+        if (!(attempt % 10)) {
+          console.log(`Error in getClientAPI: ${e.message}, attempt ${attempt}/${totalAttempts}`);
+        }
         error = e;
       }
     }
@@ -368,7 +382,7 @@ function __getStories(...args) {
 
       async function _waitForClientAPI() {
         try {
-          return getClientAPI_1();
+          return getClientAPI_1({timeout});
         } catch (ex) {
           await delay(100);
           return _waitForClientAPI();

package/dist/renderStoryWithClientAPI.js

@@ -38,7 +38,16 @@ function __renderStoryWithClientAPI(...args) {
       ) {
         return API_VERSIONS.v4;
       } else {
-        throw new Error("Cannot get client API: couldn't detect storybook version");
+        const storybookVariablesOnWindow = Object.keys(frameWindow).filter(key =>
+          key.includes('STORYBOOK'),
+        );
+        throw new Error(
+          `Cannot get client API: couldn't detect storybook version.${
+          storybookVariablesOnWindow.length
+            ? ` Found the following storybook variables: ${storybookVariablesOnWindow.join(', ')}`
+            : ' - no STORYBOOK variables found in global scope'
+        }`,
+        );
       }
     }
     function onStoryRendered(callback) {
@@ -181,13 +190,18 @@ function __renderStoryWithClientAPI(...args) {
     throw new Error('Cannot get client API: no frameWindow');
   }
 
-  async function getClientAPIWithRetries() {
+  async function getClientAPIWithRetries({timeout = 10000} = {}) {
     let error = 'Unknown error';
-    for (let attempt = 1; attempt <= 100; attempt++) {
-      await new Promise(resolve => setTimeout(resolve, 100));
+    const RETRY_INTERVAL = 100;
+    const totalAttempts = timeout / RETRY_INTERVAL;
+    for (let attempt = 1; attempt <= totalAttempts; attempt++) {
+      await new Promise(resolve => setTimeout(resolve, RETRY_INTERVAL));
       try {
         return getClientAPI();
       } catch (e) {
+        if (!(attempt % 10)) {
+          console.log(`Error in getClientAPI: ${e.message}, attempt ${attempt}/${totalAttempts}`);
+        }
         error = e;
       }
     }

package/dist/runRunAfterScript.js

@@ -38,7 +38,16 @@ function __runRunAfterScript(...args) {
       ) {
         return API_VERSIONS.v4;
       } else {
-        throw new Error("Cannot get client API: couldn't detect storybook version");
+        const storybookVariablesOnWindow = Object.keys(frameWindow).filter(key =>
+          key.includes('STORYBOOK'),
+        );
+        throw new Error(
+          `Cannot get client API: couldn't detect storybook version.${
+          storybookVariablesOnWindow.length
+            ? ` Found the following storybook variables: ${storybookVariablesOnWindow.join(', ')}`
+            : ' - no STORYBOOK variables found in global scope'
+        }`,
+        );
       }
     }
     function onStoryRendered(callback) {
@@ -181,13 +190,18 @@ function __runRunAfterScript(...args) {
     throw new Error('Cannot get client API: no frameWindow');
   }
 
-  async function getClientAPIWithRetries() {
+  async function getClientAPIWithRetries({timeout = 10000} = {}) {
     let error = 'Unknown error';
-    for (let attempt = 1; attempt <= 100; attempt++) {
-      await new Promise(resolve => setTimeout(resolve, 100));
+    const RETRY_INTERVAL = 100;
+    const totalAttempts = timeout / RETRY_INTERVAL;
+    for (let attempt = 1; attempt <= totalAttempts; attempt++) {
+      await new Promise(resolve => setTimeout(resolve, RETRY_INTERVAL));
       try {
         return getClientAPI();
       } catch (e) {
+        if (!(attempt % 10)) {
+          console.log(`Error in getClientAPI: ${e.message}, attempt ${attempt}/${totalAttempts}`);
+        }
         error = e;
       }
     }

package/dist/runRunBeforeScript.js

@@ -38,7 +38,16 @@ function __runRunBeforeScript(...args) {
       ) {
         return API_VERSIONS.v4;
       } else {
-        throw new Error("Cannot get client API: couldn't detect storybook version");
+        const storybookVariablesOnWindow = Object.keys(frameWindow).filter(key =>
+          key.includes('STORYBOOK'),
+        );
+        throw new Error(
+          `Cannot get client API: couldn't detect storybook version.${
+          storybookVariablesOnWindow.length
+            ? ` Found the following storybook variables: ${storybookVariablesOnWindow.join(', ')}`
+            : ' - no STORYBOOK variables found in global scope'
+        }`,
+        );
       }
     }
     function onStoryRendered(callback) {
@@ -181,13 +190,18 @@ function __runRunBeforeScript(...args) {
     throw new Error('Cannot get client API: no frameWindow');
   }
 
-  async function getClientAPIWithRetries() {
+  async function getClientAPIWithRetries({timeout = 10000} = {}) {
     let error = 'Unknown error';
-    for (let attempt = 1; attempt <= 100; attempt++) {
-      await new Promise(resolve => setTimeout(resolve, 100));
+    const RETRY_INTERVAL = 100;
+    const totalAttempts = timeout / RETRY_INTERVAL;
+    for (let attempt = 1; attempt <= totalAttempts; attempt++) {
+      await new Promise(resolve => setTimeout(resolve, RETRY_INTERVAL));
       try {
         return getClientAPI();
       } catch (e) {
+        if (!(attempt % 10)) {
+          console.log(`Error in getClientAPI: ${e.message}, attempt ${attempt}/${totalAttempts}`);
+        }
         error = e;
       }
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applitools/eyes-storybook",
-  "version": "3.53.5",
+  "version": "3.53.6",
   "description": "",
   "keywords": [
     "applitools",
@@ -54,14 +54,14 @@
     "up:framework": "cd test/fixtures/storybook-versions/${APPLITOOLS_FRAMEWORK_VERSION} && npm ci"
   },
   "dependencies": {
-    "@applitools/core": "4.30.1",
-    "@applitools/driver": "1.20.3",
-    "@applitools/eyes": "1.31.3",
+    "@applitools/core": "4.31.0",
+    "@applitools/driver": "1.20.4",
+    "@applitools/eyes": "1.32.0",
     "@applitools/functional-commons": "1.6.0",
     "@applitools/logger": "2.1.0",
     "@applitools/monitoring-commons": "1.0.19",
-    "@applitools/spec-driver-puppeteer": "1.4.23",
-    "@applitools/ufg-client": "1.16.2",
+    "@applitools/spec-driver-puppeteer": "1.4.24",
+    "@applitools/ufg-client": "1.16.3",
     "@applitools/utils": "1.7.7",
     "boxen": "4.2.0",
     "chalk": "3.0.0",

package/src/browser/getClientAPI.js

@@ -35,7 +35,16 @@ function getClientAPI() {
     ) {
       return API_VERSIONS.v4;
     } else {
-      throw new Error("Cannot get client API: couldn't detect storybook version");
+      const storybookVariablesOnWindow = Object.keys(frameWindow).filter(key =>
+        key.includes('STORYBOOK'),
+      );
+      throw new Error(
+        `Cannot get client API: couldn't detect storybook version.${
+          storybookVariablesOnWindow.length
+            ? ` Found the following storybook variables: ${storybookVariablesOnWindow.join(', ')}`
+            : ' - no STORYBOOK variables found in global scope'
+        }`,
+      );
     }
   }
   function onStoryRendered(callback) {
@@ -178,13 +187,18 @@ function getFrameWindow() {
   throw new Error('Cannot get client API: no frameWindow');
 }
 
-async function getClientAPIWithRetries() {
+async function getClientAPIWithRetries({timeout = 10000} = {}) {
   let error = 'Unknown error';
-  for (let attempt = 1; attempt <= 100; attempt++) {
-    await new Promise(resolve => setTimeout(resolve, 100));
+  const RETRY_INTERVAL = 100;
+  const totalAttempts = timeout / RETRY_INTERVAL;
+  for (let attempt = 1; attempt <= totalAttempts; attempt++) {
+    await new Promise(resolve => setTimeout(resolve, RETRY_INTERVAL));
     try {
       return getClientAPI();
     } catch (e) {
+      if (!(attempt % 10)) {
+        console.log(`Error in getClientAPI: ${e.message}, attempt ${attempt}/${totalAttempts}`);
+      }
       error = e;
     }
   }

package/src/browser/getStories.js

@@ -172,7 +172,7 @@ async function getStories({timeout = DEFAULT_TIMEOUT} = {timeout: DEFAULT_TIMEOU
 
     async function _waitForClientAPI() {
       try {
-        return getClientAPI();
+        return getClientAPI({timeout});
       } catch (ex) {
         await delay(100);
         return _waitForClientAPI();

package/src/configParams.js

@@ -43,6 +43,7 @@ const configParams = [
   'notifyOnCompletion',
   'batchNotify',
   'dontCloseBatches',
+  'showBrowserLogs',
 ];
 
 module.exports = {configParams};

package/src/eyesStorybook.js

@@ -237,7 +237,7 @@ async function eyesStorybook({
     const [getStoriesErr, stories] = await readStoriesWithRetry(MAX_RETRIES);
 
     if (getStoriesErr) {
-      logger.log('Error in getStories:', getStoriesErr);
+      logger.log('Error when reading stories:', getStoriesErr);
       const failMsg = refineErrorMessage({
         prefix: 'Error when reading stories:',
         error: getStoriesErr,
@@ -290,13 +290,14 @@ async function eyesStorybook({
     if (stories?.length > 0 || remainingRetries == 0) {
       return [getStoriesErr, stories];
     } else {
+      remainingRetries--;
       if (getStoriesErr) {
-        logger.log('Error in getStories:', getStoriesErr);
+        logger.log('Error in getStories:', getStoriesErr, `, ${remainingRetries} retries are left`);
       } else {
-        logger.log(`Got 0 stories, retrying to read stories... ${remainingRetries - 1} are left`);
+        logger.log(`Got 0 stories, ${remainingRetries} retries are left`);
       }
       await delay(RETRY_INTERVAL);
-      return await readStoriesWithRetry(remainingRetries - 1);
+      return await readStoriesWithRetry(remainingRetries);
     }
   }
 }

package/src/getStoryData.js

@@ -13,9 +13,9 @@ const DOM_SNAPSHOTS_TIMEOUT = 5 * 60 * 1000;
 const utils = require('@applitools/utils');
 
 function makeGetStoryData({logger, takeDomSnapshots, reloadPagePerStory, navigationWaitUntil}) {
-  return async function getStoryData({story, storyUrl, page}) {
+  return async function getStoryData({story, storyUrl, page, pageId = 'mock'}) {
     const title = getStoryBaselineName(story);
-    logger.log(`getting data from story`, title);
+    logger.log(`[page ${pageId}] getting data from story`, title);
 
     const eyesParameters = story.parameters && story.parameters.eyes;
     if (story.isApi && !reloadPagePerStory) {
@@ -26,9 +26,9 @@ function makeGetStoryData({logger, takeDomSnapshots, reloadPagePerStory, navigat
           const err = await ptimeoutWithError(
             page.evaluate(renderStoryWithClientAPI, story.index, story.id),
             PAGE_EVALUATE_TIMEOUT,
-            new Error('page evaluate timed out!'),
+            new Error(`[page ${pageId}] page evaluate timed out!`),
           );
-          logger.log(`[story data] done with page evaluate for story ${title}`);
+          logger.log(`[page ${pageId}] done with page evaluate for story ${title}`);
           err && handleRenderStoryError(err);
         } catch (ex) {
           if (ex.message && !ex.message.includes('Eyes could not render stories properly'))
@@ -53,17 +53,17 @@ function makeGetStoryData({logger, takeDomSnapshots, reloadPagePerStory, navigat
 
     if (eyesParameters && eyesParameters.runBefore) {
       await page.evaluate(runRunBeforeScript, story.index).catch(err => {
-        logger.log(`error during runBefore: ${err}`); // it might be good to aggregate these errors and output them at the end of the run
+        logger.log(`[page ${pageId}] error during runBefore: ${err}`); // it might be good to aggregate these errors and output them at the end of the run
       });
     }
 
-    logger.log(`running takeDomSnapshot(s) for story ${title}`);
+    logger.log(`[page ${pageId}] running takeDomSnapshot(s) for story ${title}`);
     const domSnapshotsPromise = takeDomSnapshots({
       page,
       ...storyToCheckSettings({story}),
       waitBeforeCapture: wait
         ? async () => {
-            logger.log(`waiting before screenshot of ${title} ${wait}`);
+            logger.log(`[page ${pageId}] waiting before screenshot of ${title} ${wait}`);
             await waitFor(page, wait);
           }
         : undefined,
@@ -72,27 +72,27 @@ function makeGetStoryData({logger, takeDomSnapshots, reloadPagePerStory, navigat
     const result = await ptimeoutWithError(
       domSnapshotsPromise,
       DOM_SNAPSHOTS_TIMEOUT,
-      new Error(`timeout reached when trying to take DOM for story ${title}`),
+      new Error(`[page ${pageId}] timeout reached when trying to take DOM for story ${title}`),
     );
 
-    logger.log(`done getting DOM for story ${title}`);
+    logger.log(`[page ${pageId}] done getting DOM for story ${title}`);
 
     if (eyesParameters && eyesParameters.runAfter) {
       await page.evaluate(runRunAfterScript, story.index).catch(err => {
-        logger.log(`error during runAfter: ${err}`);
+        logger.log(`[page ${pageId}] error during runAfter: ${err}`);
       });
     }
 
-    logger.log(`done getting data from story`, title);
+    logger.log(`[page ${pageId}] done getting data from story`, title);
     return result;
 
     async function renderStoryLegacy() {
-      logger.log(`getting data from story ${storyUrl}`);
+      logger.log(`[page ${pageId}] getting data from story ${storyUrl}`);
       const [err] = await presult(
         page.goto(storyUrl, {timeout: PAGE_EVALUATE_TIMEOUT, waitUntil: navigationWaitUntil}),
       );
       if (err) {
-        logger.log(`error navigating to story ${storyUrl}`, err);
+        logger.log(`[page ${pageId}] error navigating to story ${storyUrl}`, err);
         throw err;
       }
     }
@@ -101,7 +101,7 @@ function makeGetStoryData({logger, takeDomSnapshots, reloadPagePerStory, navigat
       try {
         url = new URL(url);
       } catch (err) {
-        logger.error('Error during parsing page url', err);
+        logger.error(`[page ${pageId}] Error during parsing page url`, err);
         return false;
       }
 
@@ -124,7 +124,7 @@ function makeGetStoryData({logger, takeDomSnapshots, reloadPagePerStory, navigat
 
     // TODO (amit): handle this error in the caller (probably renderStories)
     function handleRenderStoryError(error) {
-      logger.log(error.message);
+      logger.log(`[page ${pageId}] ${error.message}`);
       const versionMsg = error.version
         ? ` The detected version of storybook is ${error.version}.`
         : '';

package/src/initPage.js

@@ -16,7 +16,9 @@ function makeInitPage({iframeUrl, config, browser, logger, getTransitiongIntoIE,
       browserLog({
         page,
         onLog: text => {
-          if (text.match(/\[dom-snapshot\]/)) {
+          if (config.showBrowserLogs) {
+            logger.log(`tab ${pageId}: ${text}`);
+          } else if (text.match(/\[dom-snapshot\]/)) {
             logger.log(`tab ${pageId}: ${text}`);
           }
         },

package/src/renderStories.js

@@ -2,7 +2,7 @@
 const getStoryUrl = require('./getStoryUrl');
 const getStoryBaselineName = require('./getStoryBaselineName');
 const ora = require('ora');
-const {presult} = require('@applitools/functional-commons');
+const {presult, delay} = require('@applitools/functional-commons');
 
 const MAX_RETRIES = 30;
 const RETRY_INTERVAL = 1000;
@@ -67,6 +67,7 @@ function makeRenderStories({
               story,
               storyUrl,
               page,
+              pageId,
             }),
           );
 
@@ -91,6 +92,7 @@ function makeRenderStories({
                 story,
                 storyUrl,
                 page: newPageObj.page,
+                pageId: newPageObj.pageId,
               }),
             );
             error = newError;
@@ -168,11 +170,13 @@ function makeRenderStories({
   };
 
   async function getClientAPIWithRetry(page, remainingRetries) {
-    const [err] = await presult(page.evaluate(getClientAPI));
+    const [err] = await presult(page.evaluate(getClientAPI, {timeout: 10000}));
     if (!err || remainingRetries == 0) {
       return [err];
     } else if (err) {
-      logger.log('Error in getClientAPI:', err, `retrying... ${remainingRetries - 1} are left`);
+      logger.log(
+        `Error in getClientAPI: ${err.message} retrying... ${remainingRetries - 1} are left`,
+      );
       await delay(RETRY_INTERVAL);
       return await getClientAPIWithRetry(page, remainingRetries - 1);
     }