Updated tests

mgurgel · mgurgel · commit 2f4ae9a1cb02 · 2025-05-15T12:34:23.000+01:00
diff --git a/injected/integration-test/duckplayer-native.spec.js b/injected/integration-test/duckplayer-native.spec.js
@@ -13,6 +13,25 @@ test.describe('Duck Player Native messaging', () => {
 
         // Then Initial Setup should be called
         await duckPlayer.didSendInitialHandshake();
+
+        // And an onDuckPlayerScriptsReady event should be called
+        await duckPlayer.didSendDuckPlayerScriptsReady();
+    });
+
+    test('Responds to onUrlChanged', async ({ page }, workerInfo) => {
+        const duckPlayer = DuckPlayerNative.create(page, workerInfo);
+
+        // Given the duckPlayerNative feature is enabled
+        await duckPlayer.withRemoteConfig();
+
+        // When I go to a YouTube page
+        await duckPlayer.gotoYouTubePage();
+
+        // And the frontend receives an onUrlChanged event
+        await duckPlayer.sendURLChanged('NOCOOKIE');
+
+        // Then an onDuckPlayerScriptsReady event should be fired twice
+        await duckPlayer.didSendDuckPlayerScriptsReady(2);
     });
 
     test('Polls timestamp on YouTube', async ({ page }, workerInfo) => {
@@ -27,6 +46,19 @@ test.describe('Duck Player Native messaging', () => {
         // Then the current timestamp should be polled back to the browser
         await duckPlayer.didSendCurrentTimestamp();
     });
+
+    test('Polls timestamp on NoCookie page', async ({ page }, workerInfo) => {
+        const duckPlayer = DuckPlayerNative.create(page, workerInfo);
+
+        // Given the duckPlayerNative feature is enabled
+        await duckPlayer.withRemoteConfig();
+
+        // When I go to a NoCookie page
+        await duckPlayer.gotoNoCookiePage();
+
+        // Then the current timestamp should be polled back to the browser
+        await duckPlayer.didSendCurrentTimestamp();
+    });
 });
 
 test.describe('Duck Player Native thumbnail overlay', () => {
@@ -41,9 +73,31 @@ test.describe('Duck Player Native thumbnail overlay', () => {
         await duckPlayer.sendOnMediaControl();
 
         // Then I should see the thumbnail overlay in the page
-        await duckPlayer.didShowThumbnailOverlay();
+        await duckPlayer.didShowOverlay();
         await duckPlayer.didShowLogoInOverlay();
     });
+    test('Dismisses overlay on click', async ({ page }, workerInfo) => {
+        const duckPlayer = DuckPlayerNative.create(page, workerInfo);
+
+        // Given the duckPlayerNative feature is enabled
+        await duckPlayer.withRemoteConfig();
+
+        // When I go to a YouTube page
+        await duckPlayer.gotoYouTubePage();
+        await duckPlayer.sendOnMediaControl();
+
+        // And I see the thumbnail overlay in the page
+        await duckPlayer.didShowOverlay();
+
+        // And I click on the overlay
+        await duckPlayer.clickOnOverlay();
+
+        // Then the overlay should be dismissed
+        await duckPlayer.didDismissOverlay();
+
+        // And a didDismissOverlay event should be fired
+        await duckPlayer.didSendOverlayDismissalMessage();
+    });
 });
 
 test.describe('Duck Player Native custom error view', () => {
diff --git a/injected/integration-test/page-objects/duckplayer-native.js b/injected/integration-test/page-objects/duckplayer-native.js
@@ -4,13 +4,19 @@ import { perPlatform } from '../type-helpers.mjs';
 import { ResultsCollector } from './results-collector.js';
 
 /**
- * @import { PageType} from '../../src/features/duck-player-native.js'
+ * @import { PageType } from '../../src/features/duckplayer-native/messages.js'
  * @typedef {"default" | "incremental-dom" | "age-restricted-error" | "sign-in-error"} PlayerPageVariants
  */
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
 const configFiles = /** @type {const} */ (['native.json']);
 
+const defaultInitialSetup = {
+    locale: 'en',
+};
+
+const featureName = 'duckPlayerNative';
+
 export class DuckPlayerNative {
     /** @type {Partial<Record<PageType, string>>} */
     pages = {
@@ -29,9 +35,7 @@ export class DuckPlayerNative {
         this.platform = platform;
         this.collector = new ResultsCollector(page, build, platform);
         this.collector.withMockResponse({
-            initialSetup: {
-                locale: 'en',
-            },
+            initialSetup: defaultInitialSetup,
             onCurrentTimestamp: {},
         });
         this.collector.withUserPreferences({
@@ -79,7 +83,7 @@ export class DuckPlayerNative {
      * @param {string} [params.videoID]
      */
     async gotoPage(pageType, params = {}) {
-        await this.pageTypeIs(pageType);
+        await this.withPageType(pageType);
 
         const { variant = 'default', videoID = '123' } = params;
         const urlParams = new URLSearchParams([
@@ -107,14 +111,23 @@ export class DuckPlayerNative {
      * @param {PageType} pageType
      * @return {Promise<void>}
      */
-    async pageTypeIs(pageType) {
-        const initialSetupResponse = {
-            locale: 'en',
-            pageType,
-        };
+    async withPageType(pageType) {
+        const initialSetup = this.collector.mockResponses?.initialSetup || defaultInitialSetup;
 
         await this.collector.updateMockResponse({
-            initialSetup: initialSetupResponse,
+            initialSetup: { pageType, ...initialSetup },
+        });
+    }
+
+    /**
+     * @param {boolean} playbackPaused
+     * @return {Promise<void>}
+     */
+    async withPlaybackPaused(playbackPaused = true) {
+        const initialSetup = this.collector.mockResponses.initialSetup || defaultInitialSetup;
+
+        await this.collector.updateMockResponse({
+            initialSetup: { playbackPaused, ...initialSetup },
         });
     }
 
@@ -123,7 +136,7 @@ export class DuckPlayerNative {
      * @param {Record<string, any>} payload
      */
     async simulateSubscriptionMessage(name, payload) {
-        await this.collector.simulateSubscriptionMessage('duckPlayerNative', name, payload);
+        await this.collector.simulateSubscriptionMessage(featureName, name, payload);
     }
 
     /**
@@ -176,6 +189,13 @@ export class DuckPlayerNative {
         await this.simulateSubscriptionMessage('onMuteAudio', options);
     }
 
+    /**
+     * @param {PageType} pageType
+     */
+    async sendURLChanged(pageType) {
+        await this.simulateSubscriptionMessage('onUrlChanged', { pageType });
+    }
+
     /* Messaging assertions */
 
     async didSendInitialHandshake() {
@@ -184,7 +204,7 @@ export class DuckPlayerNative {
             {
                 payload: {
                     context: this.collector.messagingContextName,
-                    featureName: 'duckPlayerNative',
+                    featureName,
                     method: 'initialSetup',
                     params: {},
                 },
@@ -198,24 +218,46 @@ export class DuckPlayerNative {
             {
                 payload: {
                     context: this.collector.messagingContextName,
-                    featureName: 'duckPlayerNative',
+                    featureName,
                     method: 'onCurrentTimestamp',
-                    params: { timestamp: 0 },
+                    params: { timestamp: "0" },
                 },
             },
         ]);
     }
 
     /* Thumbnail Overlay assertions */
 
-    async didShowThumbnailOverlay() {
+    async didShowOverlay() {
         await this.page.locator('ddg-video-thumbnail-overlay-mobile').waitFor({ state: 'visible', timeout: 1000 });
     }
 
     async didShowLogoInOverlay() {
         await this.page.locator('ddg-video-thumbnail-overlay-mobile .logo').waitFor({ state: 'visible', timeout: 1000 });
     }
 
+    async clickOnOverlay() {
+        await this.page.locator('ddg-video-thumbnail-overlay-mobile').click();
+    }
+
+    async didDismissOverlay() {
+        await this.page.locator('ddg-video-thumbnail-overlay-mobile').waitFor({ state: 'hidden', timeout: 1000 });
+    }
+
+    async didSendOverlayDismissalMessage() {
+        const messages = await this.collector.waitForMessage('didDismissOverlay');
+        expect(messages).toMatchObject([
+            {
+                payload: {
+                    context: this.collector.messagingContextName,
+                    featureName,
+                    method: 'didDismissOverlay',
+                    params: {},
+                },
+            },
+        ]);
+    }
+
     /* Custom Error assertions */
 
     async didShowGenericError() {
@@ -233,6 +275,24 @@ export class DuckPlayerNative {
             - paragraph: If this doesn’t work, you can still watch this video on YouTube, but without the added privacy of Duck Player.
           `);
     }
+
+    /**
+     * @param {number} numberOfCalls - Number of times the message should be received
+     */
+    async didSendDuckPlayerScriptsReady(numberOfCalls = 1) {
+        const expectedMessage = {
+            payload: {
+                context: this.collector.messagingContextName,
+                featureName,
+                method: 'onDuckPlayerScriptsReady',
+                params: {},
+            },
+        };
+        const expectedMessages = Array(numberOfCalls).fill(expectedMessage);
+        const actualMessages = await this.collector.waitForMessage('onDuckPlayerScriptsReady');
+
+        expect(actualMessages).toMatchObject(expectedMessages);
+    }
 }
 
 /**
diff --git a/injected/integration-test/page-objects/results-collector.js b/injected/integration-test/page-objects/results-collector.js
@@ -244,6 +244,10 @@ export class ResultsCollector {
         return this.build.name === 'apple-isolated' ? 'contentScopeScriptsIsolated' : 'contentScopeScripts';
     }
 
+    get mockResponses() {
+        return this.#mockResponses;
+    }
+
     /**
      * @param {string} featureName
      * @return {import("@duckduckgo/messaging").MessagingContext}
