fdcb429145
As reported on Meta, the relative time pickers for configuring slow-mode and auto-close durations in category settings are initially showing a "mins" option, which then disappears after you select any other timescale. Our `RelativeTimePicker` component wasn't equipped to handle `null` values as the initial input. This caused it to go into a code path that set the selected timescale to "mins", even if that is not an allowed option. There are two things being done here: 1. Add support for `null` input values to `RelativeTimePicker`. This fixes the auto-close setting. 2. Allow minutes for the slow-mode setting. (The user in Meta mentioned they usually set 15-30 minutes to cool down hot topics.
111 lines
4.6 KiB
JavaScript
111 lines
4.6 KiB
JavaScript
import { module, test } from "qunit";
|
|
import { setupRenderingTest } from "discourse/tests/helpers/component-test";
|
|
import { render } from "@ember/test-helpers";
|
|
import { query } from "discourse/tests/helpers/qunit-helpers";
|
|
import { hbs } from "ember-cli-htmlbars";
|
|
import selectKit from "discourse/tests/helpers/select-kit-helper";
|
|
|
|
module("Integration | Component | relative-time-picker", function (hooks) {
|
|
setupRenderingTest(hooks);
|
|
|
|
hooks.beforeEach(function () {
|
|
this.set("subject", selectKit());
|
|
});
|
|
|
|
test("prefills and preselects minutes", async function (assert) {
|
|
await render(hbs`<RelativeTimePicker @durationMinutes="5" />`);
|
|
|
|
const prefilledDuration = query(".relative-time-duration").value;
|
|
assert.strictEqual(this.subject.header().value(), "mins");
|
|
assert.strictEqual(prefilledDuration, "5");
|
|
});
|
|
|
|
test("prefills and preselects null minutes", async function (assert) {
|
|
await render(hbs`<RelativeTimePicker @durationMinutes={{null}} />`);
|
|
|
|
const prefilledDuration = query(".relative-time-duration").value;
|
|
assert.strictEqual(this.subject.header().value(), "mins");
|
|
assert.strictEqual(prefilledDuration, "");
|
|
});
|
|
|
|
test("prefills and preselects hours based on translated minutes", async function (assert) {
|
|
await render(hbs`<RelativeTimePicker @durationMinutes="90" />`);
|
|
|
|
const prefilledDuration = query(".relative-time-duration").value;
|
|
assert.strictEqual(this.subject.header().value(), "hours");
|
|
assert.strictEqual(prefilledDuration, "1.5");
|
|
});
|
|
|
|
test("prefills and preselects days based on translated minutes", async function (assert) {
|
|
await render(hbs`<RelativeTimePicker @durationMinutes="2880" />`);
|
|
|
|
const prefilledDuration = query(".relative-time-duration").value;
|
|
assert.strictEqual(this.subject.header().value(), "days");
|
|
assert.strictEqual(prefilledDuration, "2");
|
|
});
|
|
|
|
test("prefills and preselects months based on translated minutes", async function (assert) {
|
|
await render(hbs`<RelativeTimePicker @durationMinutes="129600" />`);
|
|
|
|
const prefilledDuration = query(".relative-time-duration").value;
|
|
assert.strictEqual(this.subject.header().value(), "months");
|
|
assert.strictEqual(prefilledDuration, "3");
|
|
});
|
|
|
|
test("prefills and preselects years based on translated minutes", async function (assert) {
|
|
await render(hbs`<RelativeTimePicker @durationMinutes="525600" />`);
|
|
|
|
const prefilledDuration = query(".relative-time-duration").value;
|
|
assert.strictEqual(this.subject.header().value(), "years");
|
|
assert.strictEqual(prefilledDuration, "1");
|
|
});
|
|
|
|
test("prefills and preselects hours", async function (assert) {
|
|
await render(hbs`<RelativeTimePicker @durationHours="5" />`);
|
|
|
|
const prefilledDuration = query(".relative-time-duration").value;
|
|
assert.strictEqual(this.subject.header().value(), "hours");
|
|
assert.strictEqual(prefilledDuration, "5");
|
|
});
|
|
|
|
test("prefills and preselects null hours", async function (assert) {
|
|
await render(hbs`<RelativeTimePicker @durationHours={{null}} />`);
|
|
|
|
const prefilledDuration = query(".relative-time-duration").value;
|
|
assert.strictEqual(this.subject.header().value(), "hours");
|
|
assert.strictEqual(prefilledDuration, "");
|
|
});
|
|
|
|
test("prefills and preselects minutes based on translated hours", async function (assert) {
|
|
await render(hbs`<RelativeTimePicker @durationHours="0.5" />`);
|
|
|
|
const prefilledDuration = query(".relative-time-duration").value;
|
|
assert.strictEqual(this.subject.header().value(), "mins");
|
|
assert.strictEqual(prefilledDuration, "30");
|
|
});
|
|
|
|
test("prefills and preselects days based on translated hours", async function (assert) {
|
|
await render(hbs`<RelativeTimePicker @durationHours="48" />`);
|
|
|
|
const prefilledDuration = query(".relative-time-duration").value;
|
|
assert.strictEqual(this.subject.header().value(), "days");
|
|
assert.strictEqual(prefilledDuration, "2");
|
|
});
|
|
|
|
test("prefills and preselects months based on translated hours", async function (assert) {
|
|
await render(hbs`<RelativeTimePicker @durationHours="2160" />`);
|
|
|
|
const prefilledDuration = query(".relative-time-duration").value;
|
|
assert.strictEqual(this.subject.header().value(), "months");
|
|
assert.strictEqual(prefilledDuration, "3");
|
|
});
|
|
|
|
test("prefills and preselects years based on translated hours", async function (assert) {
|
|
await render(hbs`<RelativeTimePicker @durationHours="17520" />`);
|
|
|
|
const prefilledDuration = query(".relative-time-duration").value;
|
|
assert.strictEqual(this.subject.header().value(), "years");
|
|
assert.strictEqual(prefilledDuration, "2");
|
|
});
|
|
});
|