DSW-2365: Enable pause before screenshot on specific VRT tests

justeattakeaway · Sep 12, 2024 · 37c064e · 37c064e
1 parent 7a75d17
commit 37c064e
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 4 deletions.
diff --git a/nextjs-app-v13/test/visual/nextjs.spec.js b/nextjs-app-v13/test/visual/nextjs.spec.js
@@ -16,7 +16,7 @@ describe('NextJS Aperture App', () => {
         { url: '/components/icon.html', name: 'Icon' },
         { url: '/components/icon-button.html', name: 'Icon Button' },
         { url: '/components/link.html', name: 'Link' },
-        { url: '/components/lottie-player.html', name: 'Lottie Player' },
+        { url: '/components/lottie-player.html', name: 'Lottie Player', pauseBeforeScreenshot: true },
         { url: '/components/modal.html', name: 'Modal' },
         { url: '/components/notification.html', name: 'Notification' },
         { url: '/components/spinner.html', name: 'Spinner' },
@@ -30,6 +30,9 @@ describe('NextJS Aperture App', () => {
         it(`should navigate to the ${page.name} page.`, async () => {
             await browser.url(`${page.url}?PERCY=true`);
             await waitForPageTitleToBe(page.name);
+            // Some components might require extra time to mount and load its dependencies.
+            // Delaying the screenshot helps to avoid false negatives in diffs.
+            if (page.pauseBeforeScreenshot) await browser.pause(5000);
             await percyScreenshot(page.name);
         });
     });

diff --git a/nextjs-app-v14/test/visual/nextjs.spec.js b/nextjs-app-v14/test/visual/nextjs.spec.js
@@ -16,7 +16,7 @@ describe('NextJS Aperture App', () => {
         { url: '/components/icon', name: 'Icon' },
         { url: '/components/icon-button', name: 'Icon Button' },
         { url: '/components/link', name: 'Link' },
-        { url: '/components/lottie-player', name: 'Lottie Player' },
+        { url: '/components/lottie-player', name: 'Lottie Player', pauseBeforeScreenshot: true },
         { url: '/components/modal', name: 'Modal' },
         { url: '/components/notification', name: 'Notification' },
         { url: '/components/spinner', name: 'Spinner' },
@@ -30,6 +30,9 @@ describe('NextJS Aperture App', () => {
         it(`should navigate to the ${page.name} page.`, async () => {
             await browser.url(`${page.url}?PERCY=true`);
             await waitForPageTitleToBe(page.name);
+            // Some components might require extra time to mount and load its dependencies.
+            // Delaying the screenshot helps to avoid false negatives in diffs.
+            if (page.pauseBeforeScreenshot) await browser.pause(5000);
             await percyScreenshot(page.name);
         });
     });

diff --git a/nuxt-app/test/visual/nuxt.spec.js b/nuxt-app/test/visual/nuxt.spec.js
@@ -16,7 +16,7 @@ describe('Nuxt Aperture App', () => {
         { url: '/components/icon.html', name: 'Icon' },
         { url: '/components/icon-button.html', name: 'Icon Button' },
         { url: '/components/link.html', name: 'Link' },
-        { url: '/components/lottie-player.html', name: 'Lottie Player' },
+        { url: '/components/lottie-player.html', name: 'Lottie Player', pauseBeforeScreenshot: true },
         { url: '/components/modal.html', name: 'Modal' },
         { url: '/components/notification.html', name: 'Notification' },
         { url: '/components/spinner.html', name: 'Spinner' },
@@ -30,6 +30,9 @@ describe('Nuxt Aperture App', () => {
         it(`should navigate to the ${page.name} page.`, async () => {
             await browser.url(`${page.url}?PERCY=true`);
             await waitForPageTitleToBe(page.name);
+            // Some components might require extra time to mount and load its dependencies.
+            // Delaying the screenshot helps to avoid false negatives in diffs.
+            if (page.pauseBeforeScreenshot) await browser.pause(5000);
             await percyScreenshot(page.name);
         });
     });

diff --git a/vanilla-app/test/visual/vanilla.spec.js b/vanilla-app/test/visual/vanilla.spec.js
@@ -16,7 +16,7 @@ describe('Vanilla Aperture App', () => {
         { url: '/components/icon.html', name: 'Icon' },
         { url: '/components/icon-button.html', name: 'Icon Button' },
         { url: '/components/link.html', name: 'Link' },
-        { url: '/components/lottie-player.html', name: 'Lottie Player' },
+        { url: '/components/lottie-player.html', name: 'Lottie Player', pauseBeforeScreenshot: true },
         { url: '/components/modal.html', name: 'Modal' },
         { url: '/components/notification.html', name: 'Notification' },
         { url: '/components/spinner.html', name: 'Spinner' },
@@ -30,6 +30,9 @@ describe('Vanilla Aperture App', () => {
         it(`should navigate to the ${page.name} page.`, async () => {
             await browser.url(`${page.url}?PERCY=true`);
             await waitForPageTitleToBe(page.name);
+            // Some components might require extra time to mount and load its dependencies.
+            // Delaying the screenshot helps to avoid false negatives in diffs.
+            if (page.pauseBeforeScreenshot) await browser.pause(5000);
             await percyScreenshot(page.name);
         });
     });