Adding upstream version 126.0.upstream/126.0

Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>

31 files changed, 2204 insertions, 422 deletions

diff --git a/browser/components/translations/tests/browser/browser.toml b/browser/components/translations/tests/browser/browser.toml
index a9d36363da..472ae28866 100644
--- a/browser/components/translations/tests/browser/browser.toml
+++ b/browser/components/translations/tests/browser/browser.toml
@@ -15,6 +15,10 @@ support-files = [
 
 ["browser_translations_about_preferences_settings_ui.js"]
 
+["browser_translations_full_page_move_tab_to_new_window.js"]
+
+["browser_translations_full_page_multiple_windows.js"]
+
 ["browser_translations_full_page_panel_a11y_focus.js"]
 
 ["browser_translations_full_page_panel_always_translate_language_bad_data.js"]
@@ -51,8 +55,6 @@ support-files = [
 
 ["browser_translations_full_page_panel_engine_unsupported.js"]
 
-["browser_translations_full_page_panel_engine_unsupported_lang.js"]
-
 ["browser_translations_full_page_panel_firstrun.js"]
 
 ["browser_translations_full_page_panel_firstrun_revisit.js"]
@@ -62,6 +64,8 @@ skip-if = ["true"]
 
 ["browser_translations_full_page_panel_gear.js"]
 
+["browser_translations_full_page_panel_init_failure.js"]
+
 ["browser_translations_full_page_panel_never_translate_language.js"]
 
 ["browser_translations_full_page_panel_never_translate_site_auto.js"]
@@ -77,6 +81,8 @@ skip-if = ["os == 'linux' && !debug"] # Bug 1863227
 
 ["browser_translations_full_page_panel_switch_languages.js"]
 
+["browser_translations_full_page_panel_unsupported_lang.js"]
+
 ["browser_translations_full_page_reader_mode.js"]
 
 ["browser_translations_full_page_telemetry_firstrun_auto_translate.js"]
@@ -109,6 +115,30 @@ skip-if = ["os == 'linux' && !debug"] # Bug 1863227
 
 ["browser_translations_select_context_menu_with_text_selected.js"]
 
-["browser_translations_select_panel_language_selectors.js"]
+["browser_translations_select_panel_engine_cache.js"]
+
+["browser_translations_select_panel_fallback_to_doc_language.js"]
+
+["browser_translations_select_panel_open_to_idle_state.js"]
+
+["browser_translations_select_panel_retranslate_on_change_language_directly.js"]
+
+["browser_translations_select_panel_retranslate_on_change_language_from_dropdown_menu.js"]
+
+["browser_translations_select_panel_select_current_language_directly.js"]
+
+["browser_translations_select_panel_select_current_language_from_dropdown_menu.js"]
+
+["browser_translations_select_panel_select_same_from_and_to_languages_directly.js"]
+
+["browser_translations_select_panel_select_same_from_and_to_languages_from_dropdown_menu.js"]
+
+["browser_translations_select_panel_translate_on_change_language_directly.js"]
+
+["browser_translations_select_panel_translate_on_change_language_from_dropdown_menu.js"]
+
+["browser_translations_select_panel_translate_on_change_language_multiple_times_directly.js"]
+
+["browser_translations_select_panel_translate_on_change_language_multiple_times_from_dropdown_menu.js"]
 
-["browser_translations_select_panel_mainview_ui.js"]
+["browser_translations_select_panel_translate_on_open.js"]
diff --git a/browser/components/translations/tests/browser/browser_translations_about_preferences_settings_ui.js b/browser/components/translations/tests/browser/browser_translations_about_preferences_settings_ui.js
index ee81b84a36..f618b27814 100644
--- a/browser/components/translations/tests/browser/browser_translations_about_preferences_settings_ui.js
+++ b/browser/components/translations/tests/browser/browser_translations_about_preferences_settings_ui.js
@@ -22,8 +22,8 @@ add_task(async function test_translations_settings_pane_elements() {
     translationsSettingsDescription,
     translateAlwaysHeader,
     translateNeverHeader,
-    translateAlwaysAddButton,
-    translateNeverAddButton,
+    translateAlwaysMenuList,
+    translateNeverMenuList,
     translateNeverSiteHeader,
     translateNeverSiteDesc,
     translateDownloadLanguagesHeader,
@@ -41,8 +41,8 @@ add_task(async function test_translations_settings_pane_elements() {
       translationsSettingsDescription,
       translateAlwaysHeader,
       translateNeverHeader,
-      translateAlwaysAddButton,
-      translateNeverAddButton,
+      translateAlwaysMenuList,
+      translateNeverMenuList,
       translateNeverSiteHeader,
       translateNeverSiteDesc,
       translateDownloadLanguagesHeader,
@@ -74,14 +74,203 @@ add_task(async function test_translations_settings_pane_elements() {
       translationsSettingsDescription,
       translateAlwaysHeader,
       translateNeverHeader,
-      translateAlwaysAddButton,
-      translateNeverAddButton,
+      translateAlwaysMenuList,
+      translateNeverMenuList,
       translateNeverSiteHeader,
       translateNeverSiteDesc,
       translateDownloadLanguagesHeader,
       translateDownloadLanguagesLearnMore,
     },
   });
+  await cleanup();
+});
+
+add_task(async function test_translations_settings_always_translate() {
+  const {
+    cleanup,
+    elements: { settingsButton },
+  } = await setupAboutPreferences(LANGUAGE_PAIRS, {
+    prefs: [["browser.translations.newSettingsUI.enable", true]],
+  });
+
+  const document = gBrowser.selectedBrowser.contentDocument;
+
+  assertVisibility({
+    message: "Expect paneGeneral elements to be visible.",
+    visible: { settingsButton },
+  });
+
+  const { translateAlwaysMenuList } =
+    await TranslationsSettingsTestUtils.openAboutPreferencesTranslationsSettingsPane(
+      settingsButton
+    );
+  let alwaysTranslateSection = document.getElementById(
+    "translations-settings-always-translate-section"
+  );
+  await testLanguageList(alwaysTranslateSection, translateAlwaysMenuList);
+
+  await cleanup();
+});
+
+async function testLanguageList(translateSection, menuList) {
+  const sectionName =
+    translateSection.id === "translations-settings-always-translate-section"
+      ? "Always"
+      : "Never";
+
+  is(
+    translateSection.querySelector(".translations-settings-languages-card"),
+    null,
+    `Language list not present in ${sectionName} Translate list`
+  );
+
+  for (let i = 0; i < menuList.children[0].children.length; i++) {
+    menuList.value = menuList.children[0].children[i].value;
+
+    let clickMenu = BrowserTestUtils.waitForEvent(menuList, "command");
+    menuList.dispatchEvent(new Event("command"));
+    await clickMenu;
+
+    /** Languages are always added on the top, so check the firstChild
+     * for newly added languages.
+     * the firstChild.lastChild.innerText is the language display name
+     * which is compared with the menulist display name that is selected
+     */
+    is(
+      translateSection.querySelector(".translations-settings-language-list")
+        .firstChild.lastChild.innerText,
+      getIntlDisplayName(menuList.children[0].children[i].value),
+      `Language list has element ${getIntlDisplayName(
+        menuList.children[0].children[i].value
+      )}`
+    );
+  }
+  /** The test cases has 4 languages, so check if 4 languages are added to the list */
+  let langNum = translateSection.querySelector(
+    ".translations-settings-language-list"
+  ).childElementCount;
+  is(langNum, 4, "Number of languages added is 4");
+
+  const languagelist = translateSection.querySelector(
+    ".translations-settings-language-list"
+  );
+
+  for (let i = 0; i < langNum; i++) {
+    // Delete the first language in the list
+    let langName = languagelist.children[0].lastChild.innerText;
+    let langButton = languagelist.children[0].querySelector("moz-button");
+
+    let clickButton = BrowserTestUtils.waitForEvent(langButton, "click");
+    langButton.dispatchEvent(new Event("click"));
+    await clickButton;
+
+    if (i < langNum - 1) {
+      is(
+        languagelist.childElementCount,
+        langNum - i - 1,
+        `${langName} removed from ${sectionName}  Translate`
+      );
+    } else {
+      /** Check if the language list card is removed after removing the last language */
+      is(
+        translateSection.querySelector(".translations-settings-languages-card"),
+        null,
+        `${langName} removed from ${sectionName} Translate`
+      );
+    }
+  }
+}
+
+add_task(async function test_translations_settings_never_translate() {
+  const {
+    cleanup,
+    elements: { settingsButton },
+  } = await setupAboutPreferences(LANGUAGE_PAIRS, {
+    prefs: [["browser.translations.newSettingsUI.enable", true]],
+  });
+
+  const document = gBrowser.selectedBrowser.contentDocument;
+
+  assertVisibility({
+    message: "Expect paneGeneral elements to be visible.",
+    visible: { settingsButton },
+  });
+
+  const { translateNeverMenuList } =
+    await TranslationsSettingsTestUtils.openAboutPreferencesTranslationsSettingsPane(
+      settingsButton
+    );
+  let neverTranslateSection = document.getElementById(
+    "translations-settings-never-translate-section"
+  );
+  await testLanguageList(neverTranslateSection, translateNeverMenuList);
+  await cleanup();
+});
+
+add_task(async function test_translations_settings_download_languages() {
+  const {
+    cleanup,
+    elements: { settingsButton },
+  } = await setupAboutPreferences(LANGUAGE_PAIRS, {
+    prefs: [["browser.translations.newSettingsUI.enable", true]],
+  });
 
+  assertVisibility({
+    message: "Expect paneGeneral elements to be visible.",
+    visible: { settingsButton },
+  });
+
+  const { translateDownloadLanguagesList } =
+    await TranslationsSettingsTestUtils.openAboutPreferencesTranslationsSettingsPane(
+      settingsButton
+    );
+
+  let langList = translateDownloadLanguagesList.querySelector(
+    ".translations-settings-language-list"
+  );
+
+  for (let i = 0; i < langList.children.length; i++) {
+    is(
+      langList.children[i]
+        .querySelector("moz-button")
+        .classList.contains("translations-settings-download-icon"),
+      true,
+      "Download icon is visible"
+    );
+
+    let clickButton = BrowserTestUtils.waitForEvent(
+      langList.children[i].querySelector("moz-button"),
+      "click"
+    );
+    langList.children[i]
+      .querySelector("moz-button")
+      .dispatchEvent(new Event("click"));
+    await clickButton;
+
+    is(
+      langList.children[i]
+        .querySelector("moz-button")
+        .classList.contains("translations-settings-delete-icon"),
+      true,
+      "Delete icon is visible"
+    );
+
+    clickButton = BrowserTestUtils.waitForEvent(
+      langList.children[i].querySelector("moz-button"),
+      "click"
+    );
+    langList.children[i]
+      .querySelector("moz-button")
+      .dispatchEvent(new Event("click"));
+    await clickButton;
+
+    is(
+      langList.children[i]
+        .querySelector("moz-button")
+        .classList.contains("translations-settings-download-icon"),
+      true,
+      "Download icon is visible"
+    );
+  }
   await cleanup();
 });
diff --git a/browser/components/translations/tests/browser/browser_translations_full_page_move_tab_to_new_window.js b/browser/components/translations/tests/browser/browser_translations_full_page_move_tab_to_new_window.js
new file mode 100644
index 0000000000..f384fc59c8
--- /dev/null
+++ b/browser/components/translations/tests/browser/browser_translations_full_page_move_tab_to_new_window.js
@@ -0,0 +1,64 @@
+/* Any copyright is dedicated to the Public Domain.
+   https://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+/**
+ * This test case tests a specific situation described in Bug 1893776
+ * where the Translations panels were not initializing correctly after
+ * dragging a tab to become its own new window after opening the panel
+ * in the previous window.
+ */
+add_task(async function test_browser_translations_full_page_multiple_windows() {
+  const window1 = window;
+  const testPage = await loadTestPage({
+    page: SPANISH_PAGE_URL,
+    languagePairs: LANGUAGE_PAIRS,
+  });
+
+  await FullPageTranslationsTestUtils.assertTranslationsButton(
+    { button: true, circleArrows: false, locale: false, icon: true },
+    "The translations button is visible.",
+    window1
+  );
+
+  info("Opening FullPageTranslationsPanel in window1");
+  await FullPageTranslationsTestUtils.openPanel({
+    onOpenPanel: FullPageTranslationsTestUtils.assertPanelViewDefault,
+  });
+
+  await FullPageTranslationsTestUtils.clickCancelButton();
+
+  info("Moving the tab to a new window of its own");
+  const window2 = await window1.gBrowser.replaceTabWithWindow(testPage.tab);
+  const swapDocShellPromise = BrowserTestUtils.waitForEvent(
+    testPage.tab.linkedBrowser,
+    "SwapDocShells"
+  );
+  await swapDocShellPromise;
+
+  await FullPageTranslationsTestUtils.assertTranslationsButton(
+    { button: true, circleArrows: false, locale: false, icon: true },
+    "The translations button is visible.",
+    window2
+  );
+
+  info("Opening FullPageTranslationsPanel in window2");
+  await FullPageTranslationsTestUtils.openPanel({
+    win: window2,
+  });
+
+  info("Translating the same page in window2");
+  await FullPageTranslationsTestUtils.clickTranslateButton({
+    win: window2,
+    downloadHandler: testPage.resolveDownloads,
+  });
+  await FullPageTranslationsTestUtils.assertLangTagIsShownOnTranslationsButton(
+    "es",
+    "en",
+    window2
+  );
+
+  await testPage.cleanup();
+  await BrowserTestUtils.closeWindow(window2);
+});
diff --git a/browser/components/translations/tests/browser/browser_translations_full_page_multiple_windows.js b/browser/components/translations/tests/browser/browser_translations_full_page_multiple_windows.js
new file mode 100644
index 0000000000..9bdee2c406
--- /dev/null
+++ b/browser/components/translations/tests/browser/browser_translations_full_page_multiple_windows.js
@@ -0,0 +1,68 @@
+/* Any copyright is dedicated to the Public Domain.
+   https://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+/**
+ * @param {Window} win
+ */
+function focusWindow(win) {
+  const promise = BrowserTestUtils.waitForEvent(win, "focus");
+  win.focus();
+  return promise;
+}
+
+/**
+ * Test that the full page translation panel works when multiple windows are used.
+ */
+add_task(async function test_browser_translations_full_page_multiple_windows() {
+  const window1 = window;
+  const testPage1 = await loadTestPage({
+    page: SPANISH_PAGE_URL,
+    languagePairs: LANGUAGE_PAIRS,
+  });
+
+  const window2 = await BrowserTestUtils.openNewBrowserWindow();
+
+  const testPage2 = await loadTestPage({
+    win: window2,
+    page: SPANISH_PAGE_URL,
+    languagePairs: LANGUAGE_PAIRS,
+  });
+
+  // Focus back to the original window first. This ensures coverage for invalid caching
+  // logic involving multiple windows.
+  await focusWindow(window1);
+
+  info("Testing window 1");
+  await FullPageTranslationsTestUtils.openPanel({
+    onOpenPanel: FullPageTranslationsTestUtils.assertPanelViewDefault,
+  });
+  await FullPageTranslationsTestUtils.clickTranslateButton({
+    downloadHandler: testPage1.resolveDownloads,
+  });
+  await FullPageTranslationsTestUtils.assertPageIsTranslated(
+    "es",
+    "en",
+    testPage1.runInPage,
+    "Window 1 gets translated",
+    window1
+  );
+
+  await focusWindow(window2);
+
+  info("Testing window 2");
+  await FullPageTranslationsTestUtils.openPanel({ win: window2 });
+  await FullPageTranslationsTestUtils.clickTranslateButton({ win: window2 });
+  await FullPageTranslationsTestUtils.assertPageIsTranslated(
+    "es",
+    "en",
+    testPage2.runInPage,
+    "Window 2 gets translated",
+    window2
+  );
+
+  await testPage2.cleanup();
+  await BrowserTestUtils.closeWindow(window2);
+  await testPage1.cleanup();
+});
diff --git a/browser/components/translations/tests/browser/browser_translations_full_page_panel_init_failure.js b/browser/components/translations/tests/browser/browser_translations_full_page_panel_init_failure.js
new file mode 100644
index 0000000000..34986726b8
--- /dev/null
+++ b/browser/components/translations/tests/browser/browser_translations_full_page_panel_init_failure.js
@@ -0,0 +1,25 @@
+/* Any copyright is dedicated to the Public Domain.
+   https://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+/**
+ * This test case verifies that the proper error message is displayed in
+ * the FullPageTranslationsPanel if the panel tries to open, but the language
+ * dropdown menus fail to initialize.
+ */
+add_task(async function test_full_page_translations_panel_init_failure() {
+  const { cleanup } = await loadTestPage({
+    page: SPANISH_PAGE_URL,
+    languagePairs: LANGUAGE_PAIRS,
+  });
+
+  TranslationsPanelShared.simulateLangListError();
+  await FullPageTranslationsTestUtils.openPanel({
+    onOpenPanel: FullPageTranslationsTestUtils.assertPanelViewInitFailure,
+  });
+
+  await FullPageTranslationsTestUtils.clickCancelButton();
+
+  await cleanup();
+});
diff --git a/browser/components/translations/tests/browser/browser_translations_full_page_panel_retry.js b/browser/components/translations/tests/browser/browser_translations_full_page_panel_retry.js
index 74d92381b9..01af5cbd8d 100644
--- a/browser/components/translations/tests/browser/browser_translations_full_page_panel_retry.js
+++ b/browser/components/translations/tests/browser/browser_translations_full_page_panel_retry.js
@@ -37,7 +37,7 @@ add_task(async function test_translations_panel_retry() {
     onOpenPanel: FullPageTranslationsTestUtils.assertPanelViewRevisit,
   });
 
-  FullPageTranslationsTestUtils.switchSelectedToLanguage("fr");
+  FullPageTranslationsTestUtils.changeSelectedToLanguage("fr");
 
   await FullPageTranslationsTestUtils.clickTranslateButton({
     downloadHandler: resolveDownloads,
diff --git a/browser/components/translations/tests/browser/browser_translations_full_page_panel_switch_languages.js b/browser/components/translations/tests/browser/browser_translations_full_page_panel_switch_languages.js
index 0c5db67b20..6ab70e634f 100644
--- a/browser/components/translations/tests/browser/browser_translations_full_page_panel_switch_languages.js
+++ b/browser/components/translations/tests/browser/browser_translations_full_page_panel_switch_languages.js
@@ -30,29 +30,29 @@ add_task(async function test_translations_panel_switch_language() {
   FullPageTranslationsTestUtils.assertSelectedFromLanguage({ langTag: "es" });
   FullPageTranslationsTestUtils.assertSelectedToLanguage({ langTag: "en" });
 
-  FullPageTranslationsTestUtils.switchSelectedFromLanguage("en");
+  FullPageTranslationsTestUtils.changeSelectedFromLanguage("en");
 
   ok(
     translateButton.disabled,
     "The translate button is disabled when the languages are the same"
   );
 
-  FullPageTranslationsTestUtils.switchSelectedFromLanguage("es");
+  FullPageTranslationsTestUtils.changeSelectedFromLanguage("es");
 
   ok(
     !translateButton.disabled,
     "When the languages are different it can be translated"
   );
 
-  FullPageTranslationsTestUtils.switchSelectedFromLanguage("");
+  FullPageTranslationsTestUtils.changeSelectedFromLanguage("");
 
   ok(
     translateButton.disabled,
     "The translate button is disabled nothing is selected."
   );
 
-  FullPageTranslationsTestUtils.switchSelectedFromLanguage("en");
-  FullPageTranslationsTestUtils.switchSelectedToLanguage("fr");
+  FullPageTranslationsTestUtils.changeSelectedFromLanguage("en");
+  FullPageTranslationsTestUtils.changeSelectedToLanguage("fr");
 
   ok(!translateButton.disabled, "The translate button can now be used");
 
diff --git a/browser/components/translations/tests/browser/browser_translations_full_page_panel_engine_unsupported_lang.js b/browser/components/translations/tests/browser/browser_translations_full_page_panel_unsupported_lang.js
index 21f7e8fdb7..59be1e329b 100644
--- a/browser/components/translations/tests/browser/browser_translations_full_page_panel_engine_unsupported_lang.js
+++ b/browser/components/translations/tests/browser/browser_translations_full_page_panel_unsupported_lang.js
@@ -23,6 +23,9 @@ add_task(async function test_unsupported_lang() {
   });
 
   await FullPageTranslationsTestUtils.clickChangeSourceLanguageButton();
+  FullPageTranslationsTestUtils.assertPanelViewDefault();
+  FullPageTranslationsTestUtils.assertSelectedFromLanguage({ langTag: "" });
+  FullPageTranslationsTestUtils.assertSelectedToLanguage({ langTag: "en" });
 
   await cleanup();
 });
diff --git a/browser/components/translations/tests/browser/browser_translations_full_page_telemetry_switch_languages.js b/browser/components/translations/tests/browser/browser_translations_full_page_telemetry_switch_languages.js
index ef13940b3f..41183cc9cf 100644
--- a/browser/components/translations/tests/browser/browser_translations_full_page_telemetry_switch_languages.js
+++ b/browser/components/translations/tests/browser/browser_translations_full_page_telemetry_switch_languages.js
@@ -24,7 +24,7 @@ add_task(async function test_translations_telemetry_switch_from_language() {
   });
 
   FullPageTranslationsTestUtils.assertSelectedFromLanguage({ langTag: "es" });
-  FullPageTranslationsTestUtils.switchSelectedFromLanguage("en");
+  FullPageTranslationsTestUtils.changeSelectedFromLanguage("en");
 
   await TestTranslationsTelemetry.assertEvent(Glean.translationsPanel.open, {
     expectedEventCount: 1,
@@ -45,7 +45,7 @@ add_task(async function test_translations_telemetry_switch_from_language() {
     }
   );
 
-  FullPageTranslationsTestUtils.switchSelectedFromLanguage("es");
+  FullPageTranslationsTestUtils.changeSelectedFromLanguage("es");
 
   await TestTranslationsTelemetry.assertEvent(
     Glean.translationsPanel.changeFromLanguage,
@@ -56,7 +56,7 @@ add_task(async function test_translations_telemetry_switch_from_language() {
     }
   );
 
-  FullPageTranslationsTestUtils.switchSelectedFromLanguage("");
+  FullPageTranslationsTestUtils.changeSelectedFromLanguage("");
 
   await TestTranslationsTelemetry.assertEvent(
     Glean.translationsPanel.changeFromLanguage,
@@ -65,7 +65,7 @@ add_task(async function test_translations_telemetry_switch_from_language() {
     }
   );
 
-  FullPageTranslationsTestUtils.switchSelectedFromLanguage("en");
+  FullPageTranslationsTestUtils.changeSelectedFromLanguage("en");
 
   await TestTranslationsTelemetry.assertEvent(
     Glean.translationsPanel.changeFromLanguage,
@@ -100,7 +100,7 @@ add_task(async function test_translations_telemetry_switch_to_language() {
   });
 
   FullPageTranslationsTestUtils.assertSelectedToLanguage({ langTag: "en" });
-  FullPageTranslationsTestUtils.switchSelectedToLanguage("fr");
+  FullPageTranslationsTestUtils.changeSelectedToLanguage("fr");
 
   await TestTranslationsTelemetry.assertEvent(Glean.translationsPanel.open, {
     expectedEventCount: 1,
@@ -121,7 +121,7 @@ add_task(async function test_translations_telemetry_switch_to_language() {
     }
   );
 
-  FullPageTranslationsTestUtils.switchSelectedToLanguage("en");
+  FullPageTranslationsTestUtils.changeSelectedToLanguage("en");
 
   await TestTranslationsTelemetry.assertEvent(
     Glean.translationsPanel.changeToLanguage,
@@ -132,7 +132,7 @@ add_task(async function test_translations_telemetry_switch_to_language() {
     }
   );
 
-  FullPageTranslationsTestUtils.switchSelectedToLanguage("");
+  FullPageTranslationsTestUtils.changeSelectedToLanguage("");
 
   await TestTranslationsTelemetry.assertEvent(
     Glean.translationsPanel.changeToLanguage,
@@ -141,7 +141,7 @@ add_task(async function test_translations_telemetry_switch_to_language() {
     }
   );
 
-  FullPageTranslationsTestUtils.switchSelectedToLanguage("en");
+  FullPageTranslationsTestUtils.changeSelectedToLanguage("en");
 
   await TestTranslationsTelemetry.assertEvent(
     Glean.translationsPanel.changeToLanguage,
diff --git a/browser/components/translations/tests/browser/browser_translations_select_context_menu_feature_disabled.js b/browser/components/translations/tests/browser/browser_translations_select_context_menu_feature_disabled.js
index a6b3f71924..c3ed228ecc 100644
--- a/browser/components/translations/tests/browser/browser_translations_select_context_menu_feature_disabled.js
+++ b/browser/components/translations/tests/browser/browser_translations_select_context_menu_feature_disabled.js
@@ -19,7 +19,7 @@
 add_task(
   async function test_translate_selection_menuitem_is_unavailable_with_feature_disabled_and_no_text_selected() {
     const { cleanup, runInPage } = await loadTestPage({
-      page: SPANISH_PAGE_URL,
+      page: SELECT_TEST_PAGE_URL,
       languagePairs: LANGUAGE_PAIRS,
       prefs: [["browser.translations.select.enable", false]],
     });
@@ -34,8 +34,8 @@ add_task(
     await SelectTranslationsTestUtils.assertContextMenuTranslateSelectionItem(
       runInPage,
       {
-        selectSpanishParagraph: false,
-        openAtSpanishParagraph: true,
+        selectSpanishSentence: false,
+        openAtSpanishSentence: true,
         expectMenuItemVisible: false,
       },
       "The translate-selection context menu item should be unavailable when the feature is disabled."
@@ -54,7 +54,7 @@ add_task(
 add_task(
   async function test_translate_selection_menuitem_is_unavailable_with_feature_disabled_and_text_selected() {
     const { cleanup, runInPage } = await loadTestPage({
-      page: SPANISH_PAGE_URL,
+      page: SELECT_TEST_PAGE_URL,
       languagePairs: LANGUAGE_PAIRS,
       prefs: [["browser.translations.select.enable", false]],
     });
@@ -69,8 +69,8 @@ add_task(
     await SelectTranslationsTestUtils.assertContextMenuTranslateSelectionItem(
       runInPage,
       {
-        selectSpanishParagraph: true,
-        openAtSpanishParagraph: true,
+        selectSpanishSentence: true,
+        openAtSpanishSentence: true,
         expectMenuItemVisible: false,
       },
       "The translate-selection context menu item should be unavailable when the feature is disabled."
@@ -89,7 +89,7 @@ add_task(
 add_task(
   async function test_translate_selection_menuitem_is_unavailable_with_feature_disabled_and_clicking_a_hyperlink() {
     const { cleanup, runInPage } = await loadTestPage({
-      page: SPANISH_PAGE_URL,
+      page: SELECT_TEST_PAGE_URL,
       languagePairs: LANGUAGE_PAIRS,
       prefs: [["browser.translations.select.enable", false]],
     });
@@ -102,7 +102,7 @@ add_task(
     await SelectTranslationsTestUtils.assertContextMenuTranslateSelectionItem(
       runInPage,
       {
-        selectSpanishParagraph: false,
+        selectSpanishSentence: false,
         openAtSpanishHyperlink: true,
         expectMenuItemVisible: false,
       },
diff --git a/browser/components/translations/tests/browser/browser_translations_select_context_menu_with_full_page_translations_active.js b/browser/components/translations/tests/browser/browser_translations_select_context_menu_with_full_page_translations_active.js
index 99cff2b4ec..788ca7de63 100644
--- a/browser/components/translations/tests/browser/browser_translations_select_context_menu_with_full_page_translations_active.js
+++ b/browser/components/translations/tests/browser/browser_translations_select_context_menu_with_full_page_translations_active.js
@@ -12,7 +12,7 @@
 add_task(
   async function test_translate_selection_menuitem_with_text_selected_and_full_page_translations_active() {
     const { cleanup, resolveDownloads, runInPage } = await loadTestPage({
-      page: SPANISH_PAGE_URL,
+      page: SELECT_TEST_PAGE_URL,
       languagePairs: LANGUAGE_PAIRS,
       prefs: [["browser.translations.select.enable", true]],
     });
@@ -27,8 +27,8 @@ add_task(
     await SelectTranslationsTestUtils.assertContextMenuTranslateSelectionItem(
       runInPage,
       {
-        selectSpanishParagraph: true,
-        openAtSpanishParagraph: true,
+        selectSpanishSentence: true,
+        openAtSpanishSentence: true,
         expectMenuItemVisible: true,
         expectedTargetLanguage: "en",
       },
@@ -52,8 +52,8 @@ add_task(
     await SelectTranslationsTestUtils.assertContextMenuTranslateSelectionItem(
       runInPage,
       {
-        selectSpanishParagraph: true,
-        openAtSpanishParagraph: true,
+        selectSpanishSentence: true,
+        openAtSpanishSentence: true,
         expectMenuItemVisible: false,
       },
       "The translate-selection context menu item should be unavailable while full-page translations is active."
@@ -70,8 +70,8 @@ add_task(
     await SelectTranslationsTestUtils.assertContextMenuTranslateSelectionItem(
       runInPage,
       {
-        selectSpanishParagraph: true,
-        openAtSpanishParagraph: true,
+        selectSpanishSentence: true,
+        openAtSpanishSentence: true,
         expectMenuItemVisible: true,
         expectedTargetLanguage: "en",
       },
@@ -91,7 +91,7 @@ add_task(
 add_task(
   async function test_translate_selection_menuitem_with_link_clicked_and_full_page_translations_active() {
     const { cleanup, resolveDownloads, runInPage } = await loadTestPage({
-      page: SPANISH_PAGE_URL,
+      page: SELECT_TEST_PAGE_URL,
       languagePairs: LANGUAGE_PAIRS,
       prefs: [["browser.translations.select.enable", true]],
     });
@@ -106,7 +106,7 @@ add_task(
     await SelectTranslationsTestUtils.assertContextMenuTranslateSelectionItem(
       runInPage,
       {
-        selectSpanishParagraph: false,
+        selectSpanishSentence: false,
         openAtSpanishHyperlink: true,
         expectMenuItemVisible: true,
         expectedTargetLanguage: "en",
@@ -131,7 +131,7 @@ add_task(
     await SelectTranslationsTestUtils.assertContextMenuTranslateSelectionItem(
       runInPage,
       {
-        selectSpanishParagraph: false,
+        selectSpanishSentence: false,
         openAtSpanishHyperlink: true,
         expectMenuItemVisible: false,
       },
@@ -149,7 +149,7 @@ add_task(
     await SelectTranslationsTestUtils.assertContextMenuTranslateSelectionItem(
       runInPage,
       {
-        selectSpanishParagraph: false,
+        selectSpanishSentence: false,
         openAtSpanishHyperlink: true,
         expectMenuItemVisible: true,
         expectedTargetLanguage: "en",
diff --git a/browser/components/translations/tests/browser/browser_translations_select_context_menu_with_hyperlink.js b/browser/components/translations/tests/browser/browser_translations_select_context_menu_with_hyperlink.js
index cefd83f046..83e836489f 100644
--- a/browser/components/translations/tests/browser/browser_translations_select_context_menu_with_hyperlink.js
+++ b/browser/components/translations/tests/browser/browser_translations_select_context_menu_with_hyperlink.js
@@ -12,7 +12,7 @@
 add_task(
   async function test_translate_selection_menuitem_translate_link_text_to_target_language() {
     const { cleanup, runInPage } = await loadTestPage({
-      page: SPANISH_PAGE_URL,
+      page: SELECT_TEST_PAGE_URL,
       languagePairs: LANGUAGE_PAIRS,
       prefs: [["browser.translations.select.enable", true]],
     });
@@ -25,7 +25,7 @@ add_task(
     await SelectTranslationsTestUtils.assertContextMenuTranslateSelectionItem(
       runInPage,
       {
-        selectSpanishParagraph: false,
+        selectSpanishSentence: false,
         openAtSpanishHyperlink: true,
         expectMenuItemVisible: true,
         expectedTargetLanguage: "en",
@@ -47,7 +47,7 @@ add_task(
 add_task(
   async function test_translate_selection_menuitem_translate_link_text_in_preferred_language() {
     const { cleanup, runInPage } = await loadTestPage({
-      page: SPANISH_PAGE_URL,
+      page: SELECT_TEST_PAGE_URL,
       languagePairs: LANGUAGE_PAIRS,
       prefs: [["browser.translations.select.enable", true]],
     });
@@ -60,7 +60,7 @@ add_task(
     await SelectTranslationsTestUtils.assertContextMenuTranslateSelectionItem(
       runInPage,
       {
-        selectSpanishParagraph: false,
+        selectSpanishSentence: false,
         openAtEnglishHyperlink: true,
         expectMenuItemVisible: true,
         expectedTargetLanguage: null,
@@ -82,7 +82,7 @@ add_task(
 add_task(
   async function test_translate_selection_menuitem_selected_text_takes_precedence_over_link_text() {
     const { cleanup, runInPage } = await loadTestPage({
-      page: SPANISH_PAGE_URL,
+      page: SELECT_TEST_PAGE_URL,
       languagePairs: LANGUAGE_PAIRS,
       prefs: [["browser.translations.select.enable", true]],
     });
@@ -95,7 +95,7 @@ add_task(
     await SelectTranslationsTestUtils.assertContextMenuTranslateSelectionItem(
       runInPage,
       {
-        selectSpanishParagraph: true,
+        selectSpanishSentence: true,
         openAtEnglishHyperlink: true,
         expectMenuItemVisible: true,
         expectedTargetLanguage: "en",
diff --git a/browser/components/translations/tests/browser/browser_translations_select_context_menu_with_no_text_selected.js b/browser/components/translations/tests/browser/browser_translations_select_context_menu_with_no_text_selected.js
index 82e5d3ba63..5e7d482441 100644
--- a/browser/components/translations/tests/browser/browser_translations_select_context_menu_with_no_text_selected.js
+++ b/browser/components/translations/tests/browser/browser_translations_select_context_menu_with_no_text_selected.js
@@ -10,7 +10,7 @@
 add_task(
   async function test_translate_selection_menuitem_is_unavailable_when_no_text_is_selected() {
     const { cleanup, runInPage } = await loadTestPage({
-      page: SPANISH_PAGE_URL,
+      page: SELECT_TEST_PAGE_URL,
       languagePairs: LANGUAGE_PAIRS,
       prefs: [["browser.translations.select.enable", true]],
     });
@@ -25,8 +25,8 @@ add_task(
     await SelectTranslationsTestUtils.assertContextMenuTranslateSelectionItem(
       runInPage,
       {
-        selectSpanishParagraph: false,
-        openAtSpanishParagraph: true,
+        selectSpanishSentence: false,
+        openAtSpanishSentence: true,
         expectMenuItemVisible: false,
       },
       "The translate-selection context menu item should be unavailable when no text is selected."
diff --git a/browser/components/translations/tests/browser/browser_translations_select_context_menu_with_text_selected.js b/browser/components/translations/tests/browser/browser_translations_select_context_menu_with_text_selected.js
index deb5911a37..6b44f2ca1f 100644
--- a/browser/components/translations/tests/browser/browser_translations_select_context_menu_with_text_selected.js
+++ b/browser/components/translations/tests/browser/browser_translations_select_context_menu_with_text_selected.js
@@ -12,7 +12,7 @@
 add_task(
   async function test_translate_selection_menuitem_when_selected_text_is_not_preferred_language() {
     const { cleanup, runInPage } = await loadTestPage({
-      page: SPANISH_PAGE_URL,
+      page: SELECT_TEST_PAGE_URL,
       languagePairs: LANGUAGE_PAIRS,
       prefs: [["browser.translations.select.enable", true]],
     });
@@ -27,8 +27,8 @@ add_task(
     await SelectTranslationsTestUtils.assertContextMenuTranslateSelectionItem(
       runInPage,
       {
-        selectSpanishParagraph: true,
-        openAtSpanishParagraph: true,
+        selectSpanishSentence: true,
+        openAtSpanishSentence: true,
         expectMenuItemVisible: true,
         expectedTargetLanguage: "en",
       },
@@ -49,21 +49,21 @@ add_task(
 add_task(
   async function test_translate_selection_menuitem_when_selected_text_is_preferred_language() {
     const { cleanup, runInPage } = await loadTestPage({
-      page: ENGLISH_PAGE_URL,
+      page: SELECT_TEST_PAGE_URL,
       languagePairs: LANGUAGE_PAIRS,
       prefs: [["browser.translations.select.enable", true]],
     });
 
     await FullPageTranslationsTestUtils.assertTranslationsButton(
-      { button: false },
+      { button: true, circleArrows: false, locale: false, icon: true },
       "The button is available."
     );
 
     await SelectTranslationsTestUtils.assertContextMenuTranslateSelectionItem(
       runInPage,
       {
-        selectFirstParagraph: true,
-        openAtFirstParagraph: true,
+        selectEnglishSentence: true,
+        openAtEnglishSentence: true,
         expectMenuItemVisible: true,
         expectedTargetLanguage: null,
       },
diff --git a/browser/components/translations/tests/browser/browser_translations_select_panel_engine_cache.js b/browser/components/translations/tests/browser/browser_translations_select_panel_engine_cache.js
new file mode 100644
index 0000000000..a0ef58c694
--- /dev/null
+++ b/browser/components/translations/tests/browser/browser_translations_select_panel_engine_cache.js
@@ -0,0 +1,59 @@
+/* Any copyright is dedicated to the Public Domain.
+   https://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+/**
+ * This test case tests that the SelectTranslationsPanel successfully
+ * caches the engine within the Translator for the given language pair,
+ * and if that engine is destroyed, the Translator will correctly reinitialize
+ * the engine, even for the same language pair.
+ */
+add_task(
+  async function test_select_translations_panel_translate_sentence_on_open() {
+    const { cleanup, runInPage, resolveDownloads } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: LANGUAGE_PAIRS,
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      selectFrenchSection: true,
+      openAtFrenchSection: true,
+      expectedFromLanguage: "fr",
+      expectedToLanguage: "en",
+      expectedDownloads: 1,
+      downloadHandler: resolveDownloads,
+      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await SelectTranslationsTestUtils.clickDoneButton();
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      selectFrenchSentence: true,
+      openAtFrenchSentence: true,
+      expectedFromLanguage: "fr",
+      expectedToLanguage: "en",
+      // No downloads because the engine is cached for this language pair.
+      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await SelectTranslationsTestUtils.clickDoneButton();
+
+    info("Explicitly destroying the Translations Engine.");
+    await destroyTranslationsEngine();
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      openAtFrenchHyperlink: true,
+      expectedFromLanguage: "fr",
+      expectedToLanguage: "en",
+      // Expect downloads again since the engine was destroyed.
+      downloadHandler: resolveDownloads,
+      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await SelectTranslationsTestUtils.clickDoneButton();
+
+    await cleanup();
+  }
+);
diff --git a/browser/components/translations/tests/browser/browser_translations_select_panel_fallback_to_doc_language.js b/browser/components/translations/tests/browser/browser_translations_select_panel_fallback_to_doc_language.js
new file mode 100644
index 0000000000..d2c6f42486
--- /dev/null
+++ b/browser/components/translations/tests/browser/browser_translations_select_panel_fallback_to_doc_language.js
@@ -0,0 +1,38 @@
+/* Any copyright is dedicated to the Public Domain.
+   https://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+/**
+ * This test case tests the case of opening the SelectTranslationsPanel when the
+ * detected language is unsupported, but the page language is known to be a supported
+ * language. The panel should automatically fall back to the page language in an
+ * effort to combat falsely identified selections.
+ */
+add_task(
+  async function test_select_translations_panel_translate_sentence_on_open() {
+    const { cleanup, runInPage, resolveDownloads } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: [
+        // Do not include French.
+        { fromLang: "es", toLang: "en" },
+        { fromLang: "en", toLang: "es" },
+      ],
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      selectFrenchSentence: true,
+      openAtFrenchSentence: true,
+      // French is not supported, but the page is in Spanish, so expect Spanish.
+      expectedFromLanguage: "es",
+      expectedToLanguage: "en",
+      downloadHandler: resolveDownloads,
+      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await SelectTranslationsTestUtils.clickDoneButton();
+
+    await cleanup();
+  }
+);
diff --git a/browser/components/translations/tests/browser/browser_translations_select_panel_language_selectors.js b/browser/components/translations/tests/browser/browser_translations_select_panel_language_selectors.js
deleted file mode 100644
index 1dcc76450f..0000000000
--- a/browser/components/translations/tests/browser/browser_translations_select_panel_language_selectors.js
+++ /dev/null
@@ -1,54 +0,0 @@
-/* Any copyright is dedicated to the Public Domain.
-   http://creativecommons.org/publicdomain/zero/1.0/ */
-
-"use strict";
-
-add_task(
-  async function test_select_translations_panel_open_spanish_language_selectors() {
-    const { cleanup, runInPage } = await loadTestPage({
-      page: SPANISH_PAGE_URL,
-      languagePairs: LANGUAGE_PAIRS,
-      prefs: [["browser.translations.select.enable", true]],
-    });
-
-    await SelectTranslationsTestUtils.openPanel(runInPage, {
-      selectSpanishParagraph: true,
-      openAtSpanishParagraph: true,
-      expectedTargetLanguage: "en",
-      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewDefault,
-    });
-
-    SelectTranslationsTestUtils.assertSelectedFromLanguage({ langTag: "es" });
-    SelectTranslationsTestUtils.assertSelectedToLanguage({ langTag: "en" });
-
-    await SelectTranslationsTestUtils.clickDoneButton();
-
-    await cleanup();
-  }
-);
-
-add_task(
-  async function test_select_translations_panel_open_english_language_selectors() {
-    const { cleanup, runInPage } = await loadTestPage({
-      page: ENGLISH_PAGE_URL,
-      languagePairs: LANGUAGE_PAIRS,
-      prefs: [["browser.translations.select.enable", true]],
-    });
-
-    await SelectTranslationsTestUtils.openPanel(runInPage, {
-      selectFirstParagraph: true,
-      openAtFirstParagraph: true,
-      expectedTargetLanguage: "en",
-      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewDefault,
-    });
-
-    SelectTranslationsTestUtils.assertSelectedFromLanguage({ langTag: "en" });
-    SelectTranslationsTestUtils.assertSelectedToLanguage({
-      l10nId: "translations-panel-choose-language",
-    });
-
-    await SelectTranslationsTestUtils.clickDoneButton();
-
-    await cleanup();
-  }
-);
diff --git a/browser/components/translations/tests/browser/browser_translations_select_panel_mainview_ui.js b/browser/components/translations/tests/browser/browser_translations_select_panel_mainview_ui.js
deleted file mode 100644
index 79d21e57d0..0000000000
--- a/browser/components/translations/tests/browser/browser_translations_select_panel_mainview_ui.js
+++ /dev/null
@@ -1,36 +0,0 @@
-/* Any copyright is dedicated to the Public Domain.
-   http://creativecommons.org/publicdomain/zero/1.0/ */
-
-"use strict";
-
-/**
- * This test case verifies the visibility and initial state of UI elements within the
- * Select Translations Panel's main-view UI.
- */
-add_task(
-  async function test_select_translations_panel_mainview_ui_element_visibility() {
-    const { cleanup, runInPage } = await loadTestPage({
-      page: SPANISH_PAGE_URL,
-      languagePairs: LANGUAGE_PAIRS,
-      prefs: [["browser.translations.select.enable", true]],
-    });
-
-    await FullPageTranslationsTestUtils.assertTranslationsButton(
-      { button: true, circleArrows: false, locale: false, icon: true },
-      "The button is available."
-    );
-
-    await FullPageTranslationsTestUtils.assertPageIsUntranslated(runInPage);
-
-    await SelectTranslationsTestUtils.openPanel(runInPage, {
-      selectSpanishParagraph: true,
-      openAtSpanishParagraph: true,
-      expectedTargetLanguage: "es",
-      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewDefault,
-    });
-
-    await SelectTranslationsTestUtils.clickDoneButton();
-
-    await cleanup();
-  }
-);
diff --git a/browser/components/translations/tests/browser/browser_translations_select_panel_open_to_idle_state.js b/browser/components/translations/tests/browser/browser_translations_select_panel_open_to_idle_state.js
new file mode 100644
index 0000000000..d5a1096e70
--- /dev/null
+++ b/browser/components/translations/tests/browser/browser_translations_select_panel_open_to_idle_state.js
@@ -0,0 +1,61 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+/**
+ * This test case verifies the select translations panel's functionality when opened with an unsupported
+ * from-language, ensuring it opens with the correct view with no from-language selected.
+ */
+add_task(
+  async function test_select_translations_panel_open_no_selected_from_lang() {
+    const { cleanup, runInPage } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: [
+        // Do not include Spanish.
+        { fromLang: "fr", toLang: "en" },
+        { fromLang: "en", toLang: "fr" },
+      ],
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      selectSpanishSentence: true,
+      openAtSpanishSentence: true,
+      expectedFromLanguage: null,
+      expectedToLanguage: "en",
+      onOpenPanel:
+        SelectTranslationsTestUtils.assertPanelViewNoFromLangSelected,
+    });
+
+    await SelectTranslationsTestUtils.clickDoneButton();
+
+    await cleanup();
+  }
+);
+
+/**
+ * This test case verifies the select translations panel's functionality when opened with an undetermined
+ * to-language, ensuring it opens with the correct view with no to-language selected.
+ */
+add_task(
+  async function test_select_translations_panel_open_no_selected_to_lang() {
+    const { cleanup, runInPage } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: LANGUAGE_PAIRS,
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      selectEnglishSentence: true,
+      openAtEnglishSentence: true,
+      expectedFromLanguage: "en",
+      expectedToLanguage: null,
+      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewNoToLangSelected,
+    });
+
+    await SelectTranslationsTestUtils.clickDoneButton();
+
+    await cleanup();
+  }
+);
diff --git a/browser/components/translations/tests/browser/browser_translations_select_panel_retranslate_on_change_language_directly.js b/browser/components/translations/tests/browser/browser_translations_select_panel_retranslate_on_change_language_directly.js
new file mode 100644
index 0000000000..fff0326f75
--- /dev/null
+++ b/browser/components/translations/tests/browser/browser_translations_select_panel_retranslate_on_change_language_directly.js
@@ -0,0 +1,70 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+/**
+ * This test case verifies the behavior of triggering a translation by directly switching
+ * the from-language when the panel is already in the "translated" state from a previous
+ * language pair.
+ */
+add_task(
+  async function test_select_translations_panel_retranslate_on_change_from_language_directly() {
+    const { cleanup, runInPage, resolveDownloads } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: LANGUAGE_PAIRS,
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      selectFrenchSentence: true,
+      openAtFrenchSentence: true,
+      expectedFromLanguage: "fr",
+      expectedToLanguage: "en",
+      downloadHandler: resolveDownloads,
+      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await SelectTranslationsTestUtils.changeSelectedFromLanguage(["es"], {
+      openDropdownMenu: false,
+      pivotTranslation: true,
+      downloadHandler: resolveDownloads,
+      onChangeLanguage: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await cleanup();
+  }
+);
+
+/**
+ * This test case verifies the behavior of triggering a translation by directly switching
+ * the to-language when the panel is already in the "translated" state from a previous
+ * language pair.
+ */
+add_task(
+  async function test_select_translations_panel_retranslate_on_change_to_language_directly() {
+    const { cleanup, runInPage, resolveDownloads } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: LANGUAGE_PAIRS,
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      selectFrenchSentence: true,
+      openAtFrenchSentence: true,
+      expectedFromLanguage: "fr",
+      expectedToLanguage: "en",
+      downloadHandler: resolveDownloads,
+      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await SelectTranslationsTestUtils.changeSelectedToLanguage(["es"], {
+      openDropdownMenu: false,
+      pivotTranslation: true,
+      downloadHandler: resolveDownloads,
+      onChangeLanguage: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await cleanup();
+  }
+);
diff --git a/browser/components/translations/tests/browser/browser_translations_select_panel_retranslate_on_change_language_from_dropdown_menu.js b/browser/components/translations/tests/browser/browser_translations_select_panel_retranslate_on_change_language_from_dropdown_menu.js
new file mode 100644
index 0000000000..16f2cb39f7
--- /dev/null
+++ b/browser/components/translations/tests/browser/browser_translations_select_panel_retranslate_on_change_language_from_dropdown_menu.js
@@ -0,0 +1,68 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+/**
+ * This test case verifies the behavior of triggering a translation by switching the
+ * from-language by opening the language dropdown menu when the panel is already in
+ * the "translated" state from a previous language pair.
+ */
+add_task(
+  async function test_select_translations_panel_retranslate_on_change_from_language_via_popup() {
+    const { cleanup, runInPage, resolveDownloads } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: LANGUAGE_PAIRS,
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      openAtSpanishHyperlink: true,
+      expectedFromLanguage: "es",
+      expectedToLanguage: "en",
+      downloadHandler: resolveDownloads,
+      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await SelectTranslationsTestUtils.changeSelectedFromLanguage(["uk"], {
+      openDropdownMenu: true,
+      pivotTranslation: true,
+      downloadHandler: resolveDownloads,
+      onChangeLanguage: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await cleanup();
+  }
+);
+
+/**
+ * This test case verifies the behavior of triggering a translation by switching the
+ * to-language by opening the language dropdown menu when the panel is already in
+ * the "translated" state from a previous language pair.
+ */
+add_task(
+  async function test_select_translations_panel_retranslate_on_change_to_language_via_popup() {
+    const { cleanup, runInPage, resolveDownloads } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: LANGUAGE_PAIRS,
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      openAtSpanishHyperlink: true,
+      expectedFromLanguage: "es",
+      expectedToLanguage: "en",
+      downloadHandler: resolveDownloads,
+      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await SelectTranslationsTestUtils.changeSelectedToLanguage(["uk"], {
+      openDropdownMenu: true,
+      pivotTranslation: true,
+      downloadHandler: resolveDownloads,
+      onChangeLanguage: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await cleanup();
+  }
+);
diff --git a/browser/components/translations/tests/browser/browser_translations_select_panel_select_current_language_directly.js b/browser/components/translations/tests/browser/browser_translations_select_panel_select_current_language_directly.js
new file mode 100644
index 0000000000..f45326800f
--- /dev/null
+++ b/browser/components/translations/tests/browser/browser_translations_select_panel_select_current_language_directly.js
@@ -0,0 +1,71 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+/**
+ * This test case verifies the behavior of directly switching the from-language to the same
+ * from-language that is already selected, ensuring no change occurs to the translation state,
+ * and that no re-translation is triggered.
+ */
+add_task(
+  async function test_select_translations_panel_select_current_from_language_directly() {
+    const { cleanup, runInPage, resolveDownloads } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: LANGUAGE_PAIRS,
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      selectSpanishSentence: true,
+      openAtSpanishSentence: true,
+      expectedFromLanguage: "es",
+      expectedToLanguage: "en",
+      downloadHandler: resolveDownloads,
+      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await SelectTranslationsTestUtils.changeSelectedFromLanguage(["es"], {
+      openDropdownMenu: false,
+      // No downloads are resolved, because no re-translation is triggered.
+      onChangeLanguage: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await SelectTranslationsTestUtils.clickDoneButton();
+
+    await cleanup();
+  }
+);
+
+/**
+ * This test case verifies the behavior of directly switching the to-language to the same
+ * to-language that is already selected, ensuring no change occurs to the translation state,
+ * and that no re-translation is triggered.
+ */
+add_task(
+  async function test_select_translations_panel_select_current_from_language_directly() {
+    const { cleanup, runInPage, resolveDownloads } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: LANGUAGE_PAIRS,
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      openAtFrenchHyperlink: true,
+      expectedFromLanguage: "fr",
+      expectedToLanguage: "en",
+      downloadHandler: resolveDownloads,
+      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await SelectTranslationsTestUtils.changeSelectedToLanguage(["en"], {
+      openDropdownMenu: false,
+      // No downloads are resolved, because no re-translation is triggered.
+      onChangeLanguage: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await SelectTranslationsTestUtils.clickDoneButton();
+
+    await cleanup();
+  }
+);
diff --git a/browser/components/translations/tests/browser/browser_translations_select_panel_select_current_language_from_dropdown_menu.js b/browser/components/translations/tests/browser/browser_translations_select_panel_select_current_language_from_dropdown_menu.js
new file mode 100644
index 0000000000..04aa731cf2
--- /dev/null
+++ b/browser/components/translations/tests/browser/browser_translations_select_panel_select_current_language_from_dropdown_menu.js
@@ -0,0 +1,71 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+/**
+ * This test case verifies the behavior of directly switching the from-language to the same
+ * from-language that is already selected by opening the language dropdown menu,
+ * ensuring no change occurs to the translation state, and that no re-translation is triggered.
+ */
+add_task(
+  async function test_select_translations_panel_select_current_from_language_directly() {
+    const { cleanup, runInPage, resolveDownloads } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: LANGUAGE_PAIRS,
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      selectSpanishSentence: true,
+      openAtSpanishSentence: true,
+      expectedFromLanguage: "es",
+      expectedToLanguage: "en",
+      downloadHandler: resolveDownloads,
+      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await SelectTranslationsTestUtils.changeSelectedFromLanguage(["es"], {
+      openDropdownMenu: true,
+      // No downloads are resolved, because no re-translation is triggered.
+      onChangeLanguage: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await SelectTranslationsTestUtils.clickDoneButton();
+
+    await cleanup();
+  }
+);
+
+/**
+ * This test case verifies the behavior of directly switching the to-language to the same
+ * to-language that is already selected by opening the language dropdown menu,
+ * ensuring no change occurs to the translation state, and that no re-translation is triggered.
+ */
+add_task(
+  async function test_select_translations_panel_select_current_from_language_directly() {
+    const { cleanup, runInPage, resolveDownloads } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: LANGUAGE_PAIRS,
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      openAtFrenchHyperlink: true,
+      expectedFromLanguage: "fr",
+      expectedToLanguage: "en",
+      downloadHandler: resolveDownloads,
+      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await SelectTranslationsTestUtils.changeSelectedToLanguage(["en"], {
+      openDropdownMenu: true,
+      // No downloads are resolved, because no re-translation is triggered.
+      onChangeLanguage: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await SelectTranslationsTestUtils.clickDoneButton();
+
+    await cleanup();
+  }
+);
diff --git a/browser/components/translations/tests/browser/browser_translations_select_panel_select_same_from_and_to_languages_directly.js b/browser/components/translations/tests/browser/browser_translations_select_panel_select_same_from_and_to_languages_directly.js
new file mode 100644
index 0000000000..95feac6708
--- /dev/null
+++ b/browser/components/translations/tests/browser/browser_translations_select_panel_select_same_from_and_to_languages_directly.js
@@ -0,0 +1,71 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+/**
+ * This test case verifies the behavior of switching the from-language to the same value
+ * that is currently selected in the to-language, effectively stealing the to-language's
+ * value, leaving it unselected and focused.
+ */
+add_task(
+  async function test_select_translations_panel_select_same_from_language_directly() {
+    const { cleanup, runInPage } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: [
+        // Do not include Spanish.
+        { fromLang: "fr", toLang: "en" },
+        { fromLang: "en", toLang: "fr" },
+      ],
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      selectSpanishSection: true,
+      openAtSpanishSection: true,
+      expectedFromLanguage: null,
+      expectedToLanguage: "en",
+      onOpenPanel:
+        SelectTranslationsTestUtils.assertPanelViewNoFromLangSelected,
+    });
+
+    await SelectTranslationsTestUtils.changeSelectedFromLanguage(["en"], {
+      openDropdownMenu: false,
+      onChangeLanguage:
+        SelectTranslationsTestUtils.assertPanelViewNoFromToSelected,
+    });
+
+    await cleanup();
+  }
+);
+
+/**
+ * This test case verifies the behavior of switching the to-language to the same value
+ * that is currently selected in the from-language, effectively stealing the from-language's
+ * value, leaving it unselected and focused.
+ */
+add_task(
+  async function test_select_translations_panel_select_same_to_language_directly() {
+    const { cleanup, runInPage } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: LANGUAGE_PAIRS,
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      selectEnglishSection: true,
+      openAtEnglishSection: true,
+      expectedFromLanguage: "en",
+      expectedToLanguage: null,
+      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewNoToLangSelected,
+    });
+
+    await SelectTranslationsTestUtils.changeSelectedToLanguage(["en"], {
+      openDropdownMenu: false,
+      onChangeLanguage:
+        SelectTranslationsTestUtils.assertPanelViewNoFromLangSelected,
+    });
+
+    await cleanup();
+  }
+);
diff --git a/browser/components/translations/tests/browser/browser_translations_select_panel_select_same_from_and_to_languages_from_dropdown_menu.js b/browser/components/translations/tests/browser/browser_translations_select_panel_select_same_from_and_to_languages_from_dropdown_menu.js
new file mode 100644
index 0000000000..5c27be411f
--- /dev/null
+++ b/browser/components/translations/tests/browser/browser_translations_select_panel_select_same_from_and_to_languages_from_dropdown_menu.js
@@ -0,0 +1,71 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+/**
+ * This test case verifies the behavior of switching the from-language to the same value
+ * that is currently selected in the to-language by opening the language dropdown menu,
+ * effectively stealing the to-language's value, leaving it unselected and focused.
+ */
+add_task(
+  async function test_select_translations_panel_select_same_from_language_via_popup() {
+    const { cleanup, runInPage } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: [
+        // Do not include Spanish.
+        { fromLang: "fr", toLang: "en" },
+        { fromLang: "en", toLang: "fr" },
+      ],
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      selectSpanishSection: true,
+      openAtSpanishSection: true,
+      expectedFromLanguage: null,
+      expectedToLanguage: "en",
+      onOpenPanel:
+        SelectTranslationsTestUtils.assertPanelViewNoFromLangSelected,
+    });
+
+    await SelectTranslationsTestUtils.changeSelectedFromLanguage(["en"], {
+      openDropdownMenu: true,
+      onChangeLanguage:
+        SelectTranslationsTestUtils.assertPanelViewNoFromToSelected,
+    });
+
+    await cleanup();
+  }
+);
+
+/**
+ * This test case verifies the behavior of switching the to-language to the same value
+ * that is currently selected in the from-language by opening the language dropdown menu,
+ * effectively stealing the from-language's value, leaving it unselected and focused.
+ */
+add_task(
+  async function test_select_translations_panel_select_same_to_language_via_popup() {
+    const { cleanup, runInPage } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: LANGUAGE_PAIRS,
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      selectEnglishSection: true,
+      openAtEnglishSection: true,
+      expectedFromLanguage: "en",
+      expectedToLanguage: null,
+      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewNoToLangSelected,
+    });
+
+    await SelectTranslationsTestUtils.changeSelectedToLanguage(["en"], {
+      openDropdownMenu: true,
+      onChangeLanguage:
+        SelectTranslationsTestUtils.assertPanelViewNoFromLangSelected,
+    });
+
+    await cleanup();
+  }
+);
diff --git a/browser/components/translations/tests/browser/browser_translations_select_panel_translate_on_change_language_directly.js b/browser/components/translations/tests/browser/browser_translations_select_panel_translate_on_change_language_directly.js
new file mode 100644
index 0000000000..64d067d1f4
--- /dev/null
+++ b/browser/components/translations/tests/browser/browser_translations_select_panel_translate_on_change_language_directly.js
@@ -0,0 +1,71 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+/**
+ * This test case verifies the behavior of triggering a translation by directly switching
+ * the from-language to a valid selection when the panel is in the "idle" state without
+ * valid language pair.
+ */
+add_task(
+  async function test_select_translations_panel_translate_on_change_from_language_directly() {
+    const { cleanup, runInPage, resolveDownloads } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: [
+        // Do not include Spanish.
+        { fromLang: "fr", toLang: "en" },
+        { fromLang: "en", toLang: "fr" },
+      ],
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      selectSpanishSection: true,
+      openAtSpanishSection: true,
+      expectedFromLanguage: null,
+      expectedToLanguage: "en",
+      onOpenPanel:
+        SelectTranslationsTestUtils.assertPanelViewNoFromLangSelected,
+    });
+
+    await SelectTranslationsTestUtils.changeSelectedFromLanguage(["fr"], {
+      openDropdownMenu: false,
+      downloadHandler: resolveDownloads,
+      onChangeLanguage: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await cleanup();
+  }
+);
+
+/**
+ * This test case verifies the behavior of triggering a translation by directly switching
+ * the to-language to a valid selection when the panel is in the "idle" state without
+ * valid language pair.
+ */
+add_task(
+  async function test_select_translations_panel_translate_on_change_to_language_directly() {
+    const { cleanup, runInPage, resolveDownloads } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: LANGUAGE_PAIRS,
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      selectEnglishSection: true,
+      openAtEnglishSection: true,
+      expectedFromLanguage: "en",
+      expectedToLanguage: null,
+      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewNoToLangSelected,
+    });
+
+    await SelectTranslationsTestUtils.changeSelectedToLanguage(["es"], {
+      openDropdownMenu: false,
+      downloadHandler: resolveDownloads,
+      onChangeLanguage: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await cleanup();
+  }
+);
diff --git a/browser/components/translations/tests/browser/browser_translations_select_panel_translate_on_change_language_from_dropdown_menu.js b/browser/components/translations/tests/browser/browser_translations_select_panel_translate_on_change_language_from_dropdown_menu.js
new file mode 100644
index 0000000000..0cd205d721
--- /dev/null
+++ b/browser/components/translations/tests/browser/browser_translations_select_panel_translate_on_change_language_from_dropdown_menu.js
@@ -0,0 +1,71 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+/**
+ * This test case verifies the behavior of triggering a translation by switching the
+ * from-language to a valid selection by opening the language dropdown when the panel
+ * is in the "idle" state without valid language pair.
+ */
+add_task(
+  async function test_select_translations_panel_translate_on_change_from_language() {
+    const { cleanup, runInPage, resolveDownloads } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: [
+        // Do not include Spanish.
+        { fromLang: "fr", toLang: "en" },
+        { fromLang: "en", toLang: "fr" },
+      ],
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      selectSpanishSection: true,
+      openAtSpanishSection: true,
+      expectedFromLanguage: null,
+      expectedToLanguage: "en",
+      onOpenPanel:
+        SelectTranslationsTestUtils.assertPanelViewNoFromLangSelected,
+    });
+
+    await SelectTranslationsTestUtils.changeSelectedFromLanguage(["fr"], {
+      openDropdownMenu: true,
+      downloadHandler: resolveDownloads,
+      onChangeLanguage: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await cleanup();
+  }
+);
+
+/**
+ * This test case verifies the behavior of triggering a translation by switching the
+ * to-language to a valid selection by opening the language dropdown when the panel
+ * is in the "idle" state without valid language pair.
+ */
+add_task(
+  async function test_select_translations_panel_translate_on_change_to_language() {
+    const { cleanup, runInPage, resolveDownloads } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: LANGUAGE_PAIRS,
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      selectEnglishSection: true,
+      openAtEnglishSection: true,
+      expectedFromLanguage: "en",
+      expectedToLanguage: null,
+      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewNoToLangSelected,
+    });
+
+    await SelectTranslationsTestUtils.changeSelectedToLanguage(["es"], {
+      openDropdownMenu: true,
+      downloadHandler: resolveDownloads,
+      onChangeLanguage: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await cleanup();
+  }
+);
diff --git a/browser/components/translations/tests/browser/browser_translations_select_panel_translate_on_change_language_multiple_times_directly.js b/browser/components/translations/tests/browser/browser_translations_select_panel_translate_on_change_language_multiple_times_directly.js
new file mode 100644
index 0000000000..b3c02a96f6
--- /dev/null
+++ b/browser/components/translations/tests/browser/browser_translations_select_panel_translate_on_change_language_multiple_times_directly.js
@@ -0,0 +1,97 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+/**
+ * This test case verifies the behavior of directly changing the from-language in rapid succession,
+ * ensuring that any triggered translations are resolved/dropped in order, and that the final translated
+ * state matches the final selected language.
+ */
+add_task(
+  async function test_select_translations_panel_translate_on_change_from_language_multiple_times_directly() {
+    const { cleanup, runInPage, resolveDownloads } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: [
+        // Do not include Spanish.
+        { fromLang: "fa", toLang: "en" },
+        { fromLang: "en", toLang: "fa" },
+        { fromLang: "fi", toLang: "en" },
+        { fromLang: "en", toLang: "fi" },
+        { fromLang: "fr", toLang: "en" },
+        { fromLang: "en", toLang: "fr" },
+        { fromLang: "sl", toLang: "en" },
+        { fromLang: "en", toLang: "sl" },
+        { fromLang: "uk", toLang: "en" },
+        { fromLang: "en", toLang: "uk" },
+      ],
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      selectSpanishSentence: true,
+      openAtSpanishSentence: true,
+      expectedFromLanguage: null,
+      expectedToLanguage: "en",
+      onOpenPanel:
+        SelectTranslationsTestUtils.assertPanelViewNoFromLangSelected,
+    });
+
+    await SelectTranslationsTestUtils.changeSelectedFromLanguage(
+      ["fa", "fi", "fr", "sl", "uk"],
+      {
+        openDropdownMenu: false,
+        downloadHandler: resolveDownloads,
+        onChangeLanguage: SelectTranslationsTestUtils.assertPanelViewTranslated,
+      }
+    );
+
+    await cleanup();
+  }
+);
+
+/**
+ * This test case verifies the behavior of directly changing the to-language in rapid succession,
+ * ensuring that any triggered translations are resolved/dropped in order, and that the final translated
+ * state matches the final selected language.
+ */
+add_task(
+  async function test_select_translations_panel_translate_on_change_to_language_multiple_times_directly() {
+    const { cleanup, runInPage, resolveDownloads } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: [
+        { fromLang: "es", toLang: "en" },
+        { fromLang: "en", toLang: "es" },
+        { fromLang: "fa", toLang: "en" },
+        { fromLang: "en", toLang: "fa" },
+        { fromLang: "fi", toLang: "en" },
+        { fromLang: "en", toLang: "fi" },
+        { fromLang: "fr", toLang: "en" },
+        { fromLang: "en", toLang: "fr" },
+        { fromLang: "sl", toLang: "en" },
+        { fromLang: "en", toLang: "sl" },
+        { fromLang: "uk", toLang: "en" },
+        { fromLang: "en", toLang: "uk" },
+      ],
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      openAtEnglishHyperlink: true,
+      expectedFromLanguage: "en",
+      expectedToLanguage: null,
+      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewNoToLangSelected,
+    });
+
+    await SelectTranslationsTestUtils.changeSelectedToLanguage(
+      ["es", "fa", "fi", "fr", "sl", "uk", "fa"],
+      {
+        openDropdownMenu: false,
+        downloadHandler: resolveDownloads,
+        onChangeLanguage: SelectTranslationsTestUtils.assertPanelViewTranslated,
+      }
+    );
+
+    await cleanup();
+  }
+);
diff --git a/browser/components/translations/tests/browser/browser_translations_select_panel_translate_on_change_language_multiple_times_from_dropdown_menu.js b/browser/components/translations/tests/browser/browser_translations_select_panel_translate_on_change_language_multiple_times_from_dropdown_menu.js
new file mode 100644
index 0000000000..50c877cfbc
--- /dev/null
+++ b/browser/components/translations/tests/browser/browser_translations_select_panel_translate_on_change_language_multiple_times_from_dropdown_menu.js
@@ -0,0 +1,98 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+/**
+ * This test case verifies the behavior of directly changing the from-language in rapid succession
+ * by opening the language dropdown menu, ensuring that any triggered translations are resolved/dropped
+ * in order, and that the final translated state matches the final selected language.
+ */
+add_task(
+  async function test_select_translations_panel_translate_on_change_from_language_multiple_times_via_popup() {
+    const { cleanup, runInPage, resolveDownloads } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: [
+        // Do not include Spanish.
+        { fromLang: "fa", toLang: "en" },
+        { fromLang: "en", toLang: "fa" },
+        { fromLang: "fi", toLang: "en" },
+        { fromLang: "en", toLang: "fi" },
+        { fromLang: "fr", toLang: "en" },
+        { fromLang: "en", toLang: "fr" },
+        { fromLang: "sl", toLang: "en" },
+        { fromLang: "en", toLang: "sl" },
+        { fromLang: "uk", toLang: "en" },
+        { fromLang: "en", toLang: "uk" },
+      ],
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      selectSpanishSentence: true,
+      openAtSpanishSentence: true,
+      expectedFromLanguage: null,
+      expectedToLanguage: "en",
+      onOpenPanel:
+        SelectTranslationsTestUtils.assertPanelViewNoFromLangSelected,
+    });
+
+    await SelectTranslationsTestUtils.changeSelectedFromLanguage(
+      ["fa", "fi", "fr", "sl", "uk"],
+      {
+        openDropdownMenu: true,
+        downloadHandler: resolveDownloads,
+        onChangeLanguage: SelectTranslationsTestUtils.assertPanelViewTranslated,
+      }
+    );
+
+    await cleanup();
+  }
+);
+
+/**
+ * This test case verifies the behavior of directly changing the to-language in rapid succession
+ * by opening the language dropdown menu, ensuring that any triggered translations are resolved/dropped
+ * in order, and that the final translated state matches the final selected language.
+ */
+add_task(
+  async function test_select_translations_panel_translate_on_change_to_language_multiple_times_via_popup() {
+    const { cleanup, runInPage, resolveDownloads } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: [
+        { fromLang: "es", toLang: "en" },
+        { fromLang: "en", toLang: "es" },
+        { fromLang: "fa", toLang: "en" },
+        { fromLang: "en", toLang: "fa" },
+        { fromLang: "fi", toLang: "en" },
+        { fromLang: "en", toLang: "fi" },
+        { fromLang: "fr", toLang: "en" },
+        { fromLang: "en", toLang: "fr" },
+        { fromLang: "sl", toLang: "en" },
+        { fromLang: "en", toLang: "sl" },
+        { fromLang: "uk", toLang: "en" },
+        { fromLang: "en", toLang: "uk" },
+      ],
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      selectEnglishSentence: true,
+      openAtEnglishSentence: true,
+      expectedFromLanguage: "en",
+      expectedToLanguage: null,
+      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewNoToLangSelected,
+    });
+
+    await SelectTranslationsTestUtils.changeSelectedToLanguage(
+      ["es", "fa", "fi", "fr", "sl", "uk"],
+      {
+        openDropdownMenu: true,
+        downloadHandler: resolveDownloads,
+        onChangeLanguage: SelectTranslationsTestUtils.assertPanelViewTranslated,
+      }
+    );
+
+    await cleanup();
+  }
+);
diff --git a/browser/components/translations/tests/browser/browser_translations_select_panel_translate_on_open.js b/browser/components/translations/tests/browser/browser_translations_select_panel_translate_on_open.js
new file mode 100644
index 0000000000..7c7d6d88c9
--- /dev/null
+++ b/browser/components/translations/tests/browser/browser_translations_select_panel_translate_on_open.js
@@ -0,0 +1,86 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+/**
+ * This test case tests the case of opening the SelectTranslationsPanel to a valid
+ * language pair from a short selection of text, which should trigger a translation
+ * on panel open.
+ */
+add_task(
+  async function test_select_translations_panel_translate_sentence_on_open() {
+    const { cleanup, runInPage, resolveDownloads } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: LANGUAGE_PAIRS,
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      selectFrenchSentence: true,
+      openAtFrenchSentence: true,
+      expectedFromLanguage: "fr",
+      expectedToLanguage: "en",
+      downloadHandler: resolveDownloads,
+      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await SelectTranslationsTestUtils.clickDoneButton();
+
+    await cleanup();
+  }
+);
+
+/**
+ * This test case tests the case of opening the SelectTranslationsPanel to a valid
+ * language pair from hyperlink text, which should trigger a translation on panel open.
+ */
+add_task(
+  async function test_select_translations_panel_translate_link_text_on_open() {
+    const { cleanup, runInPage, resolveDownloads } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: LANGUAGE_PAIRS,
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      openAtSpanishHyperlink: true,
+      expectedFromLanguage: "es",
+      expectedToLanguage: "en",
+      downloadHandler: resolveDownloads,
+      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await SelectTranslationsTestUtils.clickDoneButton();
+
+    await cleanup();
+  }
+);
+
+/**
+ * This test case tests the case of opening the SelectTranslationsPanel to a valid
+ * language pair from a long selection of text, which should trigger a translation
+ * on panel open.
+ */
+add_task(
+  async function test_select_translations_panel_translate_long_text_on_open() {
+    const { cleanup, runInPage, resolveDownloads } = await loadTestPage({
+      page: SELECT_TEST_PAGE_URL,
+      languagePairs: LANGUAGE_PAIRS,
+      prefs: [["browser.translations.select.enable", true]],
+    });
+
+    await SelectTranslationsTestUtils.openPanel(runInPage, {
+      selectFrenchSection: true,
+      openAtFrenchSection: true,
+      expectedFromLanguage: "fr",
+      expectedToLanguage: "en",
+      downloadHandler: resolveDownloads,
+      onOpenPanel: SelectTranslationsTestUtils.assertPanelViewTranslated,
+    });
+
+    await SelectTranslationsTestUtils.clickDoneButton();
+
+    await cleanup();
+  }
+);
diff --git a/browser/components/translations/tests/browser/head.js b/browser/components/translations/tests/browser/head.js
index 200ed08719..454de9146b 100644
--- a/browser/components/translations/tests/browser/head.js
+++ b/browser/components/translations/tests/browser/head.js
@@ -18,7 +18,7 @@ async function addTab(url) {
   const tab = await BrowserTestUtils.openNewForegroundTab(
     gBrowser,
     url,
-    true // Wait for laod
+    true // Wait for load
   );
   return {
     tab,
@@ -65,7 +65,6 @@ function click(element, message) {
  */
 function getAllByL10nId(l10nId, doc = document) {
   const elements = doc.querySelectorAll(`[data-l10n-id="${l10nId}"]`);
-  console.log(doc);
   if (elements.length === 0) {
     throw new Error("Could not find the element by l10n id: " + l10nId);
   }
@@ -285,6 +284,19 @@ async function toggleReaderMode() {
  */
 class SharedTranslationsTestUtils {
   /**
+   * Asserts that the specified element currently has focus.
+   *
+   * @param {Element} element - The element to check for focus.
+   */
+  static _assertHasFocus(element) {
+    is(
+      document.activeElement,
+      element,
+      `The element '${element.id}' should have focus.`
+    );
+  }
+
+  /**
    * Asserts that the mainViewId of the panel matches the given string.
    *
    * @param {FullPageTranslationsPanel | SelectTranslationsPanel} panel
@@ -300,53 +312,30 @@ class SharedTranslationsTestUtils {
   }
 
   /**
-   * Asserts that the selected from-language matches the provided arguments.
+   * Asserts that the selected language in the menu matches the langTag or l10nId.
    *
-   * @param {FullPageTranslationsPanel | SelectTranslationsPanel} panel
-   *  - The UI component or panel whose selected from-language is being asserted.
-   * @param {object} options - An object containing assertion parameters.
-   * @param {string} [options.langTag] - A BCP-47 language tag.
-   * @param {string} [options.l10nId] - A localization identifier.
+   * @param {Element} menuList - The menu list element to check.
+   * @param {object} options - Options containing 'langTag' and 'l10nId' to assert against.
+   * @param {string} [options.langTag] - The BCP-47 language tag to match.
+   * @param {string} [options.l10nId] - The localization Id to match.
    */
-  static _assertSelectedFromLanguage(panel, { langTag, l10nId }) {
-    const { fromMenuList } = panel.elements;
-    is(
-      fromMenuList.value,
-      langTag,
-      "Expected selected from-language to match the given language tag"
+  static _assertSelectedLanguage(menuList, { langTag, l10nId }) {
+    ok(
+      menuList.label,
+      `The label for the menulist ${menuList.id} should not be empty.`
     );
-    if (l10nId) {
-      is(
-        fromMenuList.getAttribute("data-l10n-id"),
-        l10nId,
-        "Expected selected from-language to match the given l10n id"
-      );
-    }
-  }
-
-  /**
-   * Asserts that the selected to-language matches the provided arguments.
-   *
-   * @param {FullPageTranslationsPanel | SelectTranslationsPanel} panel
-   *  - The UI component or panel whose selected from-language is being asserted.
-   * @param {object} options - An object containing assertion parameters.
-   * @param {string} [options.langTag] - A BCP-47 language tag.
-   * @param {string} [options.l10nId] - A localization identifier.
-   */
-  static _assertSelectedToLanguage(panel, { langTag, l10nId }) {
-    const { toMenuList } = panel.elements;
     if (langTag) {
       is(
-        toMenuList.value,
+        menuList.value,
         langTag,
-        "Expected selected to-language to match the given language tag"
+        `Expected ${menuList.id} selection to match '${langTag}'`
       );
     }
     if (l10nId) {
       is(
-        toMenuList.getAttribute("data-l10n-id"),
+        menuList.getAttribute("data-l10n-id"),
         l10nId,
-        "Expected selected to-language to match the given l10n id"
+        `Expected ${menuList.id} l10nId to match '${l10nId}'`
       );
     }
   }
@@ -391,6 +380,7 @@ class SharedTranslationsTestUtils {
    *                              This is often used to trigger the event on the expected element.
    * @param {Function|null} [postEventAssertion=null] - An optional callback function to execute after
    *                                                    the event has occurred.
+   * @param {ChromeWindow} [win]
    * @throws Throws if the element with the specified `elementId` does not exist.
    * @returns {Promise<void>}
    */
@@ -398,18 +388,21 @@ class SharedTranslationsTestUtils {
     elementId,
     eventName,
     callback,
-    postEventAssertion = null
+    postEventAssertion = null,
+    win = window
   ) {
-    const element = document.getElementById(elementId);
+    const element = win.document.getElementById(elementId);
     if (!element) {
-      throw new Error("Unable to find the translations panel element.");
+      throw new Error(
+        `Unable to find the ${elementId} element in the document.`
+      );
     }
     const promise = BrowserTestUtils.waitForEvent(element, eventName);
     await callback();
-    info("Waiting for the translations panel popup to be shown");
+    info(`Waiting for the ${elementId} ${eventName} event`);
     await promise;
     if (postEventAssertion) {
-      postEventAssertion();
+      await postEventAssertion();
     }
     // Wait a single tick on the event loop.
     await new Promise(resolve => setTimeout(resolve, 0));
@@ -568,10 +561,12 @@ class FullPageTranslationsTestUtils {
    *
    * @param {string} fromLanguage - The BCP-47 language tag being translated from.
    * @param {string} toLanguage - The BCP-47 language tag being translated into.
+   * @param {ChromeWindow} win
    */
-  static async #assertLangTagIsShownOnTranslationsButton(
+  static async assertLangTagIsShownOnTranslationsButton(
     fromLanguage,
-    toLanguage
+    toLanguage,
+    win = window
   ) {
     info(
       `Ensuring that the translations button displays the language tag "${toLanguage}"`
@@ -579,7 +574,8 @@ class FullPageTranslationsTestUtils {
     const { button, locale } =
       await FullPageTranslationsTestUtils.assertTranslationsButton(
         { button: true, circleArrows: false, locale: true, icon: true },
-        "The icon presents the locale."
+        "The icon presents the locale.",
+        win
       );
     is(
       locale.innerText,
@@ -605,12 +601,14 @@ class FullPageTranslationsTestUtils {
    * @param {string} toLanguage - The BCP-47 language tag being translated into.
    * @param {Function} runInPage - Allows running a closure in the content page.
    * @param {string} message - An optional message to log to info.
+   * @param {ChromeWindow} [win]
    */
   static async assertPageIsTranslated(
     fromLanguage,
     toLanguage,
     runInPage,
-    message = null
+    message = null,
+    win = window
   ) {
     if (message) {
       info(message);
@@ -625,9 +623,10 @@ class FullPageTranslationsTestUtils {
       );
     };
     await runInPage(callback, { fromLang: fromLanguage, toLang: toLanguage });
-    await FullPageTranslationsTestUtils.#assertLangTagIsShownOnTranslationsButton(
+    await FullPageTranslationsTestUtils.assertLangTagIsShownOnTranslationsButton(
       fromLanguage,
-      toLanguage
+      toLanguage,
+      win
     );
   }
 
@@ -668,6 +667,9 @@ class FullPageTranslationsTestUtils {
         changeSourceLanguageButton: false,
         dismissErrorButton: false,
         error: false,
+        errorMessage: false,
+        errorMessageHint: false,
+        errorHintAction: false,
         fromMenuList: false,
         fromLabel: false,
         header: false,
@@ -744,6 +746,34 @@ class FullPageTranslationsTestUtils {
   }
 
   /**
+   * Asserts that panel element visibility matches the initialization-failure view.
+   */
+  static assertPanelViewInitFailure() {
+    info("Checking that the panel shows the default view");
+    const { translateButton } = FullPageTranslationsPanel.elements;
+    FullPageTranslationsTestUtils.#assertPanelMainViewId(
+      "full-page-translations-panel-view-default"
+    );
+    FullPageTranslationsTestUtils.#assertPanelElementVisibility({
+      cancelButton: true,
+      error: true,
+      errorMessage: true,
+      errorMessageHint: true,
+      errorHintAction: true,
+      header: true,
+      translateButton: true,
+    });
+    is(
+      translateButton.disabled,
+      true,
+      "The translate button should be disabled."
+    );
+    FullPageTranslationsTestUtils.#assertPanelHeaderL10nId(
+      "translations-panel-header"
+    );
+  }
+
+  /**
    * Asserts that panel element visibility matches the panel error view.
    */
   static assertPanelViewError() {
@@ -753,6 +783,7 @@ class FullPageTranslationsTestUtils {
     );
     FullPageTranslationsTestUtils.#assertPanelElementVisibility({
       error: true,
+      errorMessage: true,
       ...FullPageTranslationsTestUtils.#defaultViewVisibilityExpectations,
     });
     FullPageTranslationsTestUtils.#assertPanelHeaderL10nId(
@@ -854,25 +885,31 @@ class FullPageTranslationsTestUtils {
   /**
    * Asserts that the selected from-language matches the provided language tag.
    *
-   * @param {string} langTag - A BCP-47 language tag.
+   * @param {object} options - Options containing 'langTag' and 'l10nId' to assert against.
+   * @param {string} [options.langTag] - The BCP-47 language tag to match.
+   * @param {string} [options.l10nId] - The localization Id to match.
    */
   static assertSelectedFromLanguage({ langTag, l10nId }) {
-    SharedTranslationsTestUtils._assertSelectedFromLanguage(
-      FullPageTranslationsPanel,
-      { langTag, l10nId }
-    );
+    const { fromMenuList } = FullPageTranslationsPanel.elements;
+    SharedTranslationsTestUtils._assertSelectedLanguage(fromMenuList, {
+      langTag,
+      l10nId,
+    });
   }
 
   /**
    * Asserts that the selected to-language matches the provided language tag.
    *
-   * @param {string} langTag - A BCP-47 language tag.
+   * @param {object} options - Options containing 'langTag' and 'l10nId' to assert against.
+   * @param {string} [options.langTag] - The BCP-47 language tag to match.
+   * @param {string} [options.l10nId] - The localization Id to match.
    */
   static assertSelectedToLanguage({ langTag, l10nId }) {
-    SharedTranslationsTestUtils._assertSelectedToLanguage(
-      FullPageTranslationsPanel,
-      { langTag, l10nId }
-    );
+    const { toMenuList } = FullPageTranslationsPanel.elements;
+    SharedTranslationsTestUtils._assertSelectedLanguage(toMenuList, {
+      langTag,
+      l10nId,
+    });
   }
 
   /**
@@ -880,16 +917,21 @@ class FullPageTranslationsTestUtils {
    *
    * @param {Record<string, boolean>} visibleAssertions
    * @param {string} message The message for the assertion.
+   * @param {ChromeWindow} [win]
    * @returns {HTMLElement}
    */
-  static async assertTranslationsButton(visibleAssertions, message) {
+  static async assertTranslationsButton(
+    visibleAssertions,
+    message,
+    win = window
+  ) {
     const elements = {
-      button: document.getElementById("translations-button"),
-      icon: document.getElementById("translations-button-icon"),
-      circleArrows: document.getElementById(
+      button: win.document.getElementById("translations-button"),
+      icon: win.document.getElementById("translations-button-icon"),
+      circleArrows: win.document.getElementById(
         "translations-button-circle-arrows"
       ),
-      locale: document.getElementById("translations-button-locale"),
+      locale: win.document.getElementById("translations-button-locale"),
     };
 
     for (const [name, element] of Object.entries(elements)) {
@@ -1083,25 +1125,31 @@ class FullPageTranslationsTestUtils {
    * @param {boolean} config.pivotTranslation
    *  - True if the expected translation is a pivot translation, otherwise false.
    *    Affects the number of expected downloads.
+   * @param {ChromeWindow} [config.win]
+   *  - An optional ChromeWindow, for multi-window tests.
    */
   static async clickTranslateButton({
     downloadHandler = null,
     pivotTranslation = false,
+    win = window,
   } = {}) {
     logAction();
-    const { translateButton } = FullPageTranslationsPanel.elements;
+    const { translateButton } = win.FullPageTranslationsPanel.elements;
     assertVisibility({ visible: { translateButton } });
     await FullPageTranslationsTestUtils.waitForPanelPopupEvent(
       "popuphidden",
       () => {
         click(translateButton);
-      }
+      },
+      null /* postEventAssertion */,
+      win
     );
 
     if (downloadHandler) {
       await FullPageTranslationsTestUtils.assertTranslationsButton(
         { button: true, circleArrows: true, locale: false, icon: true },
-        "The icon presents the loading indicator."
+        "The icon presents the loading indicator.",
+        win
       );
       await downloadHandler(pivotTranslation ? 2 : 1);
     }
@@ -1117,21 +1165,26 @@ class FullPageTranslationsTestUtils {
    *  - Open the panel from the app menu. If false, uses the translations button.
    * @param {boolean} config.openWithKeyboard
    *  - Open the panel by synthesizing the keyboard. If false, synthesizes the mouse.
+   * @param {ChromeWindow} [config.win]
+   *  - An optional window for multi-window tests.
    */
   static async openPanel({
     onOpenPanel = null,
     openFromAppMenu = false,
     openWithKeyboard = false,
+    win = window,
   }) {
     logAction();
-    await closeAllOpenPanelsAndMenus();
+    await closeAllOpenPanelsAndMenus(win);
     if (openFromAppMenu) {
       await FullPageTranslationsTestUtils.#openPanelViaAppMenu({
+        win,
         onOpenPanel,
         openWithKeyboard,
       });
     } else {
       await FullPageTranslationsTestUtils.#openPanelViaTranslationsButton({
+        win,
         onOpenPanel,
         openWithKeyboard,
       });
@@ -1146,21 +1199,26 @@ class FullPageTranslationsTestUtils {
    *  - A function to run as soon as the panel opens.
    * @param {boolean} config.openWithKeyboard
    *  - Open the panel by synthesizing the keyboard. If false, synthesizes the mouse.
+   * @param {ChromeWindow} [config.win]
    */
   static async #openPanelViaAppMenu({
     onOpenPanel = null,
     openWithKeyboard = false,
+    win = window,
   }) {
     logAction();
-    const appMenuButton = getById("PanelUI-menu-button");
+    const appMenuButton = getById("PanelUI-menu-button", win.document);
     if (openWithKeyboard) {
       hitEnterKey(appMenuButton, "Opening the app-menu button with keyboard");
     } else {
       click(appMenuButton, "Opening the app-menu button");
     }
-    await BrowserTestUtils.waitForEvent(window.PanelUI.mainView, "ViewShown");
+    await BrowserTestUtils.waitForEvent(win.PanelUI.mainView, "ViewShown");
 
-    const translateSiteButton = getById("appMenu-translate-button");
+    const translateSiteButton = getById(
+      "appMenu-translate-button",
+      win.document
+    );
 
     is(
       translateSiteButton.disabled,
@@ -1189,16 +1247,19 @@ class FullPageTranslationsTestUtils {
    *  - A function to run as soon as the panel opens.
    * @param {boolean} config.openWithKeyboard
    *  - Open the panel by synthesizing the keyboard. If false, synthesizes the mouse.
+   * @param {ChromeWindow} [config.win]
    */
   static async #openPanelViaTranslationsButton({
     onOpenPanel = null,
     openWithKeyboard = false,
+    win = window,
   }) {
     logAction();
     const { button } =
       await FullPageTranslationsTestUtils.assertTranslationsButton(
         { button: true },
-        "The translations button is visible."
+        "The translations button is visible.",
+        win
       );
     await FullPageTranslationsTestUtils.waitForPanelPopupEvent(
       "popupshown",
@@ -1209,7 +1270,8 @@ class FullPageTranslationsTestUtils {
           click(button, "Opening the popup");
         }
       },
-      onOpenPanel
+      onOpenPanel,
+      win
     );
   }
 
@@ -1242,7 +1304,7 @@ class FullPageTranslationsTestUtils {
    *
    * @param {string} langTag - A BCP-47 language tag.
    */
-  static switchSelectedFromLanguage(langTag) {
+  static changeSelectedFromLanguage(langTag) {
     logAction(langTag);
     const { fromMenuList } = FullPageTranslationsPanel.elements;
     fromMenuList.value = langTag;
@@ -1254,7 +1316,7 @@ class FullPageTranslationsTestUtils {
    *
    * @param {string} langTag - A BCP-47 language tag.
    */
-  static switchSelectedToLanguage(langTag) {
+  static changeSelectedToLanguage(langTag) {
     logAction(langTag);
     const { toMenuList } = FullPageTranslationsPanel.elements;
     toMenuList.value = langTag;
@@ -1270,20 +1332,23 @@ class FullPageTranslationsTestUtils {
    * @param {Function} callback
    * @param {Function} postEventAssertion
    *   An optional assertion to be made immediately after the event occurs.
+   * @param {ChromeWindow} [win]
    * @returns {Promise<void>}
    */
   static async waitForPanelPopupEvent(
     eventName,
     callback,
-    postEventAssertion = null
+    postEventAssertion = null,
+    win = window
   ) {
     // De-lazify the panel elements.
-    FullPageTranslationsPanel.elements;
+    win.FullPageTranslationsPanel.elements;
     await SharedTranslationsTestUtils._waitForPopupEvent(
       "full-page-translations-panel",
       eventName,
       callback,
-      postEventAssertion
+      postEventAssertion,
+      win
     );
   }
 }
@@ -1297,31 +1362,47 @@ class SelectTranslationsTestUtils {
    *
    * @param {Function} runInPage - A content-exposed function to run within the context of the page.
    * @param {object} options - Options for how to open the context menu and what properties to assert about the translate-selection item.
-   * @param {boolean} options.selectFirstParagraph - Selects the first paragraph before opening the context menu.
-   * @param {boolean} options.selectSpanishParagraph - Selects the Spanish paragraph before opening the context menu.
-   *                                                   This is only available in SPANISH_TEST_PAGE.
-   * @param {boolean} options.expectMenuItemIsVisible - Whether the translate-selection item is expected to be visible.
-   *                                                  Does not assert visibility if left undefined.
-   * @param {string} options.expectedTargetLanguage - The target language for translation.
-   * @param {boolean} options.openAtFirstParagraph - Opens the context menu at the first paragraph in the test page.
-   * @param {boolean} options.openAtSpanishParagraph - Opens the context menu at the Spanish paragraph in the test page.
-   *                                                   This is only available in SPANISH_TEST_PAGE.
-   * @param {boolean} options.openAtEnglishHyperlink - Opens the context menu at the English hyperlink in the test page.
-   *                                                   This is only available in SPANISH_TEST_PAGE.
-   * @param {boolean} options.openAtSpanishHyperlink - Opens the context menu at the Spanish hyperlink in the test page.
-   *                                                   This is only available in SPANISH_TEST_PAGE.
+   *
+   * The following options will only work when testing SELECT_TEST_PAGE_URL.
+   *
+   * @param {boolean} options.expectMenuItemVisible - Whether the select-translations menu item should be present in the context menu.
+   * @param {boolean} options.expectedTargetLanguage - The expected target language to be shown in the context menu.
+   * @param {boolean} options.selectFrenchSection - Selects the section of French text.
+   * @param {boolean} options.selectEnglishSection - Selects the section of English text.
+   * @param {boolean} options.selectSpanishSection - Selects the section of Spanish text.
+   * @param {boolean} options.selectFrenchSentence - Selects a French sentence.
+   * @param {boolean} options.selectEnglishSentence - Selects an English sentence.
+   * @param {boolean} options.selectSpanishSentence - Selects a Spanish sentence.
+   * @param {boolean} options.openAtFrenchSection - Opens the context menu at the section of French text.
+   * @param {boolean} options.openAtEnglishSection - Opens the context menu at the section of English text.
+   * @param {boolean} options.openAtSpanishSection - Opens the context menu at the section of Spanish text.
+   * @param {boolean} options.openAtFrenchSentence - Opens the context menu at a French sentence.
+   * @param {boolean} options.openAtEnglishSentence - Opens the context menu at an English sentence.
+   * @param {boolean} options.openAtSpanishSentence - Opens the context menu at a Spanish sentence.
+   * @param {boolean} options.openAtFrenchHyperlink - Opens the context menu at a hyperlinked French text.
+   * @param {boolean} options.openAtEnglishHyperlink - Opens the context menu at an hyperlinked English text.
+   * @param {boolean} options.openAtSpanishHyperlink - Opens the context menu at a hyperlinked Spanish text.
    * @param {string} [message] - A message to log to info.
    * @throws Throws an error if the properties of the translate-selection item do not match the expected options.
    */
   static async assertContextMenuTranslateSelectionItem(
     runInPage,
     {
-      selectFirstParagraph,
-      selectSpanishParagraph,
-      expectMenuItemIsVisible,
+      expectMenuItemVisible,
       expectedTargetLanguage,
-      openAtFirstParagraph,
-      openAtSpanishParagraph,
+      selectFrenchSection,
+      selectEnglishSection,
+      selectSpanishSection,
+      selectFrenchSentence,
+      selectEnglishSentence,
+      selectSpanishSentence,
+      openAtFrenchSection,
+      openAtEnglishSection,
+      openAtSpanishSection,
+      openAtFrenchSentence,
+      openAtEnglishSentence,
+      openAtSpanishSentence,
+      openAtFrenchHyperlink,
       openAtEnglishHyperlink,
       openAtSpanishHyperlink,
     },
@@ -1336,10 +1417,21 @@ class SelectTranslationsTestUtils {
     await closeAllOpenPanelsAndMenus();
 
     await SelectTranslationsTestUtils.openContextMenu(runInPage, {
-      selectFirstParagraph,
-      selectSpanishParagraph,
-      openAtFirstParagraph,
-      openAtSpanishParagraph,
+      expectMenuItemVisible,
+      expectedTargetLanguage,
+      selectFrenchSection,
+      selectEnglishSection,
+      selectSpanishSection,
+      selectFrenchSentence,
+      selectEnglishSentence,
+      selectSpanishSentence,
+      openAtFrenchSection,
+      openAtEnglishSection,
+      openAtSpanishSection,
+      openAtFrenchSentence,
+      openAtEnglishSentence,
+      openAtSpanishSentence,
+      openAtFrenchHyperlink,
       openAtEnglishHyperlink,
       openAtSpanishHyperlink,
     });
@@ -1349,16 +1441,21 @@ class SelectTranslationsTestUtils {
       /* ensureIsVisible */ false
     );
 
-    if (expectMenuItemIsVisible !== undefined) {
-      const visibility = expectMenuItemIsVisible ? "visible" : "hidden";
-      assertVisibility({ [visibility]: menuItem });
+    if (expectMenuItemVisible !== undefined) {
+      const visibility = expectMenuItemVisible ? "visible" : "hidden";
+      assertVisibility({ [visibility]: { menuItem } });
     }
 
-    if (expectMenuItemIsVisible === true) {
+    if (expectMenuItemVisible === true) {
       if (expectedTargetLanguage) {
         // Target language expected, check for the data-l10n-id with a `{$language}` argument.
         const expectedL10nId =
-          selectFirstParagraph === true || selectSpanishParagraph === true
+          selectFrenchSection ||
+          selectEnglishSection ||
+          selectSpanishSection ||
+          selectFrenchSentence ||
+          selectEnglishSentence ||
+          selectSpanishSentence
             ? "main-context-menu-translate-selection-to-language"
             : "main-context-menu-translate-link-text-to-language";
         await waitForCondition(
@@ -1381,7 +1478,12 @@ class SelectTranslationsTestUtils {
       } else {
         // No target language expected, check for the data-l10n-id that has no `{$language}` argument.
         const expectedL10nId =
-          selectFirstParagraph === true || selectSpanishParagraph === true
+          selectFrenchSection ||
+          selectEnglishSection ||
+          selectSpanishSection ||
+          selectFrenchSentence ||
+          selectEnglishSentence ||
+          selectSpanishSentence
             ? "main-context-menu-translate-selection"
             : "main-context-menu-translate-link-text";
         await waitForCondition(
@@ -1399,6 +1501,21 @@ class SelectTranslationsTestUtils {
   }
 
   /**
+   * Elements that should always be visible in the SelectTranslationsPanel.
+   */
+  static #alwaysPresentElements = {
+    betaIcon: true,
+    copyButton: true,
+    doneButton: true,
+    fromLabel: true,
+    fromMenuList: true,
+    header: true,
+    toLabel: true,
+    toMenuList: true,
+    textArea: true,
+  };
+
+  /**
    * Asserts that for each provided expectation, the visible state of the corresponding
    * element in FullPageTranslationsPanel.elements both exists and matches the visibility expectation.
    *
@@ -1409,16 +1526,7 @@ class SelectTranslationsTestUtils {
     SharedTranslationsTestUtils._assertPanelElementVisibility(
       SelectTranslationsPanel.elements,
       {
-        betaIcon: false,
-        copyButton: false,
-        doneButton: false,
-        fromLabel: false,
-        fromMenuList: false,
-        header: false,
-        textArea: false,
-        toLabel: false,
-        toMenuList: false,
-        translateFullPageButton: false,
+        ...SelectTranslationsTestUtils.#alwaysPresentElements,
         // Overwrite any of the above defaults with the passed in expectations.
         ...expectations,
       }
@@ -1426,49 +1534,255 @@ class SelectTranslationsTestUtils {
   }
 
   /**
-   * Asserts that the mainViewId of the panel matches the given string.
-   *
-   * @param {string} expectedId
+   * Asserts that the SelectTranslationsPanel UI matches the expected
+   * state when the panel has completed its translation.
    */
-  static #assertPanelMainViewId(expectedId) {
-    SharedTranslationsTestUtils._assertPanelMainViewId(
-      SelectTranslationsPanel,
-      expectedId
+  static assertPanelViewTranslated() {
+    const { textArea } = SelectTranslationsPanel.elements;
+    ok(
+      !textArea.classList.contains("translating"),
+      "The textarea should not have the translating class."
+    );
+    SelectTranslationsTestUtils.#assertPanelElementVisibility({
+      ...SelectTranslationsTestUtils.#alwaysPresentElements,
+    });
+    SelectTranslationsTestUtils.#assertConditionalUIEnabled({
+      textArea: true,
+      copyButton: true,
+      translateFullPageButton: true,
+    });
+    SelectTranslationsTestUtils.#assertPanelHasTranslatedText();
+    SelectTranslationsTestUtils.#assertPanelTextAreaHeight();
+    SelectTranslationsTestUtils.#assertPanelTextAreaOverflow();
+  }
+
+  static #assertPanelTextAreaDirection(langTag = null) {
+    const expectedTextDirection = langTag
+      ? Services.intl.getScriptDirection(langTag)
+      : null;
+    const { textArea } = SelectTranslationsPanel.elements;
+    const actualTextDirection = textArea.getAttribute("dir");
+
+    is(
+      actualTextDirection,
+      expectedTextDirection,
+      `The text direction should be ${expectedTextDirection}`
     );
   }
 
   /**
-   * Asserts that panel element visibility matches the default panel view.
+   * Asserts that the SelectTranslationsPanel translated text area is
+   * both scrollable and scrolled to the top.
    */
-  static assertPanelViewDefault() {
-    info("Checking that the select-translations panel shows the default view");
-    SelectTranslationsTestUtils.#assertPanelMainViewId(
-      "select-translations-panel-view-default"
+  static #assertPanelTextAreaOverflow() {
+    const { textArea } = SelectTranslationsPanel.elements;
+    is(
+      textArea.style.overflow,
+      "auto",
+      "The translated-text area should be scrollable."
+    );
+    if (textArea.scrollHeight > textArea.clientHeight) {
+      is(
+        textArea.scrollTop,
+        0,
+        "The translated-text area should be scrolled to the top."
+      );
+    }
+  }
+
+  /**
+   * Asserts that the SelectTranslationsPanel translated text area is
+   * the correct height for the length of the translated text.
+   */
+  static #assertPanelTextAreaHeight() {
+    const { textArea } = SelectTranslationsPanel.elements;
+
+    if (
+      SelectTranslationsPanel.getSourceText().length <
+      SelectTranslationsPanel.textLengthThreshold
+    ) {
+      is(
+        textArea.style.height,
+        SelectTranslationsPanel.shortTextHeight,
+        "The panel text area should have the short-text height"
+      );
+    } else {
+      is(
+        textArea.style.height,
+        SelectTranslationsPanel.longTextHeight,
+        "The panel text area should have the long-text height"
+      );
+    }
+  }
+
+  /**
+   * Asserts that the SelectTranslationsPanel UI matches the expected
+   * state when the panel is actively translating text.
+   */
+  static assertPanelViewActivelyTranslating() {
+    const { textArea } = SelectTranslationsPanel.elements;
+    ok(
+      textArea.classList.contains("translating"),
+      "The textarea should have the translating class."
     );
     SelectTranslationsTestUtils.#assertPanelElementVisibility({
-      betaIcon: true,
-      fromLabel: true,
-      fromMenuList: true,
-      header: true,
+      ...SelectTranslationsTestUtils.#alwaysPresentElements,
+    });
+    SelectTranslationsTestUtils.#assertPanelHasTranslatingPlaceholder();
+  }
+
+  /**
+   * Asserts that the SelectTranslationsPanel UI matches the expected
+   * state when no from-language is selected in the panel.
+   */
+  static async assertPanelViewNoFromLangSelected() {
+    const { textArea } = SelectTranslationsPanel.elements;
+    ok(
+      !textArea.classList.contains("translating"),
+      "The textarea should not have the translating class."
+    );
+    SelectTranslationsTestUtils.#assertPanelElementVisibility({
+      ...SelectTranslationsTestUtils.#alwaysPresentElements,
+    });
+    await SelectTranslationsTestUtils.#assertPanelHasIdlePlaceholder();
+    SelectTranslationsTestUtils.#assertConditionalUIEnabled({
+      textArea: false,
+      copyButton: false,
+      translateFullPageButton: false,
+    });
+    SelectTranslationsTestUtils.assertSelectedFromLanguage(null);
+  }
+
+  /**
+   * Asserts that the SelectTranslationsPanel UI matches the expected
+   * state when no to-language is selected in the panel.
+   */
+  static async assertPanelViewNoToLangSelected() {
+    const { textArea } = SelectTranslationsPanel.elements;
+    ok(
+      !textArea.classList.contains("translating"),
+      "The textarea should not have the translating class."
+    );
+    SelectTranslationsTestUtils.#assertPanelElementVisibility({
+      ...SelectTranslationsTestUtils.#alwaysPresentElements,
+    });
+    SelectTranslationsTestUtils.assertSelectedToLanguage(null);
+    SelectTranslationsTestUtils.#assertConditionalUIEnabled({
+      textArea: false,
+      copyButton: false,
+      translateFullPageButton: false,
+    });
+    await SelectTranslationsTestUtils.#assertPanelHasIdlePlaceholder();
+  }
+
+  /**
+   * Asserts that the SelectTranslationsPanel UI contains the
+   * idle placeholder text.
+   */
+  static async #assertPanelHasIdlePlaceholder() {
+    const { textArea } = SelectTranslationsPanel.elements;
+    const expected = await document.l10n.formatValue(
+      "select-translations-panel-idle-placeholder-text"
+    );
+    is(
+      textArea.value,
+      expected,
+      "Translated text area should be the idle placeholder."
+    );
+    SelectTranslationsTestUtils.#assertPanelTextAreaDirection();
+  }
+
+  /**
+   * Asserts that the SelectTranslationsPanel UI contains the
+   * translating placeholder text.
+   */
+  static async #assertPanelHasTranslatingPlaceholder() {
+    const { textArea } = SelectTranslationsPanel.elements;
+    const expected = await document.l10n.formatValue(
+      "select-translations-panel-translating-placeholder-text"
+    );
+    is(
+      textArea.value,
+      expected,
+      "Active translation text area should have the translating placeholder."
+    );
+    SelectTranslationsTestUtils.#assertPanelTextAreaDirection();
+    SelectTranslationsTestUtils.#assertConditionalUIEnabled({
+      textArea: true,
+      copyButton: false,
+      translateFullPageButton: true,
+    });
+  }
+
+  /**
+   * Asserts that the SelectTranslationsPanel UI contains the
+   * translated text.
+   */
+  static #assertPanelHasTranslatedText() {
+    const { textArea, fromMenuList, toMenuList } =
+      SelectTranslationsPanel.elements;
+    const fromLanguage = fromMenuList.value;
+    const toLanguage = toMenuList.value;
+    const translatedSuffix = ` [${fromLanguage} to ${toLanguage}]`;
+    ok(
+      textArea.value.endsWith(translatedSuffix),
+      `Translated text should match ${fromLanguage} to ${toLanguage}`
+    );
+    is(
+      SelectTranslationsPanel.getSourceText().length,
+      SelectTranslationsPanel.getTranslatedText().length -
+        translatedSuffix.length,
+      "Expected translated text length to correspond to the source text length."
+    );
+    SelectTranslationsTestUtils.#assertPanelTextAreaDirection(toLanguage);
+    SelectTranslationsTestUtils.#assertConditionalUIEnabled({
       textArea: true,
-      toLabel: true,
-      toMenuList: true,
       copyButton: true,
-      doneButton: true,
       translateFullPageButton: true,
     });
   }
 
   /**
+   * Asserts the enabled state of action buttons in the SelectTranslationsPanel.
+   *
+   * @param {boolean} expectEnabled - Whether the buttons should be enabled (true) or not (false).
+   */
+  static #assertConditionalUIEnabled({
+    copyButton: copyButtonEnabled,
+    translateFullPageButton: translateFullPageButtonEnabled,
+    textArea: textAreaEnabled,
+  }) {
+    const { copyButton, translateFullPageButton, textArea } =
+      SelectTranslationsPanel.elements;
+    is(
+      copyButton.disabled,
+      !copyButtonEnabled,
+      `The copy button should be ${copyButtonEnabled ? "enabled" : "disabled"}.`
+    );
+    is(
+      translateFullPageButton.disabled,
+      !translateFullPageButtonEnabled,
+      `The translate-full-page button should be ${
+        translateFullPageButtonEnabled ? "enabled" : "disabled"
+      }.`
+    );
+    is(
+      textArea.disabled,
+      !textAreaEnabled,
+      `The translated-text area should be ${
+        textAreaEnabled ? "enabled" : "disabled"
+      }.`
+    );
+  }
+
+  /**
    * Asserts that the selected from-language matches the provided language tag.
    *
    * @param {string} langTag - A BCP-47 language tag.
    */
-  static assertSelectedFromLanguage({ langTag, l10nId }) {
-    SharedTranslationsTestUtils._assertSelectedFromLanguage(
-      SelectTranslationsPanel,
-      { langTag, l10nId }
-    );
+  static assertSelectedFromLanguage(langTag = null) {
+    const { fromMenuList } = SelectTranslationsPanel.elements;
+    SelectTranslationsTestUtils.#assertSelectedLanguage(fromMenuList, langTag);
   }
 
   /**
@@ -1476,11 +1790,29 @@ class SelectTranslationsTestUtils {
    *
    * @param {string} langTag - A BCP-47 language tag.
    */
-  static assertSelectedToLanguage({ langTag, l10nId }) {
-    SharedTranslationsTestUtils._assertSelectedToLanguage(
-      SelectTranslationsPanel,
-      { langTag, l10nId }
-    );
+  static assertSelectedToLanguage(langTag = null) {
+    const { toMenuList } = SelectTranslationsPanel.elements;
+    SelectTranslationsTestUtils.#assertSelectedLanguage(toMenuList, langTag);
+  }
+
+  /**
+   * Asserts the selected language in the given  menu list if a langTag is provided.
+   * If no langTag is given, asserts that the menulist displays the localized placeholder.
+   *
+   * @param {object} menuList - The menu list object to check.
+   * @param {string} [langTag] - The optional language tag to assert against.
+   */
+  static #assertSelectedLanguage(menuList, langTag) {
+    if (langTag) {
+      SharedTranslationsTestUtils._assertSelectedLanguage(menuList, {
+        langTag,
+      });
+    } else {
+      SharedTranslationsTestUtils._assertSelectedLanguage(menuList, {
+        l10nId: "translations-panel-choose-language",
+      });
+      SharedTranslationsTestUtils._assertHasFocus(menuList);
+    }
   }
 
   /**
@@ -1503,110 +1835,258 @@ class SelectTranslationsTestUtils {
    *
    * @param {Function} runInPage - A content-exposed function to run within the context of the page.
    * @param {object} options - Options for opening the context menu.
-   * @param {boolean} options.selectFirstParagraph - Selects the first paragraph before opening the context menu.
-   * @param {boolean} options.selectSpanishParagraph - Selects the Spanish paragraph before opening the context menu.
-   *                                                   This is only available in SPANISH_TEST_PAGE.
-   * @param {boolean} options.openAtFirstParagraph - Opens the context menu at the first paragraph in the test page.
-   * @param {boolean} options.openAtSpanishParagraph - Opens the context menu at the Spanish paragraph in the test page.
-   *                                                   This is only available in SPANISH_TEST_PAGE.
-   * @param {boolean} options.openAtEnglishHyperlink - Opens the context menu at the English hyperlink in the test page.
-   *                                                   This is only available in SPANISH_TEST_PAGE.
-   * @param {boolean} options.openAtSpanishHyperlink - Opens the context menu at the Spanish hyperlink in the test page.
-   *                                                   This is only available in SPANISH_TEST_PAGE.
+   *
+   * The following options will only work when testing SELECT_TEST_PAGE_URL.
+   *
+   * @param {boolean} options.selectFrenchSection - Selects the section of French text.
+   * @param {boolean} options.selectEnglishSection - Selects the section of English text.
+   * @param {boolean} options.selectSpanishSection - Selects the section of Spanish text.
+   * @param {boolean} options.selectFrenchSentence - Selects a French sentence.
+   * @param {boolean} options.selectEnglishSentence - Selects an English sentence.
+   * @param {boolean} options.selectSpanishSentence - Selects a Spanish sentence.
+   * @param {boolean} options.openAtFrenchSection - Opens the context menu at the section of French text.
+   * @param {boolean} options.openAtEnglishSection - Opens the context menu at the section of English text.
+   * @param {boolean} options.openAtSpanishSection - Opens the context menu at the section of Spanish text.
+   * @param {boolean} options.openAtFrenchSentence - Opens the context menu at a French sentence.
+   * @param {boolean} options.openAtEnglishSentence - Opens the context menu at an English sentence.
+   * @param {boolean} options.openAtSpanishSentence - Opens the context menu at a Spanish sentence.
+   * @param {boolean} options.openAtFrenchHyperlink - Opens the context menu at a hyperlinked French text.
+   * @param {boolean} options.openAtEnglishHyperlink - Opens the context menu at an hyperlinked English text.
+   * @param {boolean} options.openAtSpanishHyperlink - Opens the context menu at a hyperlinked Spanish text.
    * @throws Throws an error if no valid option was provided for opening the menu.
    */
-  static async openContextMenu(
-    runInPage,
-    {
-      selectFirstParagraph,
-      selectSpanishParagraph,
-      openAtFirstParagraph,
-      openAtSpanishParagraph,
-      openAtEnglishHyperlink,
-      openAtSpanishHyperlink,
-    }
-  ) {
+  static async openContextMenu(runInPage, options) {
     logAction();
 
-    if (selectFirstParagraph === true) {
-      await runInPage(async TranslationsTest => {
-        const { getFirstParagraph } = TranslationsTest.getSelectors();
-        const paragraph = getFirstParagraph();
-        TranslationsTest.selectContentElement(paragraph);
-      });
-    }
+    const maybeSelectContentFrom = async keyword => {
+      const conditionVariableName = `select${keyword}`;
+      const selectorFunctionName = `get${keyword}`;
+
+      if (options[conditionVariableName]) {
+        await runInPage(
+          async (TranslationsTest, data) => {
+            const selectorFunction =
+              TranslationsTest.getSelectors()[data.selectorFunctionName];
+            if (typeof selectorFunction === "function") {
+              const paragraph = selectorFunction();
+              TranslationsTest.selectContentElement(paragraph);
+            }
+          },
+          { selectorFunctionName }
+        );
+      }
+    };
 
-    if (selectSpanishParagraph === true) {
-      await runInPage(async TranslationsTest => {
-        const { getSpanishParagraph } = TranslationsTest.getSelectors();
-        const paragraph = getSpanishParagraph();
-        TranslationsTest.selectContentElement(paragraph);
-      });
+    await maybeSelectContentFrom("FrenchSection");
+    await maybeSelectContentFrom("EnglishSection");
+    await maybeSelectContentFrom("SpanishSection");
+    await maybeSelectContentFrom("FrenchSentence");
+    await maybeSelectContentFrom("EnglishSentence");
+    await maybeSelectContentFrom("SpanishSentence");
+
+    const maybeOpenContextMenuAt = async keyword => {
+      const optionVariableName = `openAt${keyword}`;
+      const selectorFunctionName = `get${keyword}`;
+
+      if (options[optionVariableName]) {
+        await SharedTranslationsTestUtils._waitForPopupEvent(
+          "contentAreaContextMenu",
+          "popupshown",
+          async () => {
+            await runInPage(
+              async (TranslationsTest, data) => {
+                const selectorFunction =
+                  TranslationsTest.getSelectors()[data.selectorFunctionName];
+                if (typeof selectorFunction === "function") {
+                  const element = selectorFunction();
+                  await TranslationsTest.rightClickContentElement(element);
+                }
+              },
+              { selectorFunctionName }
+            );
+          }
+        );
+      }
+    };
+
+    await maybeOpenContextMenuAt("FrenchSection");
+    await maybeOpenContextMenuAt("EnglishSection");
+    await maybeOpenContextMenuAt("SpanishSection");
+    await maybeOpenContextMenuAt("FrenchSentence");
+    await maybeOpenContextMenuAt("EnglishSentence");
+    await maybeOpenContextMenuAt("SpanishSentence");
+    await maybeOpenContextMenuAt("FrenchHyperlink");
+    await maybeOpenContextMenuAt("EnglishHyperlink");
+    await maybeOpenContextMenuAt("SpanishHyperlink");
+  }
+
+  /**
+   * Handles language-model downloads for the SelectTranslationsPanel, ensuring that expected
+   * UI states match based on the resolved download state.
+   *
+   * @param {object} options - Configuration options for downloads.
+   * @param {function(number): Promise<void>} options.downloadHandler - The function to resolve or reject the downloads.
+   * @param {boolean} [options.pivotTranslation] - Whether to expect a pivot translation.
+   *
+   * @returns {Promise<void>}
+   */
+  static async handleDownloads({ downloadHandler, pivotTranslation }) {
+    const { textArea } = SelectTranslationsPanel.elements;
+
+    if (downloadHandler) {
+      if (textArea.style.overflow !== "hidden") {
+        await BrowserTestUtils.waitForMutationCondition(
+          textArea,
+          { attributes: true, attributeFilter: ["style"] },
+          () => textArea.style.overflow === "hidden"
+        );
+      }
+
+      await SelectTranslationsTestUtils.assertPanelViewActivelyTranslating();
+      await downloadHandler(pivotTranslation ? 2 : 1);
     }
 
-    if (openAtFirstParagraph === true) {
-      await SharedTranslationsTestUtils._waitForPopupEvent(
-        "contentAreaContextMenu",
-        "popupshown",
-        async () => {
-          await runInPage(async TranslationsTest => {
-            const { getFirstParagraph } = TranslationsTest.getSelectors();
-            const paragraph = getFirstParagraph();
-            await TranslationsTest.rightClickContentElement(paragraph);
-          });
-        }
+    if (textArea.style.overflow === "hidden") {
+      await BrowserTestUtils.waitForMutationCondition(
+        textArea,
+        { attributes: true, attributeFilter: ["style"] },
+        () => textArea.style.overflow === "auto"
       );
-      return;
     }
+  }
 
-    if (openAtSpanishParagraph === true) {
-      await SharedTranslationsTestUtils._waitForPopupEvent(
-        "contentAreaContextMenu",
-        "popupshown",
-        async () => {
-          await runInPage(async TranslationsTest => {
-            const { getSpanishParagraph } = TranslationsTest.getSelectors();
-            const paragraph = getSpanishParagraph();
-            await TranslationsTest.rightClickContentElement(paragraph);
-          });
-        }
+  /**
+   * Switches the selected from-language to the provided language tags
+   *
+   * @param {string[]} langTags - An array of BCP-47 language tags.
+   * @param {object} options - Configuration options for the language change.
+   * @param {boolean} options.openDropdownMenu - Determines whether the language change should be made via a dropdown menu or directly.
+   *
+   * @returns {Promise<void>}
+   */
+  static async changeSelectedFromLanguage(langTags, options) {
+    const { fromMenuList, fromMenuPopup } = SelectTranslationsPanel.elements;
+    const { openDropdownMenu } = options;
+
+    const switchFn = openDropdownMenu
+      ? SelectTranslationsTestUtils.#changeSelectedLanguageViaDropdownMenu
+      : SelectTranslationsTestUtils.#changeSelectedLanguageDirectly;
+
+    await switchFn(
+      langTags,
+      { menuList: fromMenuList, menuPopup: fromMenuPopup },
+      options
+    );
+  }
+
+  /**
+   * Switches the selected to-language to the provided language tag.
+   *
+   * @param {string[]} langTags - An array of BCP-47 language tags.
+   * @param {object} options - Options for selecting paragraphs and opening the context menu.
+   * @param {boolean} options.openDropdownMenu - Determines whether the language change should be made via a dropdown menu or directly.
+   * @param {Function} options.downloadHandler - Handler for initiating downloads post language change, if applicable.
+   * @param {Function} options.onChangeLanguage - Callback function to be executed after the language change.
+   *
+   * @returns {Promise<void>}
+   */
+  static async changeSelectedToLanguage(langTags, options) {
+    const { toMenuList, toMenuPopup } = SelectTranslationsPanel.elements;
+    const { openDropdownMenu } = options;
+
+    const switchFn = openDropdownMenu
+      ? SelectTranslationsTestUtils.#changeSelectedLanguageViaDropdownMenu
+      : SelectTranslationsTestUtils.#changeSelectedLanguageDirectly;
+
+    await switchFn(
+      langTags,
+      { menuList: toMenuList, menuPopup: toMenuPopup },
+      options
+    );
+  }
+
+  /**
+   * Directly changes the selected language to each provided language tag without using a dropdown menu.
+   *
+   * @param {string[]} langTags - An array of BCP-47 language tags for direct selection.
+   * @param {object} elements - Elements required for changing the selected language.
+   * @param {Element} elements.menuList - The menu list element where languages are directly changed.
+   * @param {object} options - Configuration options for language change and additional actions.
+   * @param {Function} options.downloadHandler - Handler for initiating downloads post language change, if applicable.
+   * @param {Function} options.onChangeLanguage - Callback function to be executed after the language change.
+   *
+   * @returns {Promise<void>}
+   */
+  static async #changeSelectedLanguageDirectly(langTags, elements, options) {
+    const { menuList } = elements;
+    const { onChangeLanguage, downloadHandler } = options;
+
+    for (const langTag of langTags) {
+      const menuListUpdated = BrowserTestUtils.waitForMutationCondition(
+        menuList,
+        { attributes: true, attributeFilter: ["value"] },
+        () => menuList.value === langTag
       );
-      return;
+
+      menuList.value = langTag;
+      menuList.dispatchEvent(new Event("command"));
+      await menuListUpdated;
     }
 
-    if (openAtEnglishHyperlink === true) {
-      await SharedTranslationsTestUtils._waitForPopupEvent(
-        "contentAreaContextMenu",
-        "popupshown",
-        async () => {
-          await runInPage(async TranslationsTest => {
-            const { getEnglishHyperlink } = TranslationsTest.getSelectors();
-            const hyperlink = getEnglishHyperlink();
-            await TranslationsTest.rightClickContentElement(hyperlink);
-          });
-        }
-      );
-      return;
+    if (downloadHandler) {
+      menuList.focus();
+      EventUtils.synthesizeKey("KEY_Enter");
+      await SelectTranslationsTestUtils.handleDownloads(options);
     }
 
-    if (openAtSpanishHyperlink === true) {
-      await SharedTranslationsTestUtils._waitForPopupEvent(
-        "contentAreaContextMenu",
+    if (onChangeLanguage) {
+      await onChangeLanguage();
+    }
+  }
+
+  /**
+   * Changes the selected language by opening the dropdown menu for each provided language tag.
+   *
+   * @param {string[]} langTags - An array of BCP-47 language tags for selection via dropdown.
+   * @param {object} elements - Elements involved in the dropdown language selection process.
+   * @param {Element} elements.menuList - The element that triggers the dropdown menu.
+   * @param {Element} elements.menuPopup - The dropdown menu element containing selectable languages.
+   * @param {object} options - Configuration options for language change and additional actions.
+   * @param {Function} options.downloadHandler - Handler for initiating downloads post language change, if applicable.
+   * @param {Function} options.onChangeLanguage - Callback function to be executed after the language change.
+   *
+   * @returns {Promise<void>}
+   */
+  static async #changeSelectedLanguageViaDropdownMenu(
+    langTags,
+    elements,
+    options
+  ) {
+    const { menuList, menuPopup } = elements;
+    const { onChangeLanguage } = options;
+    for (const langTag of langTags) {
+      await SelectTranslationsTestUtils.waitForPanelPopupEvent(
         "popupshown",
-        async () => {
-          await runInPage(async TranslationsTest => {
-            const { getSpanishHyperlink } = TranslationsTest.getSelectors();
-            const hyperlink = getSpanishHyperlink();
-            await TranslationsTest.rightClickContentElement(hyperlink);
-          });
+        () => click(menuList)
+      );
+
+      const menuItem = menuPopup.querySelector(`[value="${langTag}"]`);
+      await SelectTranslationsTestUtils.waitForPanelPopupEvent(
+        "popuphidden",
+        () => {
+          click(menuItem);
+          // Synthesizing a click on the menuitem isn't closing the popup
+          // as a click normally would, so this tab keypress is added to
+          // ensure the popup closes.
+          EventUtils.synthesizeKey("KEY_Tab");
         }
       );
-      return;
-    }
 
-    throw new Error(
-      "openContextMenu() was not provided a declaration for which element to open the menu at."
-    );
+      await SelectTranslationsTestUtils.handleDownloads(options);
+      if (onChangeLanguage) {
+        await onChangeLanguage();
+      }
+    }
   }
 
   /**
@@ -1614,36 +2094,32 @@ class SelectTranslationsTestUtils {
    *
    * @param {Function} runInPage - A content-exposed function to run within the context of the page.
    * @param {object} options - Options for selecting paragraphs and opening the context menu.
-   * @param {boolean} options.selectFirstParagraph - Selects the first paragraph before opening the context menu.
-   * @param {boolean} options.selectSpanishParagraph - Selects the Spanish paragraph before opening the context menu.
-   *                                                   This is only available in SPANISH_TEST_PAGE.
-   * @param {string} options.expectedTargetLanguage - The target language for translation.
-   * @param {boolean} options.openAtFirstParagraph - Opens the context menu at the first paragraph.
-   * @param {boolean} options.openAtSpanishParagraph - Opens at the Spanish paragraph.
-   *                                                   This is only available in SPANISH_TEST_PAGE.
-   * @param {boolean} options.openAtEnglishHyperlink - Opens at the English hyperlink.
-   *                                                   This is only available in SPANISH_TEST_PAGE.
-   * @param {boolean} options.openAtSpanishHyperlink - Opens at the Spanish hyperlink.
-   *                                                   This is only available in SPANISH_TEST_PAGE.
-   * @param {Function|null} [options.onOpenPanel=null] - An optional callback function to execute after the panel opens.
-   * @param {string|null} [message=null] - An optional message to log to info.
+   *
+   * The following options will only work when testing SELECT_TEST_PAGE_URL.
+   *
+   * @param {string}  options.expectedFromLanguage - The expected from-language tag.
+   * @param {string}  options.expectedToLanguage - The expected to-language tag.
+   * @param {boolean} options.selectFrenchSection - Selects the section of French text.
+   * @param {boolean} options.selectEnglishSection - Selects the section of English text.
+   * @param {boolean} options.selectSpanishSection - Selects the section of Spanish text.
+   * @param {boolean} options.selectFrenchSentence - Selects a French sentence.
+   * @param {boolean} options.selectEnglishSentence - Selects an English sentence.
+   * @param {boolean} options.selectSpanishSentence - Selects a Spanish sentence.
+   * @param {boolean} options.openAtFrenchSection - Opens the context menu at the section of French text.
+   * @param {boolean} options.openAtEnglishSection - Opens the context menu at the section of English text.
+   * @param {boolean} options.openAtSpanishSection - Opens the context menu at the section of Spanish text.
+   * @param {boolean} options.openAtFrenchSentence - Opens the context menu at a French sentence.
+   * @param {boolean} options.openAtEnglishSentence - Opens the context menu at an English sentence.
+   * @param {boolean} options.openAtSpanishSentence - Opens the context menu at a Spanish sentence.
+   * @param {boolean} options.openAtFrenchHyperlink - Opens the context menu at a hyperlinked French text.
+   * @param {boolean} options.openAtEnglishHyperlink - Opens the context menu at an hyperlinked English text.
+   * @param {boolean} options.openAtSpanishHyperlink - Opens the context menu at a hyperlinked Spanish text.
+   * @param {Function} [options.onOpenPanel] - An optional callback function to execute after the panel opens.
+   * @param {string|null} [message] - An optional message to log to info.
    * @throws Throws an error if the context menu could not be opened with the provided options.
    * @returns {Promise<void>}
    */
-  static async openPanel(
-    runInPage,
-    {
-      selectFirstParagraph,
-      selectSpanishParagraph,
-      expectedTargetLanguage,
-      openAtFirstParagraph,
-      openAtSpanishParagraph,
-      openAtEnglishHyperlink,
-      openAtSpanishHyperlink,
-      onOpenPanel,
-    },
-    message
-  ) {
+  static async openPanel(runInPage, options, message) {
     logAction();
 
     if (message) {
@@ -1652,15 +2128,7 @@ class SelectTranslationsTestUtils {
 
     await SelectTranslationsTestUtils.assertContextMenuTranslateSelectionItem(
       runInPage,
-      {
-        selectFirstParagraph,
-        selectSpanishParagraph,
-        expectedTargetLanguage,
-        openAtFirstParagraph,
-        openAtSpanishParagraph,
-        openAtEnglishHyperlink,
-        openAtSpanishHyperlink,
-      },
+      options,
       message
     );
 
@@ -1668,9 +2136,28 @@ class SelectTranslationsTestUtils {
 
     await SelectTranslationsTestUtils.waitForPanelPopupEvent(
       "popupshown",
-      () => click(menuItem),
-      onOpenPanel
+      async () => {
+        click(menuItem);
+        await closeContextMenuIfOpen();
+      },
+      async () => {
+        const { onOpenPanel } = options;
+        await SelectTranslationsTestUtils.handleDownloads(options);
+        if (onOpenPanel) {
+          await onOpenPanel();
+        }
+      }
     );
+
+    const { expectedFromLanguage, expectedToLanguage } = options;
+    if (expectedFromLanguage !== undefined) {
+      SelectTranslationsTestUtils.assertSelectedFromLanguage(
+        expectedFromLanguage
+      );
+    }
+    if (expectedToLanguage !== undefined) {
+      SelectTranslationsTestUtils.assertSelectedToLanguage(expectedToLanguage);
+    }
   }
 
   /**
@@ -1732,10 +2219,10 @@ class TranslationsSettingsTestUtils {
       translateNeverHeader: document.getElementById(
         "translations-settings-never-translate"
       ),
-      translateAlwaysAddButton: document.getElementById(
+      translateAlwaysMenuList: document.getElementById(
         "translations-settings-always-translate-list"
       ),
-      translateNeverAddButton: document.getElementById(
+      translateNeverMenuList: document.getElementById(
         "translations-settings-never-translate-list"
       ),
       translateNeverSiteHeader: document.getElementById(
@@ -1744,12 +2231,15 @@ class TranslationsSettingsTestUtils {
       translateNeverSiteDesc: document.getElementById(
         "translations-settings-never-sites"
       ),
-      translateDownloadLanguagesHeader: document.getElementById(
-        "translations-settings-download-languages"
-      ),
+      translateDownloadLanguagesHeader: document
+        .getElementById("translations-settings-download-section")
+        .querySelector("h2"),
       translateDownloadLanguagesLearnMore: document.getElementById(
         "download-languages-learn-more"
       ),
+      translateDownloadLanguagesList: document.getElementById(
+        "translations-settings-download-section"
+      ),
     };
 
     return elements;