flexysnap 0.5.1 → 0.5.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "flexysnap",
-  "version": "0.5.1",
+  "version": "0.5.3",
   "description": "Flexible visual snapshot testing for Playwright, built for e-commerce.",
   "keywords": [
     "playwright",

package/src/testUtils.js

@@ -6,29 +6,58 @@ async function callClosePopups(page) {
     await closePopups(page);
 }
 
-function logIfErrorResponse(response, url) {
+
+async function attemptNavigation(page, url, timeout) {
+    logTimestamp('Loading ' + url);
+    let response = null;
+    try {
+        response = await page.goto(url, {timeout: timeout, waitUntil: "commit"});
+    } catch (e) {
+        logTimestamp('Error navigating to page');
+        throw e
+    }
     if (response && response.status() >= 400) {
         logTimestamp(`HTTP error ${response.status()} ${response.statusText()} while loading ${url}`);
+        throw new Error('Could not load page.')
+    }
+    try {
+        await page.waitForLoadState('domcontentloaded', {timeout: timeout});
+    } catch (e) {
+        logTimestamp('Error while waiting for DOMContentLoaded event');
+        throw e
+    }
+    try {
+        await page.waitForLoadState('load', {timeout: timeout});
+    } catch (e) {
+        logTimestamp('Error while waiting for load event');
+        throw e
     }
 }
 
-async function gotoWithRetry(page, url) {
-    let response;
-	try {
-		logTimestamp('Loading ' + url);
-		response = await page.goto(url, { timeout: 5000, waitUntil: "commit" });
-	} catch (firstError) {
-        logTimestamp(firstError);
-		logTimestamp('Retry loading ' + url);
-		response = await page.goto(url, { timeout: 5000, waitUntil: "commit" });
-	}
-    logIfErrorResponse(response, url);
-    try {
-        await waitForCompleteLoad(page);
-    } catch(e) {
-        logTimestamp(await page.pageErrors());
-        throw e;
+async function prepareRetry(page, waitMs) {
+    await page.goto('about:blank', { timeout: 5000 }).catch(() => {});
+    logTimestamp(`Waiting ${waitMs}ms before retrying`);
+    await page.waitForTimeout(waitMs);
+}
+
+async function gotoWithRetry(page, url, options = {}) {
+    const { baseTimeout = 20000, backoffMs = 3000 } = options;
+    const maxAttempts = 3;
+    let error = null;
+    for (let i = 1; i <= maxAttempts; ++i) {
+        error = null;
+        const timeout = baseTimeout * i;
+        try {
+            await attemptNavigation(page, url, timeout);
+            break
+        } catch (e) {
+            error = e
+            if (i < maxAttempts)
+                await prepareRetry(page, backoffMs * i);
+        }
     }
+    if (error)
+        throw error
 }
 
 
@@ -47,11 +76,26 @@ function setCacheableUrlPattern(pattern) {
     cacheableUrlPatterns.push(pattern)
 }
 
+const cacheBustedResourceTypes = ['document', 'xhr', 'fetch'];
+
+function isTestedSiteUrl(url) {
+    return baseUrl !== '' && url.href.includes(baseUrl);
+}
+
 test.beforeEach(async ({ context }) => {
     startTimer();
     logTimestamp('Test execution started');
-    await context.route('**/*', route => {
+    context.on('requestfailed', request => {
+        const errorText = request.failure()?.errorText;
+        logTimestamp(`Request failed: ${request.method()} ${request.url()} - ${errorText}`);
+    });
+    await context.route(isTestedSiteUrl, route => {
         const req = route.request();
+
+        if (!cacheBustedResourceTypes.includes(req.resourceType())) {
+            return route.continue();
+        }
+
         const url = new URL(req.url());
         const path = url.pathname.toLowerCase();
 
@@ -60,7 +104,7 @@ test.beforeEach(async ({ context }) => {
                 return route.continue();
         }
 
-        if (req.method() !== 'GET' || path.includes('/wp-content/') || !url.href.includes(baseUrl)) {
+        if (req.method() !== 'GET') {
             return route.continue();
         }
         url.searchParams.set('_cb', Date.now().toString());
@@ -94,21 +138,9 @@ function logTimestamp(eventName) {
     return { currentTime, elapsedMs, elapsedSec };
 }
 
-async function waitForCompleteLoad(page) {
-    try {
-        await page.waitForLoadState('domcontentloaded', { timeout: 5000 });
-    } catch (e) {
-        logTimestamp(e);
-        logTimestamp('Retry waiting for DOMContentLoaded event after 5 seconds');
-        await page.waitForLoadState('domcontentloaded', { timeout: 5000 });
-    }
-    try {
-        await page.waitForLoadState('load', { timeout: 5000 });
-    } catch (e) {
-        logTimestamp(e);
-        logTimestamp('Retry waiting for load event after 5 seconds');
-        await page.waitForLoadState('load', { timeout: 5000 });
-    }
+async function waitForCompleteLoad(page, timeout = 5000) {
+    await page.waitForLoadState('domcontentloaded', { timeout: timeout });
+    await page.waitForLoadState('load', { timeout: timeout });
 }