flexysnap 0.5.2 → 0.5.4

package/package.json

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

package/src/testUtils.js

@@ -7,43 +7,92 @@ async function callClosePopups(page) {
 }
 
 
-async function gotoWithRetry(page, 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
+    }
+}
+
+const CLOSE_STUCK_TARGET_TIMEOUT_MS = 5000;
+const replacementContexts = [];
+
+function closeWithinTimeout(closeable, timeoutMs) {
+    let timeoutHandle;
+    const timeoutPromise = new Promise(resolve => {
+        timeoutHandle = setTimeout(resolve, timeoutMs);
+    });
+    const closePromise = closeable.close().catch(() => {});
+    return Promise.race([closePromise, timeoutPromise]).finally(() => clearTimeout(timeoutHandle));
+}
+
+async function openReplacementPage(stuckPage, contextOptions) {
+    const stuckContext = stuckPage.context();
+    const browser = stuckContext.browser();
+
+    if (!browser) {
+        await closeWithinTimeout(stuckPage, CLOSE_STUCK_TARGET_TIMEOUT_MS);
+        return stuckContext.newPage();
+    }
+
+    const viewport = stuckPage.viewportSize();
+    await closeWithinTimeout(stuckContext, CLOSE_STUCK_TARGET_TIMEOUT_MS);
+
+    const replacementContext = await browser.newContext({ viewport, ...contextOptions });
+    replacementContexts.push(replacementContext);
+    await configureContext(replacementContext);
+
+    return replacementContext.newPage();
+}
+
+async function prepareRetry(stuckPage, waitMs, contextOptions) {
+    logTimestamp('Discarding stuck page and opening a new browser context');
+    const replacementPage = await openReplacementPage(stuckPage, contextOptions);
+    logTimestamp(`Waiting ${waitMs}ms before retrying`);
+    await replacementPage.waitForTimeout(waitMs);
+    return replacementPage;
+}
+
+async function gotoWithRetry(page, url, options = {}) {
+    const { baseTimeout = 20000, backoffMs = 3000, contextOptions = {} } = options;
+    const maxAttempts = 3;
     let error = null;
-    for (let i = 1; i <= 3; ++i) {
+    let currentPage = page;
+    for (let i = 1; i <= maxAttempts; ++i) {
         error = null;
-        let timeout = i * 5000;
-        logTimestamp('Loading ' + url);
-        let response = null;
-        try {
-            response = await page.goto(url, {timeout: timeout, waitUntil: "commit"});
-        } catch (e) {
-            logTimestamp('Error navigating to page');
-            error = e
-            continue
-        }
-        if (response && response.status() >= 400) {
-            logTimestamp(`HTTP error ${response.status()} ${response.statusText()} while loading ${url}`);
-            error = new Error('Could not load page.')
-            continue
-        }
+        const timeout = baseTimeout * i;
         try {
-            await page.waitForLoadState('domcontentloaded', {timeout: timeout});
+            await attemptNavigation(currentPage, url, timeout);
+            break
         } catch (e) {
-            logTimestamp('Error while waiting for DOMContentLoaded event');
             error = e
-            continue
+            if (i < maxAttempts)
+                currentPage = await prepareRetry(currentPage, backoffMs * i, contextOptions);
         }
-        try {
-            await page.waitForLoadState('load', {timeout: timeout});
-        } catch (e) {
-            logTimestamp('Error while waiting for load event');
-            error = e
-            continue
-        }
-        break
     }
     if (error)
         throw error
+    return currentPage;
 }
 
 
@@ -62,11 +111,24 @@ function setCacheableUrlPattern(pattern) {
     cacheableUrlPatterns.push(pattern)
 }
 
-test.beforeEach(async ({ context }) => {
-    startTimer();
-    logTimestamp('Test execution started');
-    await context.route('**/*', route => {
+const cacheBustedResourceTypes = ['document', 'xhr', 'fetch'];
+
+function isTestedSiteUrl(url) {
+    return baseUrl !== '' && url.href.includes(baseUrl);
+}
+
+async function configureContext(context) {
+    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();
 
@@ -75,7 +137,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());
@@ -83,6 +145,19 @@ test.beforeEach(async ({ context }) => {
         logTimestamp('Requesting ' + urlString);
         route.continue({ url: urlString });
     });
+}
+
+test.beforeEach(async ({ context }) => {
+    startTimer();
+    logTimestamp('Test execution started');
+    await configureContext(context);
+});
+
+test.afterEach(async () => {
+    const contextsToClose = replacementContexts.splice(0, replacementContexts.length);
+    for (const replacementContext of contextsToClose) {
+        await closeWithinTimeout(replacementContext, CLOSE_STUCK_TARGET_TIMEOUT_MS);
+    }
 });
 
 let testStartTime = null;