DEV: add more tests for future-date-input-selector (#13836)

This PR contains only tests. These tests are from my old PR with refactoring of future-date-input-selector. That PR was closed because we had some changes in our planes about our time-pickers and additionally these tests were flaky.

Tests in this PR aren't flaky, since they use fake time moments in the future. Tests just document current behaviour of future-date-input-selector.

app/assets/javascripts/discourse/tests/acceptance/admin-silence-user-test.js

@@ -0,0 +1,58 @@
+import {
+  acceptance,
+  fakeTime,
+  query,
+  queryAll,
+} from "discourse/tests/helpers/qunit-helpers";
+import { click, visit } from "@ember/test-helpers";
+import { test } from "qunit";
+import I18n from "I18n";
+
+acceptance("Admin - Silence User", function (needs) {
+  let clock = null;
+  needs.user();
+
+  needs.hooks.beforeEach(() => {
+    const timezone = moment.tz.guess();
+    clock = fakeTime("2100-05-03T08:00:00", timezone, true); // Monday morning
+  });
+
+  needs.hooks.afterEach(() => {
+    clock.restore();
+  });
+
+  test("shows correct timeframe options", async function (assert) {
+    await visit("/admin/users/1234/regular");
+    await click(".silence-user");
+    await click(".future-date-input-selector-header");
+
+    assert.equal(
+      query(".future-date-input-selector-header").getAttribute("aria-expanded"),
+      "true",
+      "selector is expanded"
+    );
+
+    const options = Array.from(
+      queryAll(`ul.select-kit-collection li span.name`).map((_, x) =>
+        x.innerText.trim()
+      )
+    );
+
+    const expected = [
+      I18n.t("topic.auto_update_input.later_today"),
+      I18n.t("topic.auto_update_input.tomorrow"),
+      I18n.t("topic.auto_update_input.next_week"),
+      I18n.t("topic.auto_update_input.two_weeks"),
+      I18n.t("topic.auto_update_input.next_month"),
+      I18n.t("topic.auto_update_input.two_months"),
+      I18n.t("topic.auto_update_input.three_months"),
+      I18n.t("topic.auto_update_input.four_months"),
+      I18n.t("topic.auto_update_input.six_months"),
+      I18n.t("topic.auto_update_input.one_year"),
+      I18n.t("topic.auto_update_input.forever"),
+      I18n.t("topic.auto_update_input.pick_date_and_time"),
+    ];
+
+    assert.deepEqual(options, expected, "options are correct");
+  });
+});

app/assets/javascripts/discourse/tests/acceptance/admin-suspend-user-test.js

@@ -2,11 +2,14 @@ import {
   acceptance,
   count,
   exists,
+  fakeTime,
   query,
+  queryAll,
 } from "discourse/tests/helpers/qunit-helpers";
 import { click, fillIn, visit } from "@ember/test-helpers";
 import selectKit from "discourse/tests/helpers/select-kit-helper";
 import { test } from "qunit";
+import I18n from "I18n";
 
 acceptance("Admin - Suspend User", function (needs) {
   needs.user();
@@ -98,3 +101,52 @@ acceptance("Admin - Suspend User", function (needs) {
     assert.ok(!exists(".suspension-info"));
   });
 });
+
+acceptance("Admin - Suspend User - timeframe choosing", function (needs) {
+  let clock = null;
+  needs.user();
+
+  needs.hooks.beforeEach(() => {
+    const timezone = moment.tz.guess();
+    clock = fakeTime("2100-05-03T08:00:00", timezone, true); // Monday morning
+  });
+
+  needs.hooks.afterEach(() => {
+    clock.restore();
+  });
+
+  test("shows correct timeframe options", async function (assert) {
+    await visit("/admin/users/1234/regular");
+    await click(".suspend-user");
+    await click(".future-date-input-selector-header");
+
+    assert.equal(
+      query(".future-date-input-selector-header").getAttribute("aria-expanded"),
+      "true",
+      "selector is expanded"
+    );
+
+    const options = Array.from(
+      queryAll(`ul.select-kit-collection li span.name`).map((_, x) =>
+        x.innerText.trim()
+      )
+    );
+
+    const expected = [
+      I18n.t("topic.auto_update_input.later_today"),
+      I18n.t("topic.auto_update_input.tomorrow"),
+      I18n.t("topic.auto_update_input.next_week"),
+      I18n.t("topic.auto_update_input.two_weeks"),
+      I18n.t("topic.auto_update_input.next_month"),
+      I18n.t("topic.auto_update_input.two_months"),
+      I18n.t("topic.auto_update_input.three_months"),
+      I18n.t("topic.auto_update_input.four_months"),
+      I18n.t("topic.auto_update_input.six_months"),
+      I18n.t("topic.auto_update_input.one_year"),
+      I18n.t("topic.auto_update_input.forever"),
+      I18n.t("topic.auto_update_input.pick_date_and_time"),
+    ];
+
+    assert.deepEqual(options, expected, "options are correct");
+  });
+});

app/assets/javascripts/discourse/tests/acceptance/create-invite-modal-test.js

@@ -3,8 +3,12 @@ import {
   acceptance,
   count,
   exists,
+  fakeTime,
+  query,
+  queryAll,
 } from "discourse/tests/helpers/qunit-helpers";
 import { test } from "qunit";
+import I18n from "I18n";
 
 acceptance("Invites - Create & Edit Invite Modal", function (needs) {
   let deleted;
@@ -185,3 +189,76 @@ acceptance("Invites - Email Invites", function (needs) {
     );
   });
 });
