another global fix

Author: shakyShane

special-pages/pages/new-tab/app/customizer/components/CustomizerMenu.js

@@ -110,5 +110,8 @@ export function useCustomizer({ title, id, icon, toggle, visibility, index }) {
 
     useEffect(() => {
         window.dispatchEvent(new Event(UPDATE_EVENT));
+        return () => {
+            window.dispatchEvent(new Event(UPDATE_EVENT));
+        };
     }, [visibility]);
 }

special-pages/pages/new-tab/app/customizer/integration-tests/customizer.page.js

@@ -20,6 +20,8 @@ export class CustomizerPage {
         this.ntp = ntp;
     }
 
+    context = () => this.ntp.page.locator('aside');
+
     async showsColorSelectionPanel() {
         const { page } = this.ntp;
         await page.locator('aside').getByLabel('Solid Colors').click();
@@ -459,4 +461,34 @@ export class CustomizerPage {
             button: 'right',
         });
     }
+
+    /**
+     * @param {string} name
+     * @returns {Promise<void>}
+     */
+    async isChecked(name) {
+        await expect(this.context().getByRole('switch', { name })).toBeChecked();
+    }
+
+    /**
+     * @param {string} name
+     * @returns {Promise<void>}
+     */
+    async isUnchecked(name) {
+        await expect(this.context().getByRole('switch', { name })).not.toBeChecked({ timeout: 1000 });
+    }
+
+    /**
+     * @param {string} name
+     */
+    async hasSwitch(name) {
+        await expect(this.context().getByRole('switch', { name })).toBeVisible();
+    }
+
+    /**
+     * @param {string} name
+     */
+    async doesntHaveSwitch(name) {
+        await expect(this.context().getByRole('switch', { name })).not.toBeVisible();
+    }
 }

special-pages/pages/new-tab/app/omnibar/integration-tests/omnibar.page.js

@@ -2,6 +2,7 @@ import { expect, test } from '@playwright/test';
 
 /**
  * @typedef {import("../../../types/new-tab.js").OmnibarMode} Mode
+ * @typedef {import("../../../types/new-tab.js").OmnibarConfig} Config
  */
 
 export class OmnibarPage {
@@ -193,10 +194,11 @@ export class OmnibarPage {
     }
 
     /**
+     * @param {Config} config
      * @returns {Promise<void>}
      */
-    async didDisableGlobally() {
-        const event = sub('omnibar_onConfigUpdate').payload({ mode: 'search', enableAi: false, showAiSetting: false });
+    async didReceiveConfig(config) {
+        const event = sub('omnibar_onConfigUpdate').payload(config);
         await test.step(`simulates global disabled (eg: settings): ${JSON.stringify(event.name)} ${JSON.stringify(event.payload)} `, async () => {
             await this.ntp.mocks.simulateSubscriptionEvent(event);
         });
@@ -229,7 +231,6 @@ export class OmnibarPage {
                 return await expect(this.chatInput()).toHaveValue(value);
             }
             case 'search': {
-                await this.searchInput().waitFor({ timeout: 1000 });
                 return await expect(this.searchInput()).toHaveValue(value);
             }
         }

special-pages/pages/new-tab/app/omnibar/integration-tests/omnibar.persistence.spec.js

@@ -76,6 +76,7 @@ test.describe('omnibar widget persistence', () => {
     test('adjusts mode of other tabs when duck.ai is globally disabled', async ({ page }, workerInfo) => {
         const ntp = NewtabPage.create(page, workerInfo);
         const omnibar = new OmnibarPage(ntp);
+        const customizer = new CustomizerPage(ntp);
         await ntp.reducedMotion();
         await ntp.openPage({ additional: { omnibar: true, tabs: true, 'tabs.debug': true } });
         await omnibar.ready();
@@ -87,12 +88,25 @@ test.describe('omnibar widget persistence', () => {
         await omnibar.didSwitchToTab('02', ['01', '02']);
         await omnibar.expectValue({ value: '', mode: 'ai' });
 
-        // disable globally
-        await omnibar.didDisableGlobally();
-        await omnibar.expectValue({ value: '', mode: 'search' });
+        // open sidebar
+        await customizer.opensCustomizer();
 
-        // back to first tab, should now also be search
-        await omnibar.didSwitchToTab('01', ['01', '02']);
+        // control: make sure the Duck.ai toggle is there
+        await customizer.hasSwitch('Toggle Duck.ai');
+
+        // now receive global config settings...
+        await omnibar.didReceiveConfig({ mode: 'search', enableAi: false, showAiSetting: false });
+
+        // ...and expect search box to be empty, but still on search mode.
         await omnibar.expectValue({ value: '', mode: 'search' });
+
+        // also, expect menu in sidebar to be updated (eg: switch is removed)
+        await customizer.doesntHaveSwitch('Toggle Duck.ai');
+
+        // Second config, disable globally, but keep 'showAiSetting: true'
+        await omnibar.didReceiveConfig({ mode: 'search', enableAi: false, showAiSetting: true });
+
+        // Ensure the toggle is back and is unchecked
+        await customizer.isUnchecked('Toggle Duck.ai');
     });
 });