From 23e51d82691173dc31b87f9a99be7bd565400364 Mon Sep 17 00:00:00 2001
From: Kelly Cochrane <kcochrane@mozilla.com>
Date: Wed, 17 Apr 2024 20:00:35 +0000
Subject: [PATCH] Bug 1873942 - Add test coverage for device connection and
 sync r=fxview-reviewers,nsharpley

Differential Revision: https://phabricator.services.mozilla.com/D207750
---
 .../browser/browser_syncedtabs_firefoxview.js | 160 ++++++++++++++++++
 1 file changed, 160 insertions(+)

diff --git a/browser/components/firefoxview/tests/browser/browser_syncedtabs_firefoxview.js b/browser/components/firefoxview/tests/browser/browser_syncedtabs_firefoxview.js
index 1bf387f57885..872efd37a0df 100644
--- a/browser/components/firefoxview/tests/browser/browser_syncedtabs_firefoxview.js
+++ b/browser/components/firefoxview/tests/browser/browser_syncedtabs_firefoxview.js
@@ -13,6 +13,11 @@ add_setup(async function () {
   registerCleanupFunction(async function () {
     await tearDown(gSandbox);
   });
+
+  // set tab sync false so we don't skip setup states
+  await SpecialPowers.pushPrefEnv({
+    set: [["services.sync.engine.tabs", false]],
+  });
 });
 
 async function promiseTabListsUpdated({ tabLists }) {
@@ -748,3 +753,158 @@ add_task(async function search_synced_tabs_recent_browsing() {
   await SpecialPowers.popPrefEnv();
   await tearDown(sandbox);
 });
+
+add_task(async function test_mobile_connected() {
+  Services.prefs.setBoolPref("services.sync.engine.tabs", false);
+  const sandbox = setupMocks({
+    state: UIState.STATUS_SIGNED_IN,
+    fxaDevices: [
+      {
+        id: 1,
+        name: "This Device",
+        isCurrentDevice: true,
+        type: "desktop",
+        tabs: [],
+      },
+      {
+        id: 2,
+        name: "Other Device",
+        type: "mobile",
+        tabs: [],
+      },
+    ],
+  });
+  await withFirefoxView({}, async browser => {
+    const { document } = browser.contentWindow;
+    // ensure tab sync is false so we don't skip onto next step
+    ok(
+      !Services.prefs.getBoolPref("services.sync.engine.tabs", false),
+      "services.sync.engine.tabs is initially false"
+    );
+
+    Services.obs.notifyObservers(null, UIState.ON_UPDATE);
+    await navigateToViewAndWait(document, "syncedtabs");
+
+    is(fxAccounts.device.recentDeviceList?.length, 2, "2 devices connected");
+    ok(
+      fxAccounts.device.recentDeviceList?.some(
+        device => device.type == "mobile"
+      ),
+      "A connected device is type:mobile"
+    );
+  });
+  await tearDown(sandbox);
+  Services.prefs.setBoolPref("services.sync.engine.tabs", true);
+});
+
+add_task(async function test_tablet_connected() {
+  Services.prefs.setBoolPref("services.sync.engine.tabs", false);
+  const sandbox = setupMocks({
+    state: UIState.STATUS_SIGNED_IN,
+    fxaDevices: [
+      {
+        id: 1,
+        name: "This Device",
+        isCurrentDevice: true,
+        type: "desktop",
+        tabs: [],
+      },
+      {
+        id: 2,
+        name: "Other Device",
+        type: "tablet",
+        tabs: [],
+      },
+    ],
+  });
+  await withFirefoxView({}, async browser => {
+    const { document } = browser.contentWindow;
+    // ensure tab sync is false so we don't skip onto next step
+    ok(
+      !Services.prefs.getBoolPref("services.sync.engine.tabs", false),
+      "services.sync.engine.tabs is initially false"
+    );
+
+    Services.obs.notifyObservers(null, UIState.ON_UPDATE);
+    await navigateToViewAndWait(document, "syncedtabs");
+
+    is(fxAccounts.device.recentDeviceList?.length, 2, "2 devices connected");
+    ok(
+      fxAccounts.device.recentDeviceList?.some(
+        device => device.type == "tablet"
+      ),
+      "A connected device is type:tablet"
+    );
+  });
+  await tearDown(sandbox);
+  Services.prefs.setBoolPref("services.sync.engine.tabs", true);
+});
+
+add_task(async function test_tab_sync_enabled() {
+  const sandbox = setupMocks({
+    state: UIState.STATUS_SIGNED_IN,
+    fxaDevices: [
+      {
+        id: 1,
+        name: "This Device",
+        isCurrentDevice: true,
+        type: "desktop",
+        tabs: [],
+      },
+      {
+        id: 2,
+        name: "Other Device",
+        type: "mobile",
+        tabs: [],
+      },
+    ],
+  });
+  await withFirefoxView({}, async browser => {
+    const { document } = browser.contentWindow;
+    Services.obs.notifyObservers(null, UIState.ON_UPDATE);
+    let syncedTabsComponent = document.querySelector(
+      "view-syncedtabs:not([slot=syncedtabs])"
+    );
+
+    // test initial state, with the pref not enabled
+    await navigateToViewAndWait(document, "syncedtabs");
+    // test with the pref toggled on
+    Services.prefs.setBoolPref("services.sync.engine.tabs", true);
+    await TestUtils.waitForCondition(
+      () => syncedTabsComponent.fullyUpdated,
+      "Synced tabs component is fully updated."
+    );
+    ok(!syncedTabsComponent.emptyState, "No empty state is being displayed.");
+
+    // reset and test clicking the action button
+    Services.prefs.setBoolPref("services.sync.engine.tabs", false);
+    await TestUtils.waitForCondition(
+      () => syncedTabsComponent.fullyUpdated,
+      "Synced tabs component is fully updated."
+    );
+    await TestUtils.waitForCondition(
+      () => syncedTabsComponent.emptyState,
+      "The empty state is rendered."
+    );
+
+    const actionButton = syncedTabsComponent.emptyState?.querySelector(
+      "button[data-action=sync-tabs-disabled]"
+    );
+    EventUtils.synthesizeMouseAtCenter(actionButton, {}, browser.contentWindow);
+    await TestUtils.waitForCondition(
+      () => syncedTabsComponent.fullyUpdated,
+      "Synced tabs component is fully updated."
+    );
+    await TestUtils.waitForCondition(
+      () => !syncedTabsComponent.emptyState,
+      "The empty state is rendered."
+    );
+
+    ok(true, "The empty state is no longer displayed when sync is enabled");
+    ok(
+      Services.prefs.getBoolPref("services.sync.engine.tabs", false),
+      "tab sync pref should be enabled after button click"
+    );
+  });
+  await tearDown(sandbox);
+});