+
+acceptance(
+  "Invites - Create & Edit Invite Modal - timeframe choosing",
+  function (needs) {
+    let clock = null;
+
+    needs.user();
+    needs.pretender((server, helper) => {
+      const inviteData = {
+        id: 1,
+        invite_key: "52641ae8878790bc7b79916247cfe6ba",
+        link: "http://example.com/invites/52641ae8878790bc7b79916247cfe6ba",
+        max_redemptions_allowed: 1,
+        redemption_count: 0,
+        created_at: "2021-01-26T12:00:00.000Z",
+        updated_at: "2021-01-26T12:00:00.000Z",
+        expires_at: "2121-01-26T12:00:00.000Z",
+        expired: false,
+        topics: [],
+        groups: [],
+      };
+
+      server.post("/invites", () => helper.response(inviteData));
+      server.put("/invites/1", () => helper.response(inviteData));
+    });
+
+    needs.hooks.beforeEach(() => {
+      const timezone = moment.tz.guess();
+      clock = fakeTime("2100-05-03T08:00:00", timezone, true); // Monday morning
+    });
+
+    needs.hooks.afterEach(() => {
+      clock.restore();
+    });
+
+    test("shows correct timeframe options", async function (assert) {
+      await visit("/u/eviltrout/invited/pending");
+
+      await click(".invite-controls .btn:first-child");
+      await click(".modal-footer .show-advanced");
+      await click(".future-date-input-selector-header");
+
+      assert.equal(
+        query(".future-date-input-selector-header").getAttribute(
+          "aria-expanded"
+        ),
+        "true",
+        "selector is expanded"
+      );
+
+      const options = Array.from(
+        queryAll(`ul.select-kit-collection li span.name`).map((_, x) =>
+          x.innerText.trim()
+        )
+      );
+
+      const expected = [
+        I18n.t("topic.auto_update_input.later_today"),
+        I18n.t("topic.auto_update_input.tomorrow"),
+        I18n.t("topic.auto_update_input.next_week"),
+        I18n.t("topic.auto_update_input.two_weeks"),
+        I18n.t("topic.auto_update_input.next_month"),
+        I18n.t("topic.auto_update_input.two_months"),
+        I18n.t("topic.auto_update_input.three_months"),
+        I18n.t("topic.auto_update_input.four_months"),
+        I18n.t("topic.auto_update_input.six_months"),
+        I18n.t("topic.auto_update_input.pick_date_and_time"),
+      ];
+
+      assert.deepEqual(options, expected, "options are correct");
+    });
+  }
+);

app/assets/javascripts/discourse/tests/acceptance/topic-set-slow-mode-test.js

@@ -0,0 +1,75 @@
+import {
+  acceptance,
+  fakeTime,
+  query,
+  queryAll,
+  updateCurrentUser,
+} from "discourse/tests/helpers/qunit-helpers";
+import { click, visit } from "@ember/test-helpers";
+import { test } from "qunit";
+import I18n from "I18n";
+
+acceptance("Topic - Set Slow Mode", function (needs) {
+  let clock = null;
+
+  needs.user();
+  needs.pretender((server, helper) => {
+    server.post("/t/280/timer", () =>
+      helper.response({
+        success: "OK",
+        execute_at: new Date(
+          new Date().getTime() + 1 * 60 * 60 * 1000
+        ).toISOString(),
+        duration_minutes: 1440,
+        based_on_last_post: false,
+        closed: false,
+        category_id: null,
+      })
+    );
+  });
+
+  needs.hooks.beforeEach(() => {
+    const timezone = moment.tz.guess();
+    clock = fakeTime("2100-05-03T08:00:00", timezone, true); // Monday morning
+  });
+
+  needs.hooks.afterEach(() => {
+    clock.restore();
+  });
+
+  test("shows correct timeframe options", async function (assert) {
+    updateCurrentUser({ moderator: true });
+    await visit("/t/internationalization-localization");
+    await click(".toggle-admin-menu");
+    await click(".topic-admin-slow-mode button");
+
+    await click(".future-date-input-selector-header");
+
+    assert.equal(
+      query(".future-date-input-selector-header").getAttribute("aria-expanded"),
+      "true",
+      "selector is expanded"
+    );
+
+    const options = Array.from(
+      queryAll(`ul.select-kit-collection li span.name`).map((_, x) =>
+        x.innerText.trim()
+      )
+    );
+
+    const expected = [
+      I18n.t("topic.auto_update_input.later_today"),
+      I18n.t("topic.auto_update_input.tomorrow"),
+      I18n.t("topic.auto_update_input.next_week"),
+      I18n.t("topic.auto_update_input.two_weeks"),
+      I18n.t("topic.auto_update_input.next_month"),
+      I18n.t("topic.auto_update_input.two_months"),
+      I18n.t("topic.auto_update_input.three_months"),
+      I18n.t("topic.auto_update_input.four_months"),
+      I18n.t("topic.auto_update_input.six_months"),
+      I18n.t("topic.auto_update_input.pick_date_and_time"),
+    ];
+
+    assert.deepEqual(options, expected, "options are correct");
+  });
+});

