summaryrefslogtreecommitdiffstats
path: root/toolkit/components/translations/tests/browser/browser_about_translations_enabling.js
blob: cde5fd03b4f0d45ac79194bab6468a9298771103 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
/* Any copyright is dedicated to the Public Domain.
   http://creativecommons.org/publicdomain/zero/1.0/ */

"use strict";

/**
 * Checks that the page renders without issue, and that the expected elements
 * are there.
 */
add_task(async function test_about_translations_enabled() {
  await openAboutTranslations({
    runInPage: async ({ selectors }) => {
      const { document, window } = content;

      await ContentTaskUtils.waitForCondition(
        () => {
          const trElement = document.querySelector(selectors.translationResult);
          const trBlankElement = document.querySelector(
            selectors.translationResultBlank
          );
          const { visibility: trVisibility } =
            window.getComputedStyle(trElement);
          const { visibility: trBlankVisibility } =
            window.getComputedStyle(trBlankElement);
          return trVisibility === "hidden" && trBlankVisibility === "visible";
        },
        `Waiting for placeholder text to be visible."`,
        100,
        200
      );

      function checkElementIsVisible(expectVisible, name) {
        const expected = expectVisible ? "visible" : "hidden";
        const element = document.querySelector(selectors[name]);
        ok(Boolean(element), `Element ${name} was found.`);
        const { visibility } = window.getComputedStyle(element);
        is(
          visibility,
          expected,
          `Element ${name} was not ${expected} but should be.`
        );
      }

      checkElementIsVisible(true, "pageHeader");
      checkElementIsVisible(true, "fromLanguageSelect");
      checkElementIsVisible(true, "toLanguageSelect");
      checkElementIsVisible(true, "translationTextarea");
      checkElementIsVisible(true, "translationResultBlank");

      checkElementIsVisible(false, "translationResult");
    },
  });
});

/**
 * Checks that the page does not show the content when disabled.
 */
add_task(async function test_about_translations_disabled() {
  await openAboutTranslations({
    disabled: true,
    runInPage: async ({ selectors }) => {
      const { document, window } = content;

      await ContentTaskUtils.waitForCondition(
        () => {
          const element = document.querySelector(selectors.translationResult);
          const { visibility } = window.getComputedStyle(element);
          return visibility === "hidden";
        },
        `Waiting for translated text to be hidden."`,
        100,
        200
      );

      function checkElementIsInvisible(name) {
        const element = document.querySelector(selectors[name]);
        ok(Boolean(element), `Element ${name} was found.`);
        const { visibility } = window.getComputedStyle(element);
        is(visibility, "hidden", `Element ${name} was invisible.`);
      }

      checkElementIsInvisible("pageHeader");
      checkElementIsInvisible("fromLanguageSelect");
      checkElementIsInvisible("toLanguageSelect");
      checkElementIsInvisible("translationTextarea");
      checkElementIsInvisible("translationResult");
      checkElementIsInvisible("translationResultBlank");
    },
  });
});

/**
 * Test that the page is properly disabled when the engine isn't supported.
 */
add_task(async function test_about_translations_disabling() {
  await openAboutTranslations({
    prefs: [["browser.translations.simulateUnsupportedEngine", true]],
    runInPage: async ({ selectors }) => {
      const { document, window } = content;

      info('Checking for the "no support" message.');
      await ContentTaskUtils.waitForCondition(
        () => document.querySelector(selectors.noSupportMessage),
        'Waiting for the "no support" message.',
        100,
        200
      );

      /** @type {HTMLSelectElement} */
      const fromSelect = document.querySelector(selectors.fromLanguageSelect);
      /** @type {HTMLSelectElement} */
      const toSelect = document.querySelector(selectors.toLanguageSelect);
      /** @type {HTMLTextAreaElement} */
      const translationTextarea = document.querySelector(
        selectors.translationTextarea
      );

      ok(fromSelect.disabled, "The from select is disabled");
      ok(toSelect.disabled, "The to select is disabled");
      ok(translationTextarea.disabled, "The textarea is disabled");

      function checkElementIsVisible(expectVisible, name) {
        const expected = expectVisible ? "visible" : "hidden";
        const element = document.querySelector(selectors[name]);
        ok(Boolean(element), `Element ${name} was found.`);
        const { visibility } = window.getComputedStyle(element);
        is(
          visibility,
          expected,
          `Element ${name} was not ${expected} but should be.`
        );
      }

      checkElementIsVisible(true, "translationInfo");
    },
  });
});