app/assets/javascripts/discourse/tests/acceptance/user-preferences-notifications-test.js

@@ -2,10 +2,14 @@ import {
   acceptance,
   count,
   exists,
+  fakeTime,
+  query,
+  queryAll,
 } from "discourse/tests/helpers/qunit-helpers";
 import { click, visit } from "@ember/test-helpers";
 import selectKit from "discourse/tests/helpers/select-kit-helper";
 import { test } from "qunit";
+import I18n from "I18n";
 
 acceptance("User notification schedule", function (needs) {
   needs.user();
@@ -106,3 +110,53 @@ acceptance("User notification schedule", function (needs) {
     );
   });
 });
+
+acceptance("User Notifications - Users - Ignore User", function (needs) {
+  let clock = null;
+  needs.user();
+
+  needs.hooks.beforeEach(() => {
+    const timezone = moment.tz.guess();
+    clock = fakeTime("2100-05-03T08:00:00", timezone, true); // Monday morning
+  });
+
+  needs.hooks.afterEach(() => {
+    clock.restore();
+  });
+
+  test("Shows correct timeframe options", async function (assert) {
+    await visit("/u/eviltrout/preferences/users");
+
+    await click("div.user-notifications div div button");
+    await click(".future-date-input-selector-header");
+
+    assert.equal(
+      query(".future-date-input-selector-header").getAttribute("aria-expanded"),
+      "true",
+      "selector is expanded"
+    );
+
+    const options = Array.from(
+      queryAll(`ul.select-kit-collection li span.name`).map((_, x) =>
+        x.innerText.trim()
+      )
+    );
+
+    const expected = [
+      I18n.t("topic.auto_update_input.later_today"),
+      I18n.t("topic.auto_update_input.tomorrow"),
+      I18n.t("topic.auto_update_input.this_weekend"),
+      I18n.t("topic.auto_update_input.next_week"),
+      I18n.t("topic.auto_update_input.two_weeks"),
+      I18n.t("topic.auto_update_input.next_month"),
+      I18n.t("topic.auto_update_input.two_months"),
+      I18n.t("topic.auto_update_input.three_months"),
+      I18n.t("topic.auto_update_input.four_months"),
+      I18n.t("topic.auto_update_input.six_months"),
+      I18n.t("topic.auto_update_input.one_year"),
+      I18n.t("topic.auto_update_input.forever"),
+    ];
+
+    assert.deepEqual(options, expected, "options are correct");
+  });
+});

app/assets/javascripts/discourse/tests/integration/components/select-kit/future-date-input-selector-test.js

@@ -3,7 +3,9 @@ import componentTest, {
 } from "discourse/tests/helpers/component-test";
 import {
   discourseModule,
+  exists,
   fakeTime,
+  query,
   queryAll,
 } from "discourse/tests/helpers/qunit-helpers";
 import hbs from "htmlbars-inline-precompile";
@@ -20,15 +22,54 @@ discourseModule(
     });
 
     hooks.afterEach(function () {
-      this.clock.restore();
+      if (this.clock) {
+        this.clock.restore();
+      }
+    });
+
+    componentTest("rendering and expanding", {
+      template: hbs`
+        {{future-date-input-selector
+          options=(hash
+            none="topic.auto_update_input.none"
+          )
+        }}
+      `,
+
+      async test(assert) {
+        assert.ok(
+          exists("div.future-date-input-selector"),
+          "Selector is rendered"
+        );
+
+        assert.ok(
+          query("span").innerText === I18n.t("topic.auto_update_input.none"),
+          "Default text is rendered"
+        );
+
+        await this.subject.expand();
+
+        assert.equal(
+          query(".future-date-input-selector-header").getAttribute(
+            "aria-expanded"
+          ),
+          "true",
+          "selector is expanded"
+        );
+
+        assert.ok(
+          exists("ul.select-kit-collection"),
+          "List of options is rendered"
+        );
+      },
     });
 
     componentTest("shows default options", {
       template: hbs`{{future-date-input-selector}}`,
 
       beforeEach() {
-        const monday = fakeTime("2100-06-07T08:00:00", "UTC", true);
-        this.clock = monday;
+        const timezone = moment.tz.guess();
+        this.clock = fakeTime("2100-06-07T08:00:00", timezone, true); // Monday
       },
 
       async test(assert) {
@@ -54,8 +95,8 @@ discourseModule(
       template: hbs`{{future-date-input-selector}}`,
 
       beforeEach() {
-        const sunday = fakeTime("2100-06-13T08:00:00", "UTC", true);
-        this.clock = sunday;
+        const timezone = moment.tz.guess();
+        this.clock = fakeTime("2100-06-13T08:00:00", timezone, true); // Sunday
       },
 
       async test(assert) {
@@ -67,6 +108,124 @@ discourseModule(
       },
     });
 
+    componentTest("shows 'Custom date and time' if it's enabled", {
+      template: hbs`
+        {{future-date-input-selector
+          includeDateTime=true
+        }}
+      `,
+
+      async test(assert) {
+        await this.subject.expand();
+        const options = getOptions();
+        const customDateAndTime = I18n.t(
+          "topic.auto_update_input.pick_date_and_time"
+        );
+
+        assert.ok(options.includes(customDateAndTime));
+      },
+    });
+
+    componentTest("shows 'This Weekend' if it's enabled", {
+      template: hbs`
+        {{future-date-input-selector
+          includeWeekend=true
+        }}
+      `,
+
+      beforeEach() {
+        const timezone = moment.tz.guess();
+        this.clock = fakeTime("2100-06-07T08:00:00", timezone, true); // Monday
+      },
+
+      async test(assert) {
+        await this.subject.expand();
+        const options = getOptions();
+        const thisWeekend = I18n.t("topic.auto_update_input.this_weekend");
+
+        assert.ok(options.includes(thisWeekend));
+      },
+    });
+
+    componentTest("doesn't show 'This Weekend' on Fridays", {
+      template: hbs`
+        {{future-date-input-selector
+          includeWeekend=true
+        }}
+      `,
+
+      beforeEach() {
+        const timezone = moment.tz.guess();
+        this.clock = fakeTime("2100-04-23 18:00:00", timezone, true); // Friday
+      },
+
+      async test(assert) {
+        await this.subject.expand();
+        const options = getOptions();
+        const thisWeekend = I18n.t("topic.auto_update_input.this_weekend");
+
+        assert.not(options.includes(thisWeekend));
+      },
+    });
+
+    componentTest(
+      "shows 'Later This Week' instead of 'Later Today' at the end of the day",
+      {
+        template: hbs`{{future-date-input-selector}}`,
+
+        beforeEach() {
+          const timezone = moment.tz.guess();
+          this.clock = fakeTime("2100-04-19 18:00:00", timezone, true); // Monday evening
+        },
+
+        async test(assert) {
+          await this.subject.expand();
+
+          const options = getOptions();
+          const laterToday = I18n.t("topic.auto_update_input.later_today");
+          const laterThisWeek = I18n.t(
+            "topic.auto_update_input.later_this_week"
+          );
+
+          assert.not(options.includes(laterToday));
+          assert.ok(options.includes(laterThisWeek));
+        },
+      }
+    );
+
+    componentTest("doesn't show 'Later This Week' on Tuesdays", {
+      template: hbs`{{future-date-input-selector}}`,
+
+      beforeEach() {
+        const timezone = moment.tz.guess();
+        this.clock = fakeTime("2100-04-22 18:00:00", timezone, true); // Tuesday evening
+      },
+
+      async test(assert) {
+        await this.subject.expand();
+        const options = getOptions();
+        const laterThisWeek = I18n.t("topic.auto_update_input.later_this_week");
+        assert.not(options.includes(laterThisWeek));
+      },
+    });
+
+    componentTest("doesn't show 'Next Month' on the last day of the month", {
+      template: hbs`{{future-date-input-selector}}`,
+
+      beforeEach() {
+        const timezone = moment.tz.guess();
+        this.clock = fakeTime("2100-04-30 18:00:00", timezone, true); // The last day of April
+      },
+
+      async test(assert) {
+        await this.subject.expand();
+        const options = getOptions();
+        const nextMonth = I18n.t("topic.auto_update_input.next_month");
+
+        assert.not(options.includes(nextMonth));
+      },
+    });
+
     function getOptions() {
       return Array.from(
         queryAll(`ul.select-kit-collection li span.name`).map((_, span) =>