REFACTOR: Move qunit tests to a different directory structure
This structure is closer to how ember-cli expects tests to be placed. It is not their final position, just the first step towards it.
This commit is contained in:
Robin Ward
@@ -0,0 +1,51 @@
|
||||
import componentTest from "helpers/component-test";
|
||||
|
||||
moduleForComponent("ace-editor", { integration: true });
|
||||
|
||||
componentTest("css editor", {
|
||||
skip: true,
|
||||
template: '{{ace-editor mode="css"}}',
|
||||
test(assert) {
|
||||
assert.expect(1);
|
||||
assert.ok(find(".ace_editor").length, "it renders the ace editor");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("html editor", {
|
||||
skip: true,
|
||||
template: '{{ace-editor mode="html" content="<b>wat</b>"}}',
|
||||
test(assert) {
|
||||
assert.expect(1);
|
||||
assert.ok(find(".ace_editor").length, "it renders the ace editor");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("sql editor", {
|
||||
skip: true,
|
||||
template: '{{ace-editor mode="sql" content="SELECT * FROM users"}}',
|
||||
test(assert) {
|
||||
assert.expect(1);
|
||||
assert.ok(find(".ace_editor").length, "it renders the ace editor");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("disabled editor", {
|
||||
skip: true,
|
||||
template:
|
||||
'{{ace-editor mode="sql" content="SELECT * FROM users" disabled=true}}',
|
||||
test(assert) {
|
||||
const $ace = find(".ace_editor");
|
||||
assert.expect(3);
|
||||
assert.ok($ace.length, "it renders the ace editor");
|
||||
assert.equal(
|
||||
$ace.parent().data().editor.getReadOnly(),
|
||||
true,
|
||||
"it sets ACE to read-only mode"
|
||||
);
|
||||
assert.equal(
|
||||
$ace.parent().attr("data-disabled"),
|
||||
"true",
|
||||
"ACE wrapper has `data-disabled` attribute set to true"
|
||||
);
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,165 @@
|
||||
import componentTest from "helpers/component-test";
|
||||
import pretender from "helpers/create-pretender";
|
||||
|
||||
moduleForComponent("admin-report", {
|
||||
integration: true,
|
||||
});
|
||||
|
||||
componentTest("default", {
|
||||
template: "{{admin-report dataSourceName='signups'}}",
|
||||
|
||||
async test(assert) {
|
||||
assert.ok(exists(".admin-report.signups"));
|
||||
|
||||
assert.ok(exists(".admin-report.signups", "it defaults to table mode"));
|
||||
|
||||
assert.equal(
|
||||
find(".header .item.report").text().trim(),
|
||||
"Signups",
|
||||
"it has a title"
|
||||
);
|
||||
|
||||
assert.equal(
|
||||
find(".header .info").attr("data-tooltip"),
|
||||
"New account registrations for this period",
|
||||
"it has a description"
|
||||
);
|
||||
|
||||
assert.equal(
|
||||
find(".admin-report-table thead tr th:first-child .title").text().trim(),
|
||||
"Day",
|
||||
"it has col headers"
|
||||
);
|
||||
|
||||
assert.equal(
|
||||
find(".admin-report-table thead tr th:nth-child(2) .title").text().trim(),
|
||||
"Count",
|
||||
"it has col headers"
|
||||
);
|
||||
|
||||
assert.equal(
|
||||
find(".admin-report-table tbody tr:nth-child(1) td:nth-child(1)")
|
||||
.text()
|
||||
.trim(),
|
||||
"June 16, 2018",
|
||||
"it has rows"
|
||||
);
|
||||
|
||||
assert.equal(
|
||||
find(".admin-report-table tbody tr:nth-child(1) td:nth-child(2)")
|
||||
.text()
|
||||
.trim(),
|
||||
"12",
|
||||
"it has rows"
|
||||
);
|
||||
|
||||
assert.ok(exists(".total-row"), "it has totals");
|
||||
|
||||
await click(".admin-report-table-header.y .sort-btn");
|
||||
|
||||
assert.equal(
|
||||
find(".admin-report-table tbody tr:nth-child(1) td:nth-child(2)")
|
||||
.text()
|
||||
.trim(),
|
||||
"7",
|
||||
"it can sort rows"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("options", {
|
||||
template: "{{admin-report dataSourceName='signups' reportOptions=options}}",
|
||||
|
||||
beforeEach() {
|
||||
this.set("options", {
|
||||
table: {
|
||||
perPage: 4,
|
||||
total: false,
|
||||
},
|
||||
});
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
assert.ok(exists(".pagination"), "it paginates the results");
|
||||
assert.equal(
|
||||
find(".pagination button").length,
|
||||
3,
|
||||
"it creates the correct number of pages"
|
||||
);
|
||||
|
||||
assert.notOk(exists(".totals-sample-table"), "it hides totals");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("switch modes", {
|
||||
template: "{{admin-report dataSourceName='signups' showFilteringUI=true}}",
|
||||
|
||||
async test(assert) {
|
||||
await click(".mode-btn.chart");
|
||||
|
||||
assert.notOk(exists(".admin-report-table"), "it removes the table");
|
||||
assert.ok(exists(".admin-report-chart"), "it shows the chart");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("timeout", {
|
||||
template: "{{admin-report dataSourceName='signups_timeout'}}",
|
||||
|
||||
test(assert) {
|
||||
assert.ok(exists(".alert-error.timeout"), "it displays a timeout error");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("no data", {
|
||||
template: "{{admin-report dataSourceName='posts'}}",
|
||||
|
||||
test(assert) {
|
||||
assert.ok(exists(".no-data"), "it displays a no data alert");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("exception", {
|
||||
template: "{{admin-report dataSourceName='signups_exception'}}",
|
||||
|
||||
test(assert) {
|
||||
assert.ok(exists(".alert-error.exception"), "it displays an error");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("rate limited", {
|
||||
beforeEach() {
|
||||
pretender.get("/admin/reports/bulk", () => {
|
||||
return [
|
||||
429,
|
||||
{ "Content-Type": "application/json" },
|
||||
{
|
||||
errors: [
|
||||
"You’ve performed this action too many times. Please wait 10 seconds before trying again.",
|
||||
],
|
||||
error_type: "rate_limit",
|
||||
extras: { wait_seconds: 10 },
|
||||
},
|
||||
];
|
||||
});
|
||||
},
|
||||
|
||||
template: "{{admin-report dataSourceName='signups_rate_limited'}}",
|
||||
|
||||
test(assert) {
|
||||
assert.ok(
|
||||
exists(".alert-error.rate-limited"),
|
||||
"it displays a rate limited error"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("not found", {
|
||||
template: "{{admin-report dataSourceName='not_found'}}",
|
||||
|
||||
test(assert) {
|
||||
assert.ok(
|
||||
exists(".alert-error.not-found"),
|
||||
"it displays a not found error"
|
||||
);
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,38 @@
|
||||
import selectKit from "helpers/select-kit-helper";
|
||||
import componentTest from "helpers/component-test";
|
||||
import EmberObject from "@ember/object";
|
||||
import pretender from "helpers/create-pretender";
|
||||
|
||||
moduleForComponent("badge-title", { integration: true });
|
||||
|
||||
componentTest("badge title", {
|
||||
template:
|
||||
"{{badge-title selectableUserBadges=selectableUserBadges user=user}}",
|
||||
|
||||
beforeEach() {
|
||||
this.set("subject", selectKit());
|
||||
this.set("selectableUserBadges", [
|
||||
EmberObject.create({
|
||||
id: 0,
|
||||
badge: { name: "(none)" },
|
||||
}),
|
||||
EmberObject.create({
|
||||
id: 42,
|
||||
badge_id: 102,
|
||||
badge: { name: "Test" },
|
||||
}),
|
||||
]);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
pretender.put("/u/eviltrout/preferences/badge_title", () => [
|
||||
200,
|
||||
{ "Content-Type": "application/json" },
|
||||
{},
|
||||
]);
|
||||
await this.subject.expand();
|
||||
await this.subject.selectRowByValue(42);
|
||||
await click(".btn");
|
||||
assert.equal(this.currentUser.title, "Test");
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,43 @@
|
||||
import componentTest from "helpers/component-test";
|
||||
import pretender from "helpers/create-pretender";
|
||||
import { resetCache } from "pretty-text/upload-short-url";
|
||||
|
||||
moduleForComponent("cook-text", { integration: true });
|
||||
|
||||
componentTest("renders markdown", {
|
||||
template: '{{cook-text "_foo_" class="post-body"}}',
|
||||
|
||||
test(assert) {
|
||||
const html = find(".post-body")[0].innerHTML.trim();
|
||||
assert.equal(html, "<p><em>foo</em></p>");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("resolves short URLs", {
|
||||
template: `{{cook-text "" class="post-body"}}`,
|
||||
|
||||
beforeEach() {
|
||||
pretender.post("/uploads/lookup-urls", () => {
|
||||
return [
|
||||
200,
|
||||
{ "Content-Type": "application/json" },
|
||||
[
|
||||
{
|
||||
short_url: "upload://a.png",
|
||||
url: "/images/avatar.png",
|
||||
short_path: "/images/d-logo-sketch.png",
|
||||
},
|
||||
],
|
||||
];
|
||||
});
|
||||
},
|
||||
|
||||
afterEach() {
|
||||
resetCache();
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
const html = find(".post-body")[0].innerHTML.trim();
|
||||
assert.equal(html, '<p><img src="/images/avatar.png" alt="an image"></p>');
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,175 @@
|
||||
import I18n from "I18n";
|
||||
import componentTest from "helpers/component-test";
|
||||
moduleForComponent("d-button", { integration: true });
|
||||
|
||||
componentTest("icon only button", {
|
||||
template: '{{d-button icon="plus" tabindex="3"}}',
|
||||
|
||||
test(assert) {
|
||||
assert.ok(
|
||||
find("button.btn.btn-icon.no-text").length,
|
||||
"it has all the classes"
|
||||
);
|
||||
assert.ok(find("button .d-icon.d-icon-plus").length, "it has the icon");
|
||||
assert.equal(find("button").attr("tabindex"), "3", "it has the tabindex");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("icon and text button", {
|
||||
template: '{{d-button icon="plus" label="topic.create"}}',
|
||||
|
||||
test(assert) {
|
||||
assert.ok(
|
||||
find("button.btn.btn-icon-text").length,
|
||||
"it has all the classes"
|
||||
);
|
||||
assert.ok(find("button .d-icon.d-icon-plus").length, "it has the icon");
|
||||
assert.ok(find("button span.d-button-label").length, "it has the label");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("text only button", {
|
||||
template: '{{d-button label="topic.create"}}',
|
||||
|
||||
test(assert) {
|
||||
assert.ok(find("button.btn.btn-text").length, "it has all the classes");
|
||||
assert.ok(find("button span.d-button-label").length, "it has the label");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("form attribute", {
|
||||
template: '{{d-button form="login-form"}}',
|
||||
|
||||
test(assert) {
|
||||
assert.ok(exists("button[form=login-form]"), "it has the form attribute");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("link-styled button", {
|
||||
template: '{{d-button display="link"}}',
|
||||
|
||||
test(assert) {
|
||||
assert.ok(
|
||||
find("button.btn-link:not(.btn)").length,
|
||||
"it has the right classes"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("isLoading button", {
|
||||
template: "{{d-button isLoading=isLoading}}",
|
||||
|
||||
beforeEach() {
|
||||
this.set("isLoading", true);
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
assert.ok(
|
||||
find("button.is-loading .loading-icon").length,
|
||||
"it has a spinner showing"
|
||||
);
|
||||
assert.ok(
|
||||
find("button[disabled]").length,
|
||||
"while loading the button is disabled"
|
||||
);
|
||||
|
||||
this.set("isLoading", false);
|
||||
|
||||
assert.notOk(
|
||||
find("button .loading-icon").length,
|
||||
"it doesn't have a spinner showing"
|
||||
);
|
||||
assert.ok(
|
||||
find("button:not([disabled])").length,
|
||||
"while not loading the button is enabled"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("disabled button", {
|
||||
template: "{{d-button disabled=disabled}}",
|
||||
|
||||
beforeEach() {
|
||||
this.set("disabled", true);
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
assert.ok(find("button[disabled]").length, "the button is disabled");
|
||||
|
||||
this.set("disabled", false);
|
||||
|
||||
assert.ok(find("button:not([disabled])").length, "the button is enabled");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("aria-label", {
|
||||
template:
|
||||
"{{d-button ariaLabel=ariaLabel translatedAriaLabel=translatedAriaLabel}}",
|
||||
|
||||
beforeEach() {
|
||||
I18n.translations[I18n.locale].js.test = { fooAriaLabel: "foo" };
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
this.set("ariaLabel", "test.fooAriaLabel");
|
||||
|
||||
assert.equal(
|
||||
find("button")[0].getAttribute("aria-label"),
|
||||
I18n.t("test.fooAriaLabel")
|
||||
);
|
||||
|
||||
this.setProperties({
|
||||
ariaLabel: null,
|
||||
translatedAriaLabel: "bar",
|
||||
});
|
||||
|
||||
assert.equal(find("button")[0].getAttribute("aria-label"), "bar");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("title", {
|
||||
template: "{{d-button title=title translatedTitle=translatedTitle}}",
|
||||
|
||||
beforeEach() {
|
||||
I18n.translations[I18n.locale].js.test = { fooTitle: "foo" };
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
this.set("title", "test.fooTitle");
|
||||
assert.equal(
|
||||
find("button")[0].getAttribute("title"),
|
||||
I18n.t("test.fooTitle")
|
||||
);
|
||||
|
||||
this.setProperties({
|
||||
title: null,
|
||||
translatedTitle: "bar",
|
||||
});
|
||||
|
||||
assert.equal(find("button")[0].getAttribute("title"), "bar");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("label", {
|
||||
template: "{{d-button label=label translatedLabel=translatedLabel}}",
|
||||
|
||||
beforeEach() {
|
||||
I18n.translations[I18n.locale].js.test = { fooLabel: "foo" };
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
this.set("label", "test.fooLabel");
|
||||
|
||||
assert.equal(
|
||||
find("button .d-button-label").text(),
|
||||
I18n.t("test.fooLabel")
|
||||
);
|
||||
|
||||
this.setProperties({
|
||||
label: null,
|
||||
translatedLabel: "bar",
|
||||
});
|
||||
|
||||
assert.equal(find("button .d-button-label").text(), "bar");
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,769 @@
|
||||
import I18n from "I18n";
|
||||
import { next } from "@ember/runloop";
|
||||
import { clearToolbarCallbacks } from "discourse/components/d-editor";
|
||||
import componentTest from "helpers/component-test";
|
||||
import { withPluginApi } from "discourse/lib/plugin-api";
|
||||
import formatTextWithSelection from "helpers/d-editor-helper";
|
||||
import {
|
||||
setTextareaSelection,
|
||||
getTextareaSelection,
|
||||
} from "helpers/textarea-selection-helper";
|
||||
|
||||
moduleForComponent("d-editor", { integration: true });
|
||||
|
||||
componentTest("preview updates with markdown", {
|
||||
template: "{{d-editor value=value}}",
|
||||
|
||||
async test(assert) {
|
||||
assert.ok(find(".d-editor-button-bar").length);
|
||||
await fillIn(".d-editor-input", "hello **world**");
|
||||
|
||||
assert.equal(this.value, "hello **world**");
|
||||
assert.equal(
|
||||
find(".d-editor-preview").html().trim(),
|
||||
"<p>hello <strong>world</strong></p>"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("preview sanitizes HTML", {
|
||||
template: "{{d-editor value=value}}",
|
||||
|
||||
async test(assert) {
|
||||
await fillIn(".d-editor-input", `"><svg onload="prompt(/xss/)"></svg>`);
|
||||
assert.equal(find(".d-editor-preview").html().trim(), '<p>"></p>');
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("updating the value refreshes the preview", {
|
||||
template: "{{d-editor value=value}}",
|
||||
|
||||
beforeEach() {
|
||||
this.set("value", "evil trout");
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
assert.equal(find(".d-editor-preview").html().trim(), "<p>evil trout</p>");
|
||||
|
||||
await this.set("value", "zogstrip");
|
||||
assert.equal(find(".d-editor-preview").html().trim(), "<p>zogstrip</p>");
|
||||
},
|
||||
});
|
||||
|
||||
function jumpEnd(textarea) {
|
||||
textarea.selectionStart = textarea.value.length;
|
||||
textarea.selectionEnd = textarea.value.length;
|
||||
return textarea;
|
||||
}
|
||||
|
||||
function testCase(title, testFunc) {
|
||||
componentTest(title, {
|
||||
template: "{{d-editor value=value}}",
|
||||
beforeEach() {
|
||||
this.set("value", "hello world.");
|
||||
},
|
||||
test(assert) {
|
||||
const textarea = jumpEnd(find("textarea.d-editor-input")[0]);
|
||||
testFunc.call(this, assert, textarea);
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function composerTestCase(title, testFunc) {
|
||||
componentTest(title, {
|
||||
template: "{{d-editor value=value composerEvents=true}}",
|
||||
beforeEach() {
|
||||
this.set("value", "hello world.");
|
||||
},
|
||||
test(assert) {
|
||||
const textarea = jumpEnd(find("textarea.d-editor-input")[0]);
|
||||
testFunc.call(this, assert, textarea);
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
testCase(`selecting the space before a word`, async function (
|
||||
assert,
|
||||
textarea
|
||||
) {
|
||||
textarea.selectionStart = 5;
|
||||
textarea.selectionEnd = 7;
|
||||
|
||||
await click(`button.bold`);
|
||||
|
||||
assert.equal(this.value, `hello **w**orld.`);
|
||||
assert.equal(textarea.selectionStart, 8);
|
||||
assert.equal(textarea.selectionEnd, 9);
|
||||
});
|
||||
|
||||
testCase(`selecting the space after a word`, async function (assert, textarea) {
|
||||
textarea.selectionStart = 0;
|
||||
textarea.selectionEnd = 6;
|
||||
|
||||
await click(`button.bold`);
|
||||
|
||||
assert.equal(this.value, `**hello** world.`);
|
||||
assert.equal(textarea.selectionStart, 2);
|
||||
assert.equal(textarea.selectionEnd, 7);
|
||||
});
|
||||
|
||||
testCase(`bold button with no selection`, async function (assert, textarea) {
|
||||
await click(`button.bold`);
|
||||
|
||||
const example = I18n.t(`composer.bold_text`);
|
||||
assert.equal(this.value, `hello world.**${example}**`);
|
||||
assert.equal(textarea.selectionStart, 14);
|
||||
assert.equal(textarea.selectionEnd, 14 + example.length);
|
||||
});
|
||||
|
||||
testCase(`bold button with a selection`, async function (assert, textarea) {
|
||||
textarea.selectionStart = 6;
|
||||
textarea.selectionEnd = 11;
|
||||
|
||||
await click(`button.bold`);
|
||||
assert.equal(this.value, `hello **world**.`);
|
||||
assert.equal(textarea.selectionStart, 8);
|
||||
assert.equal(textarea.selectionEnd, 13);
|
||||
|
||||
await click(`button.bold`);
|
||||
assert.equal(this.value, "hello world.");
|
||||
assert.equal(textarea.selectionStart, 6);
|
||||
assert.equal(textarea.selectionEnd, 11);
|
||||
});
|
||||
|
||||
testCase(`bold with a multiline selection`, async function (assert, textarea) {
|
||||
this.set("value", "hello\n\nworld\n\ntest.");
|
||||
|
||||
textarea.selectionStart = 0;
|
||||
textarea.selectionEnd = 12;
|
||||
|
||||
await click(`button.bold`);
|
||||
assert.equal(this.value, `**hello**\n\n**world**\n\ntest.`);
|
||||
assert.equal(textarea.selectionStart, 0);
|
||||
assert.equal(textarea.selectionEnd, 20);
|
||||
|
||||
await click(`button.bold`);
|
||||
assert.equal(this.value, `hello\n\nworld\n\ntest.`);
|
||||
assert.equal(textarea.selectionStart, 0);
|
||||
assert.equal(textarea.selectionEnd, 12);
|
||||
});
|
||||
|
||||
testCase(`italic button with no selection`, async function (assert, textarea) {
|
||||
await click(`button.italic`);
|
||||
const example = I18n.t(`composer.italic_text`);
|
||||
assert.equal(this.value, `hello world.*${example}*`);
|
||||
|
||||
assert.equal(textarea.selectionStart, 13);
|
||||
assert.equal(textarea.selectionEnd, 13 + example.length);
|
||||
});
|
||||
|
||||
testCase(`italic button with a selection`, async function (assert, textarea) {
|
||||
textarea.selectionStart = 6;
|
||||
textarea.selectionEnd = 11;
|
||||
|
||||
await click(`button.italic`);
|
||||
assert.equal(this.value, `hello *world*.`);
|
||||
assert.equal(textarea.selectionStart, 7);
|
||||
assert.equal(textarea.selectionEnd, 12);
|
||||
|
||||
await click(`button.italic`);
|
||||
assert.equal(this.value, "hello world.");
|
||||
assert.equal(textarea.selectionStart, 6);
|
||||
assert.equal(textarea.selectionEnd, 11);
|
||||
});
|
||||
|
||||
testCase(`italic with a multiline selection`, async function (
|
||||
assert,
|
||||
textarea
|
||||
) {
|
||||
this.set("value", "hello\n\nworld\n\ntest.");
|
||||
|
||||
textarea.selectionStart = 0;
|
||||
textarea.selectionEnd = 12;
|
||||
|
||||
await click(`button.italic`);
|
||||
assert.equal(this.value, `*hello*\n\n*world*\n\ntest.`);
|
||||
assert.equal(textarea.selectionStart, 0);
|
||||
assert.equal(textarea.selectionEnd, 16);
|
||||
|
||||
await click(`button.italic`);
|
||||
assert.equal(this.value, `hello\n\nworld\n\ntest.`);
|
||||
assert.equal(textarea.selectionStart, 0);
|
||||
assert.equal(textarea.selectionEnd, 12);
|
||||
});
|
||||
|
||||
componentTest("advanced code", {
|
||||
template: "{{d-editor value=value}}",
|
||||
beforeEach() {
|
||||
this.siteSettings.code_formatting_style = "4-spaces-indent";
|
||||
this.set(
|
||||
"value",
|
||||
`
|
||||
function xyz(x, y, z) {
|
||||
if (y === z) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
`
|
||||
);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
const textarea = find("textarea.d-editor-input")[0];
|
||||
textarea.selectionStart = 0;
|
||||
textarea.selectionEnd = textarea.value.length;
|
||||
|
||||
await click("button.code");
|
||||
assert.equal(
|
||||
this.value,
|
||||
`
|
||||
function xyz(x, y, z) {
|
||||
if (y === z) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
`
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("code button", {
|
||||
template: "{{d-editor value=value}}",
|
||||
beforeEach() {
|
||||
this.siteSettings.code_formatting_style = "4-spaces-indent";
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
const textarea = jumpEnd(find("textarea.d-editor-input")[0]);
|
||||
|
||||
await click("button.code");
|
||||
assert.equal(this.value, ` ${I18n.t("composer.code_text")}`);
|
||||
|
||||
this.set("value", "first line\n\nsecond line\n\nthird line");
|
||||
|
||||
textarea.selectionStart = 11;
|
||||
textarea.selectionEnd = 11;
|
||||
|
||||
await click("button.code");
|
||||
assert.equal(
|
||||
this.value,
|
||||
`first line
|
||||
${I18n.t("composer.code_text")}
|
||||
second line
|
||||
|
||||
third line`
|
||||
);
|
||||
|
||||
this.set("value", "first line\n\nsecond line\n\nthird line");
|
||||
|
||||
await click("button.code");
|
||||
assert.equal(
|
||||
this.value,
|
||||
`first line
|
||||
|
||||
second line
|
||||
|
||||
third line\`${I18n.t("composer.code_title")}\``
|
||||
);
|
||||
this.set("value", "first line\n\nsecond line\n\nthird line");
|
||||
|
||||
textarea.selectionStart = 5;
|
||||
textarea.selectionEnd = 5;
|
||||
|
||||
await click("button.code");
|
||||
assert.equal(
|
||||
this.value,
|
||||
`first\`${I18n.t("composer.code_title")}\` line
|
||||
|
||||
second line
|
||||
|
||||
third line`
|
||||
);
|
||||
this.set("value", "first line\n\nsecond line\n\nthird line");
|
||||
|
||||
textarea.selectionStart = 6;
|
||||
textarea.selectionEnd = 10;
|
||||
|
||||
await click("button.code");
|
||||
assert.equal(this.value, "first `line`\n\nsecond line\n\nthird line");
|
||||
assert.equal(textarea.selectionStart, 7);
|
||||
assert.equal(textarea.selectionEnd, 11);
|
||||
|
||||
await click("button.code");
|
||||
assert.equal(this.value, "first line\n\nsecond line\n\nthird line");
|
||||
assert.equal(textarea.selectionStart, 6);
|
||||
assert.equal(textarea.selectionEnd, 10);
|
||||
|
||||
textarea.selectionStart = 0;
|
||||
textarea.selectionEnd = 23;
|
||||
|
||||
await click("button.code");
|
||||
assert.equal(this.value, " first line\n\n second line\n\nthird line");
|
||||
assert.equal(textarea.selectionStart, 0);
|
||||
assert.equal(textarea.selectionEnd, 31);
|
||||
|
||||
await click("button.code");
|
||||
assert.equal(this.value, "first line\n\nsecond line\n\nthird line");
|
||||
assert.equal(textarea.selectionStart, 0);
|
||||
assert.equal(textarea.selectionEnd, 23);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("code fences", {
|
||||
template: "{{d-editor value=value}}",
|
||||
beforeEach() {
|
||||
this.set("value", "");
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
const textarea = jumpEnd(find("textarea.d-editor-input")[0]);
|
||||
|
||||
await click("button.code");
|
||||
assert.equal(
|
||||
this.value,
|
||||
`\`\`\`
|
||||
${I18n.t("composer.paste_code_text")}
|
||||
\`\`\``
|
||||
);
|
||||
|
||||
assert.equal(textarea.selectionStart, 4);
|
||||
assert.equal(textarea.selectionEnd, 27);
|
||||
|
||||
this.set("value", "first line\nsecond line\nthird line");
|
||||
|
||||
textarea.selectionStart = 0;
|
||||
textarea.selectionEnd = textarea.value.length;
|
||||
|
||||
await click("button.code");
|
||||
|
||||
assert.equal(
|
||||
this.value,
|
||||
`\`\`\`
|
||||
first line
|
||||
second line
|
||||
third line
|
||||
\`\`\`
|
||||
`
|
||||
);
|
||||
|
||||
assert.equal(textarea.selectionStart, textarea.value.length);
|
||||
assert.equal(textarea.selectionEnd, textarea.value.length);
|
||||
|
||||
this.set("value", "first line\nsecond line\nthird line");
|
||||
|
||||
textarea.selectionStart = 0;
|
||||
textarea.selectionEnd = 0;
|
||||
|
||||
await click("button.code");
|
||||
|
||||
assert.equal(
|
||||
this.value,
|
||||
`\`${I18n.t("composer.code_title")}\`first line
|
||||
second line
|
||||
third line`
|
||||
);
|
||||
|
||||
assert.equal(textarea.selectionStart, 1);
|
||||
assert.equal(
|
||||
textarea.selectionEnd,
|
||||
I18n.t("composer.code_title").length + 1
|
||||
);
|
||||
|
||||
this.set("value", "first line\nsecond line\nthird line");
|
||||
|
||||
textarea.selectionStart = 0;
|
||||
textarea.selectionEnd = 10;
|
||||
|
||||
await click("button.code");
|
||||
|
||||
assert.equal(
|
||||
this.value,
|
||||
`\`first line\`
|
||||
second line
|
||||
third line`
|
||||
);
|
||||
|
||||
assert.equal(textarea.selectionStart, 1);
|
||||
assert.equal(textarea.selectionEnd, 11);
|
||||
|
||||
this.set("value", "first line\nsecond line\nthird line");
|
||||
|
||||
textarea.selectionStart = 0;
|
||||
textarea.selectionEnd = 23;
|
||||
|
||||
await click("button.code");
|
||||
|
||||
assert.equal(
|
||||
this.value,
|
||||
`\`\`\`
|
||||
first line
|
||||
second line
|
||||
\`\`\`
|
||||
third line`
|
||||
);
|
||||
|
||||
assert.equal(textarea.selectionStart, 30);
|
||||
assert.equal(textarea.selectionEnd, 30);
|
||||
|
||||
this.set("value", "first line\nsecond line\nthird line");
|
||||
|
||||
textarea.selectionStart = 6;
|
||||
textarea.selectionEnd = 17;
|
||||
|
||||
await click("button.code");
|
||||
|
||||
assert.equal(
|
||||
this.value,
|
||||
`first \n\`\`\`\nline\nsecond\n\`\`\`\n line\nthird line`
|
||||
);
|
||||
|
||||
assert.equal(textarea.selectionStart, 27);
|
||||
assert.equal(textarea.selectionEnd, 27);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("quote button - empty lines", {
|
||||
template: "{{d-editor value=value composerEvents=true}}",
|
||||
beforeEach() {
|
||||
this.set("value", "one\n\ntwo\n\nthree");
|
||||
},
|
||||
async test(assert) {
|
||||
const textarea = jumpEnd(find("textarea.d-editor-input")[0]);
|
||||
|
||||
textarea.selectionStart = 0;
|
||||
|
||||
await click("button.quote");
|
||||
|
||||
assert.equal(this.value, "> one\n> \n> two\n> \n> three");
|
||||
assert.equal(textarea.selectionStart, 0);
|
||||
assert.equal(textarea.selectionEnd, 25);
|
||||
|
||||
await click("button.quote");
|
||||
assert.equal(this.value, "one\n\ntwo\n\nthree");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("quote button - selecting empty lines", {
|
||||
template: "{{d-editor value=value composerEvents=true}}",
|
||||
beforeEach() {
|
||||
this.set("value", "one\n\n\n\ntwo");
|
||||
},
|
||||
async test(assert) {
|
||||
const textarea = jumpEnd(find("textarea.d-editor-input")[0]);
|
||||
|
||||
textarea.selectionStart = 6;
|
||||
textarea.selectionEnd = 10;
|
||||
|
||||
await click("button.quote");
|
||||
assert.equal(this.value, "one\n\n\n> \n> two");
|
||||
},
|
||||
});
|
||||
|
||||
testCase("quote button", async function (assert, textarea) {
|
||||
textarea.selectionStart = 6;
|
||||
textarea.selectionEnd = 9;
|
||||
|
||||
await click("button.quote");
|
||||
assert.equal(this.value, "hello\n\n> wor\n\nld.");
|
||||
assert.equal(textarea.selectionStart, 7);
|
||||
assert.equal(textarea.selectionEnd, 12);
|
||||
|
||||
await click("button.quote");
|
||||
|
||||
assert.equal(this.value, "hello\n\nwor\n\nld.");
|
||||
assert.equal(textarea.selectionStart, 7);
|
||||
assert.equal(textarea.selectionEnd, 10);
|
||||
|
||||
textarea.selectionStart = 15;
|
||||
textarea.selectionEnd = 15;
|
||||
|
||||
await click("button.quote");
|
||||
assert.equal(this.value, "hello\n\nwor\n\nld.\n\n> Blockquote");
|
||||
});
|
||||
|
||||
testCase(`bullet button with no selection`, async function (assert, textarea) {
|
||||
const example = I18n.t("composer.list_item");
|
||||
|
||||
await click(`button.bullet`);
|
||||
assert.equal(this.value, `hello world.\n\n* ${example}`);
|
||||
assert.equal(textarea.selectionStart, 14);
|
||||
assert.equal(textarea.selectionEnd, 16 + example.length);
|
||||
|
||||
await click(`button.bullet`);
|
||||
assert.equal(this.value, `hello world.\n\n${example}`);
|
||||
});
|
||||
|
||||
testCase(`bullet button with a selection`, async function (assert, textarea) {
|
||||
textarea.selectionStart = 6;
|
||||
textarea.selectionEnd = 11;
|
||||
|
||||
await click(`button.bullet`);
|
||||
assert.equal(this.value, `hello\n\n* world\n\n.`);
|
||||
assert.equal(textarea.selectionStart, 7);
|
||||
assert.equal(textarea.selectionEnd, 14);
|
||||
|
||||
await click(`button.bullet`);
|
||||
assert.equal(this.value, `hello\n\nworld\n\n.`);
|
||||
assert.equal(textarea.selectionStart, 7);
|
||||
assert.equal(textarea.selectionEnd, 12);
|
||||
});
|
||||
|
||||
testCase(`bullet button with a multiple line selection`, async function (
|
||||
assert,
|
||||
textarea
|
||||
) {
|
||||
this.set("value", "* Hello\n\nWorld\n\nEvil");
|
||||
|
||||
textarea.selectionStart = 0;
|
||||
textarea.selectionEnd = 20;
|
||||
|
||||
await click(`button.bullet`);
|
||||
assert.equal(this.value, "Hello\n\nWorld\n\nEvil");
|
||||
assert.equal(textarea.selectionStart, 0);
|
||||
assert.equal(textarea.selectionEnd, 18);
|
||||
|
||||
await click(`button.bullet`);
|
||||
assert.equal(this.value, "* Hello\n\n* World\n\n* Evil");
|
||||
assert.equal(textarea.selectionStart, 0);
|
||||
assert.equal(textarea.selectionEnd, 24);
|
||||
});
|
||||
|
||||
testCase(`list button with no selection`, async function (assert, textarea) {
|
||||
const example = I18n.t("composer.list_item");
|
||||
|
||||
await click(`button.list`);
|
||||
assert.equal(this.value, `hello world.\n\n1. ${example}`);
|
||||
assert.equal(textarea.selectionStart, 14);
|
||||
assert.equal(textarea.selectionEnd, 17 + example.length);
|
||||
|
||||
await click(`button.list`);
|
||||
assert.equal(this.value, `hello world.\n\n${example}`);
|
||||
assert.equal(textarea.selectionStart, 14);
|
||||
assert.equal(textarea.selectionEnd, 14 + example.length);
|
||||
});
|
||||
|
||||
testCase(`list button with a selection`, async function (assert, textarea) {
|
||||
textarea.selectionStart = 6;
|
||||
textarea.selectionEnd = 11;
|
||||
|
||||
await click(`button.list`);
|
||||
assert.equal(this.value, `hello\n\n1. world\n\n.`);
|
||||
assert.equal(textarea.selectionStart, 7);
|
||||
assert.equal(textarea.selectionEnd, 15);
|
||||
|
||||
await click(`button.list`);
|
||||
assert.equal(this.value, `hello\n\nworld\n\n.`);
|
||||
assert.equal(textarea.selectionStart, 7);
|
||||
assert.equal(textarea.selectionEnd, 12);
|
||||
});
|
||||
|
||||
testCase(`list button with line sequence`, async function (assert, textarea) {
|
||||
this.set("value", "Hello\n\nWorld\n\nEvil");
|
||||
|
||||
textarea.selectionStart = 0;
|
||||
textarea.selectionEnd = 18;
|
||||
|
||||
await click(`button.list`);
|
||||
assert.equal(this.value, "1. Hello\n\n2. World\n\n3. Evil");
|
||||
assert.equal(textarea.selectionStart, 0);
|
||||
assert.equal(textarea.selectionEnd, 27);
|
||||
|
||||
await click(`button.list`);
|
||||
assert.equal(this.value, "Hello\n\nWorld\n\nEvil");
|
||||
assert.equal(textarea.selectionStart, 0);
|
||||
assert.equal(textarea.selectionEnd, 18);
|
||||
});
|
||||
|
||||
componentTest("clicking the toggle-direction changes dir from ltr to rtl", {
|
||||
template: "{{d-editor value=value}}",
|
||||
beforeEach() {
|
||||
this.siteSettings.support_mixed_text_direction = true;
|
||||
this.siteSettings.default_locale = "en_US";
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
const textarea = find("textarea.d-editor-input");
|
||||
await click("button.toggle-direction");
|
||||
assert.equal(textarea.attr("dir"), "rtl");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("clicking the toggle-direction changes dir from ltr to rtl", {
|
||||
template: "{{d-editor value=value}}",
|
||||
beforeEach() {
|
||||
this.siteSettings.support_mixed_text_direction = true;
|
||||
this.siteSettings.default_locale = "en_US";
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
const textarea = find("textarea.d-editor-input");
|
||||
textarea.attr("dir", "ltr");
|
||||
await click("button.toggle-direction");
|
||||
assert.equal(textarea.attr("dir"), "rtl");
|
||||
},
|
||||
});
|
||||
|
||||
testCase(`doesn't jump to bottom with long text`, async function (
|
||||
assert,
|
||||
textarea
|
||||
) {
|
||||
let longText = "hello world.";
|
||||
for (let i = 0; i < 8; i++) {
|
||||
longText = longText + longText;
|
||||
}
|
||||
this.set("value", longText);
|
||||
|
||||
$(textarea).scrollTop(0);
|
||||
textarea.selectionStart = 3;
|
||||
textarea.selectionEnd = 3;
|
||||
|
||||
await click("button.bold");
|
||||
assert.equal($(textarea).scrollTop(), 0, "it stays scrolled up");
|
||||
});
|
||||
|
||||
componentTest("emoji", {
|
||||
template: "{{d-editor value=value}}",
|
||||
beforeEach() {
|
||||
// Test adding a custom button
|
||||
withPluginApi("0.1", (api) => {
|
||||
api.onToolbarCreate((toolbar) => {
|
||||
toolbar.addButton({
|
||||
id: "emoji",
|
||||
group: "extras",
|
||||
icon: "far-smile",
|
||||
action: () => toolbar.context.send("emoji"),
|
||||
});
|
||||
});
|
||||
});
|
||||
this.set("value", "hello world.");
|
||||
},
|
||||
|
||||
afterEach() {
|
||||
clearToolbarCallbacks();
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
jumpEnd(find("textarea.d-editor-input")[0]);
|
||||
await click("button.emoji");
|
||||
|
||||
await click(
|
||||
'.emoji-picker .section[data-section="smileys_&_emotion"] img.emoji[title="grinning"]'
|
||||
);
|
||||
assert.equal(this.value, "hello world. :grinning:");
|
||||
},
|
||||
});
|
||||
|
||||
testCase("replace-text event by default", async function (assert) {
|
||||
this.set("value", "red green blue");
|
||||
|
||||
await this.container
|
||||
.lookup("service:app-events")
|
||||
.trigger("composer:replace-text", "green", "yellow");
|
||||
|
||||
assert.equal(this.value, "red green blue");
|
||||
});
|
||||
|
||||
composerTestCase("replace-text event for composer", async function (assert) {
|
||||
this.set("value", "red green blue");
|
||||
|
||||
await this.container
|
||||
.lookup("service:app-events")
|
||||
.trigger("composer:replace-text", "green", "yellow");
|
||||
|
||||
assert.equal(this.value, "red yellow blue");
|
||||
});
|
||||
|
||||
(() => {
|
||||
// Tests to check cursor/selection after replace-text event.
|
||||
const BEFORE = "red green blue";
|
||||
const NEEDLE = "green";
|
||||
const REPLACE = "yellow";
|
||||
const AFTER = BEFORE.replace(NEEDLE, REPLACE);
|
||||
|
||||
const CASES = [
|
||||
{
|
||||
description: "cursor at start remains there",
|
||||
before: [0, 0],
|
||||
after: [0, 0],
|
||||
},
|
||||
{
|
||||
description: "cursor before needle becomes cursor before replacement",
|
||||
before: [BEFORE.indexOf(NEEDLE), 0],
|
||||
after: [AFTER.indexOf(REPLACE), 0],
|
||||
},
|
||||
{
|
||||
description: "cursor at needle start + 1 moves behind replacement",
|
||||
before: [BEFORE.indexOf(NEEDLE) + 1, 0],
|
||||
after: [AFTER.indexOf(REPLACE) + REPLACE.length, 0],
|
||||
},
|
||||
{
|
||||
description: "cursor at needle end - 1 stays behind replacement",
|
||||
before: [BEFORE.indexOf(NEEDLE) + NEEDLE.length - 1, 0],
|
||||
after: [AFTER.indexOf(REPLACE) + REPLACE.length, 0],
|
||||
},
|
||||
{
|
||||
description: "cursor behind needle becomes cursor behind replacement",
|
||||
before: [BEFORE.indexOf(NEEDLE) + NEEDLE.length, 0],
|
||||
after: [AFTER.indexOf(REPLACE) + REPLACE.length, 0],
|
||||
},
|
||||
{
|
||||
description: "cursor at end remains there",
|
||||
before: [BEFORE.length, 0],
|
||||
after: [AFTER.length, 0],
|
||||
},
|
||||
{
|
||||
description:
|
||||
"selection spanning needle start becomes selection until replacement start",
|
||||
before: [BEFORE.indexOf(NEEDLE) - 1, 2],
|
||||
after: [AFTER.indexOf(REPLACE) - 1, 1],
|
||||
},
|
||||
{
|
||||
description:
|
||||
"selection spanning needle end becomes selection from replacement end",
|
||||
before: [BEFORE.indexOf(NEEDLE) + NEEDLE.length - 1, 2],
|
||||
after: [AFTER.indexOf(REPLACE) + REPLACE.length, 1],
|
||||
},
|
||||
{
|
||||
description:
|
||||
"selection spanning needle becomes selection spanning replacement",
|
||||
before: [BEFORE.indexOf(NEEDLE) - 1, NEEDLE.length + 2],
|
||||
after: [AFTER.indexOf(REPLACE) - 1, REPLACE.length + 2],
|
||||
},
|
||||
{
|
||||
description: "complete selection remains complete",
|
||||
before: [0, BEFORE.length],
|
||||
after: [0, AFTER.length],
|
||||
},
|
||||
];
|
||||
|
||||
for (let i = 0; i < CASES.length; i++) {
|
||||
const CASE = CASES[i];
|
||||
// prettier-ignore
|
||||
composerTestCase(`replace-text event: ${CASE.description}`, async function( // eslint-disable-line no-loop-func
|
||||
assert,
|
||||
textarea
|
||||
) {
|
||||
this.set("value", BEFORE);
|
||||
|
||||
await focus(textarea);
|
||||
|
||||
assert.ok(textarea.value === BEFORE);
|
||||
|
||||
const [start, len] = CASE.before;
|
||||
setTextareaSelection(textarea, start, start + len);
|
||||
|
||||
this.container
|
||||
.lookup("service:app-events")
|
||||
.trigger("composer:replace-text", "green", "yellow", { forceFocus: true });
|
||||
|
||||
next(() => {
|
||||
let expect = formatTextWithSelection(AFTER, CASE.after);
|
||||
let actual = formatTextWithSelection(
|
||||
this.value,
|
||||
getTextareaSelection(textarea)
|
||||
);
|
||||
assert.equal(actual, expect);
|
||||
});
|
||||
});
|
||||
}
|
||||
})();
|
||||
@@ -0,0 +1,27 @@
|
||||
import componentTest from "helpers/component-test";
|
||||
|
||||
moduleForComponent("d-icon", { integration: true });
|
||||
|
||||
componentTest("default", {
|
||||
template: '<div class="test">{{d-icon "bars"}}</div>',
|
||||
|
||||
test(assert) {
|
||||
const html = find(".test").html().trim();
|
||||
assert.equal(
|
||||
html,
|
||||
'<svg class="fa d-icon d-icon-bars svg-icon svg-string" xmlns="http://www.w3.org/2000/svg"><use xlink:href="#bars"></use></svg>'
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("with replacement", {
|
||||
template: '<div class="test">{{d-icon "d-watching"}}</div>',
|
||||
|
||||
test(assert) {
|
||||
const html = find(".test").html().trim();
|
||||
assert.equal(
|
||||
html,
|
||||
'<svg class="fa d-icon d-icon-d-watching svg-icon svg-string" xmlns="http://www.w3.org/2000/svg"><use xlink:href="#discourse-bell-exclamation"></use></svg>'
|
||||
);
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,65 @@
|
||||
import componentTest from "helpers/component-test";
|
||||
|
||||
moduleForComponent("date-input", { integration: true });
|
||||
|
||||
function dateInput() {
|
||||
return find(".date-picker");
|
||||
}
|
||||
|
||||
function setDate(date) {
|
||||
this.set("date", date);
|
||||
}
|
||||
|
||||
async function pika(year, month, day) {
|
||||
await click(
|
||||
`.pika-button.pika-day[data-pika-year="${year}"][data-pika-month="${month}"][data-pika-day="${day}"]`
|
||||
);
|
||||
}
|
||||
|
||||
function noop() {}
|
||||
|
||||
const DEFAULT_DATE = moment("2019-01-29");
|
||||
|
||||
componentTest("default", {
|
||||
template: `{{date-input date=date}}`,
|
||||
|
||||
beforeEach() {
|
||||
this.setProperties({ date: DEFAULT_DATE });
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
assert.equal(dateInput().val(), "January 29, 2019");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("prevents mutations", {
|
||||
template: `{{date-input date=date onChange=onChange}}`,
|
||||
|
||||
beforeEach() {
|
||||
this.setProperties({ date: DEFAULT_DATE });
|
||||
this.set("onChange", noop);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await click(dateInput());
|
||||
await pika(2019, 0, 2);
|
||||
|
||||
assert.ok(this.date.isSame(DEFAULT_DATE));
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("allows mutations through actions", {
|
||||
template: `{{date-input date=date onChange=onChange}}`,
|
||||
|
||||
beforeEach() {
|
||||
this.setProperties({ date: DEFAULT_DATE });
|
||||
this.set("onChange", setDate);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await click(dateInput());
|
||||
await pika(2019, 0, 2);
|
||||
|
||||
assert.ok(this.date.isSame(moment("2019-01-02")));
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,36 @@
|
||||
import componentTest from "helpers/component-test";
|
||||
|
||||
moduleForComponent("date-time-input-range", { integration: true });
|
||||
|
||||
function fromDateInput() {
|
||||
return find(".from.d-date-time-input .date-picker")[0];
|
||||
}
|
||||
|
||||
function fromTimeInput() {
|
||||
return find(".from.d-date-time-input .d-time-input .combo-box-header")[0];
|
||||
}
|
||||
|
||||
function toDateInput() {
|
||||
return find(".to.d-date-time-input .date-picker")[0];
|
||||
}
|
||||
|
||||
function toTimeInput() {
|
||||
return find(".to.d-date-time-input .d-time-input .combo-box-header")[0];
|
||||
}
|
||||
|
||||
const DEFAULT_DATE_TIME = moment("2019-01-29 14:45");
|
||||
|
||||
componentTest("default", {
|
||||
template: `{{date-time-input-range from=from to=to}}`,
|
||||
|
||||
beforeEach() {
|
||||
this.setProperties({ from: DEFAULT_DATE_TIME, to: null });
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
assert.equal(fromDateInput().value, "January 29, 2019");
|
||||
assert.equal(fromTimeInput().dataset.name, "14:45");
|
||||
assert.equal(toDateInput().value, "");
|
||||
assert.equal(toTimeInput().dataset.name, "--:--");
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,79 @@
|
||||
import componentTest from "helpers/component-test";
|
||||
|
||||
moduleForComponent("date-time-input", { integration: true });
|
||||
|
||||
function dateInput() {
|
||||
return find(".date-picker")[0];
|
||||
}
|
||||
|
||||
function timeInput() {
|
||||
return find(".d-time-input .combo-box-header")[0];
|
||||
}
|
||||
|
||||
function setDate(date) {
|
||||
this.set("date", date);
|
||||
}
|
||||
|
||||
async function pika(year, month, day) {
|
||||
await click(
|
||||
`.pika-button.pika-day[data-pika-year="${year}"][data-pika-month="${month}"][data-pika-day="${day}"]`
|
||||
);
|
||||
}
|
||||
|
||||
const DEFAULT_DATE_TIME = moment("2019-01-29 14:45");
|
||||
|
||||
componentTest("default", {
|
||||
template: `{{date-time-input date=date}}`,
|
||||
|
||||
beforeEach() {
|
||||
this.setProperties({ date: DEFAULT_DATE_TIME });
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
assert.equal(dateInput().value, "January 29, 2019");
|
||||
assert.equal(timeInput().dataset.name, "14:45");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("prevents mutations", {
|
||||
template: `{{date-time-input date=date}}`,
|
||||
|
||||
beforeEach() {
|
||||
this.setProperties({ date: DEFAULT_DATE_TIME });
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await click(dateInput());
|
||||
await pika(2019, 0, 2);
|
||||
|
||||
assert.ok(this.date.isSame(DEFAULT_DATE_TIME));
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("allows mutations through actions", {
|
||||
template: `{{date-time-input date=date onChange=onChange}}`,
|
||||
|
||||
beforeEach() {
|
||||
this.setProperties({ date: DEFAULT_DATE_TIME });
|
||||
this.set("onChange", setDate);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await click(dateInput());
|
||||
await pika(2019, 0, 2);
|
||||
|
||||
assert.ok(this.date.isSame(moment("2019-01-02 14:45")));
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("can hide time", {
|
||||
template: `{{date-time-input date=date showTime=false}}`,
|
||||
|
||||
beforeEach() {
|
||||
this.setProperties({ date: DEFAULT_DATE_TIME });
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
assert.notOk(exists(timeInput()));
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,93 @@
|
||||
moduleFor("component:group-membership-button");
|
||||
|
||||
QUnit.test("canJoinGroup", function (assert) {
|
||||
this.subject().setProperties({
|
||||
model: { public_admission: false, is_group_user: true },
|
||||
});
|
||||
|
||||
assert.equal(
|
||||
this.subject().get("canJoinGroup"),
|
||||
false,
|
||||
"can't join group if public_admission is false"
|
||||
);
|
||||
|
||||
this.subject().set("model.public_admission", true);
|
||||
|
||||
assert.equal(
|
||||
this.subject().get("canJoinGroup"),
|
||||
false,
|
||||
"can't join group if user is already in the group"
|
||||
);
|
||||
|
||||
this.subject().set("model.is_group_user", false);
|
||||
|
||||
assert.equal(
|
||||
this.subject().get("canJoinGroup"),
|
||||
true,
|
||||
"allowed to join group"
|
||||
);
|
||||
});
|
||||
|
||||
QUnit.test("canLeaveGroup", function (assert) {
|
||||
this.subject().setProperties({
|
||||
model: { public_exit: false, is_group_user: false },
|
||||
});
|
||||
|
||||
assert.equal(
|
||||
this.subject().get("canLeaveGroup"),
|
||||
false,
|
||||
"can't leave group if public_exit is false"
|
||||
);
|
||||
|
||||
this.subject().set("model.public_exit", true);
|
||||
|
||||
assert.equal(
|
||||
this.subject().get("canLeaveGroup"),
|
||||
false,
|
||||
"can't leave group if user is not in the group"
|
||||
);
|
||||
|
||||
this.subject().set("model.is_group_user", true);
|
||||
|
||||
assert.equal(
|
||||
this.subject().get("canLeaveGroup"),
|
||||
true,
|
||||
"allowed to leave group"
|
||||
);
|
||||
});
|
||||
|
||||
QUnit.test("canRequestMembership", function (assert) {
|
||||
this.subject().setProperties({
|
||||
model: { allow_membership_requests: true, is_group_user: true },
|
||||
});
|
||||
|
||||
assert.equal(
|
||||
this.subject().get("canRequestMembership"),
|
||||
false,
|
||||
"can't request for membership if user is already in the group"
|
||||
);
|
||||
|
||||
this.subject().set("model.is_group_user", false);
|
||||
|
||||
assert.equal(
|
||||
this.subject().get("canRequestMembership"),
|
||||
true,
|
||||
"allowed to request for group membership"
|
||||
);
|
||||
});
|
||||
|
||||
QUnit.test("userIsGroupUser", function (assert) {
|
||||
this.subject().setProperties({
|
||||
model: { is_group_user: true },
|
||||
});
|
||||
|
||||
assert.equal(this.subject().get("userIsGroupUser"), true);
|
||||
|
||||
this.subject().set("model.is_group_user", false);
|
||||
|
||||
assert.equal(this.subject().get("userIsGroupUser"), false);
|
||||
|
||||
this.subject().set("model.is_group_user", null);
|
||||
|
||||
assert.equal(this.subject().get("userIsGroupUser"), false);
|
||||
});
|
||||
@@ -0,0 +1,36 @@
|
||||
import componentTest from "helpers/component-test";
|
||||
|
||||
const LONG_CODE_BLOCK = "puts a\n".repeat(15000);
|
||||
|
||||
moduleForComponent("highlighted-code", { integration: true });
|
||||
|
||||
componentTest("highlighting code", {
|
||||
template: "{{highlighted-code lang='ruby' code=code}}",
|
||||
|
||||
beforeEach() {
|
||||
this.session.highlightJsPath =
|
||||
"assets/highlightjs/highlight-test-bundle.min.js";
|
||||
this.set("code", "def test; end");
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
assert.equal(
|
||||
find("code.ruby.hljs .hljs-function .hljs-keyword").text().trim(),
|
||||
"def"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("large code blocks are not highlighted", {
|
||||
template: "{{highlighted-code lang='ruby' code=code}}",
|
||||
|
||||
beforeEach() {
|
||||
this.session.highlightJsPath =
|
||||
"assets/highlightjs/highlight-test-bundle.min.js";
|
||||
this.set("code", LONG_CODE_BLOCK);
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
assert.equal(find("code").text().trim(), LONG_CODE_BLOCK.trim());
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,14 @@
|
||||
import componentTest from "helpers/component-test";
|
||||
moduleForComponent("html-safe-helper", { integration: true });
|
||||
|
||||
componentTest("default", {
|
||||
template: "{{html-safe string}}",
|
||||
|
||||
beforeEach() {
|
||||
this.set("string", "<p class='cookies'>biscuits</p>");
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
assert.ok(exists("p.cookies"), "it displays the string as html");
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,23 @@
|
||||
import componentTest from "helpers/component-test";
|
||||
|
||||
moduleForComponent("iframed-html", { integration: true });
|
||||
|
||||
componentTest("appends the html into the iframe", {
|
||||
template: `{{iframed-html html="<h1 id='find-me'>hello</h1>" className='this-is-an-iframe'}}`,
|
||||
|
||||
async test(assert) {
|
||||
const iframe = find("iframe.this-is-an-iframe");
|
||||
assert.equal(iframe.length, 1, "inserts an iframe");
|
||||
|
||||
assert.ok(
|
||||
iframe[0].classList.contains("this-is-an-iframe"),
|
||||
"Adds className to the iframes classList"
|
||||
);
|
||||
|
||||
assert.equal(
|
||||
iframe[0].contentWindow.document.body.querySelectorAll("#find-me").length,
|
||||
1,
|
||||
"inserts the passed in html into the iframe"
|
||||
);
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,89 @@
|
||||
import componentTest from "helpers/component-test";
|
||||
moduleForComponent("image-uploader", { integration: true });
|
||||
|
||||
componentTest("with image", {
|
||||
template:
|
||||
"{{image-uploader imageUrl='/images/avatar.png' placeholderUrl='/not/used.png'}}",
|
||||
|
||||
async test(assert) {
|
||||
assert.equal(
|
||||
find(".d-icon-far-image").length,
|
||||
1,
|
||||
"it displays the upload icon"
|
||||
);
|
||||
|
||||
assert.equal(
|
||||
find(".d-icon-far-trash-alt").length,
|
||||
1,
|
||||
"it displays the trash icon"
|
||||
);
|
||||
|
||||
assert.equal(
|
||||
find(".placeholder-overlay").length,
|
||||
0,
|
||||
"it does not display the placeholder image"
|
||||
);
|
||||
|
||||
await click(".image-uploader-lightbox-btn");
|
||||
|
||||
assert.equal(
|
||||
$(".mfp-container").length,
|
||||
1,
|
||||
"it displays the image lightbox"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("without image", {
|
||||
template: "{{image-uploader}}",
|
||||
|
||||
test(assert) {
|
||||
assert.equal(
|
||||
find(".d-icon-far-image").length,
|
||||
1,
|
||||
"it displays the upload icon"
|
||||
);
|
||||
|
||||
assert.equal(
|
||||
find(".d-icon-far-trash-alt").length,
|
||||
0,
|
||||
"it does not display trash icon"
|
||||
);
|
||||
|
||||
assert.equal(
|
||||
find(".image-uploader-lightbox-btn").length,
|
||||
0,
|
||||
"it does not display the button to open image lightbox"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("with placeholder", {
|
||||
template: "{{image-uploader placeholderUrl='/images/avatar.png'}}",
|
||||
|
||||
test(assert) {
|
||||
assert.equal(
|
||||
find(".d-icon-far-image").length,
|
||||
1,
|
||||
"it displays the upload icon"
|
||||
);
|
||||
|
||||
assert.equal(
|
||||
find(".d-icon-far-trash-alt").length,
|
||||
0,
|
||||
"it does not display trash icon"
|
||||
);
|
||||
|
||||
assert.equal(
|
||||
find(".image-uploader-lightbox-btn").length,
|
||||
0,
|
||||
"it does not display the button to open image lightbox"
|
||||
);
|
||||
|
||||
assert.equal(
|
||||
find(".placeholder-overlay").length,
|
||||
1,
|
||||
"it displays the placeholder image"
|
||||
);
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,154 @@
|
||||
import DiscourseURL from "discourse/lib/url";
|
||||
|
||||
var testMouseTrap;
|
||||
import KeyboardShortcuts from "discourse/lib/keyboard-shortcuts";
|
||||
|
||||
QUnit.module("lib:keyboard-shortcuts", {
|
||||
beforeEach() {
|
||||
var _bindings = {};
|
||||
|
||||
testMouseTrap = {
|
||||
bind: function (bindings, callback) {
|
||||
var registerBinding = function (binding) {
|
||||
_bindings[binding] = callback;
|
||||
}.bind(this);
|
||||
|
||||
if (Array.isArray(bindings)) {
|
||||
bindings.forEach(registerBinding, this);
|
||||
} else {
|
||||
registerBinding(bindings);
|
||||
}
|
||||
},
|
||||
|
||||
trigger: function (binding) {
|
||||
_bindings[binding].call();
|
||||
},
|
||||
};
|
||||
|
||||
sandbox.stub(DiscourseURL, "routeTo");
|
||||
|
||||
$("#qunit-fixture").html(
|
||||
[
|
||||
"<article class='topic-post selected'>",
|
||||
"<a class='post-date'></a>" + "</article>",
|
||||
"<div class='notification-options'>",
|
||||
" <ul>",
|
||||
" <li data-id='0'><a></a></li>",
|
||||
" <li data-id='1'><a></a></li>",
|
||||
" <li data-id='2'><a></a></li>",
|
||||
" <li data-id='3'><a></a></li>",
|
||||
" </ul>",
|
||||
"</div>",
|
||||
"<table class='topic-list'>",
|
||||
" <tr class='topic-list-item selected'><td>",
|
||||
" <a class='title'></a>",
|
||||
" </td></tr>",
|
||||
"</table>",
|
||||
"<div id='topic-footer-buttons'>",
|
||||
" <button class='star'></button>",
|
||||
" <button class='create'></button>",
|
||||
" <button class='share'></button>",
|
||||
" <button id='dismiss-new-top'></button>",
|
||||
" <button id='dismiss-topics-top'></button>",
|
||||
"</div>",
|
||||
"<div class='alert alert-info clickable'></div>",
|
||||
"<button id='create-topic'></button>",
|
||||
"<div id='user-notifications'></div>",
|
||||
"<div id='toggle-hamburger-menu'></div>",
|
||||
"<div id='search-button'></div>",
|
||||
"<div id='current-user'></div>",
|
||||
"<div id='keyboard-help'></div>",
|
||||
].join("\n")
|
||||
);
|
||||
},
|
||||
|
||||
afterEach() {
|
||||
$("#qunit-scratch").html("");
|
||||
testMouseTrap = undefined;
|
||||
},
|
||||
});
|
||||
|
||||
var pathBindings = KeyboardShortcuts.PATH_BINDINGS || {};
|
||||
Object.keys(pathBindings).forEach((path) => {
|
||||
const binding = pathBindings[path];
|
||||
var testName = binding + " goes to " + path;
|
||||
|
||||
test(testName, function (assert) {
|
||||
KeyboardShortcuts.bindEvents();
|
||||
testMouseTrap.trigger(binding);
|
||||
|
||||
assert.ok(DiscourseURL.routeTo.calledWith(path));
|
||||
});
|
||||
});
|
||||
|
||||
var clickBindings = KeyboardShortcuts.CLICK_BINDINGS || {};
|
||||
Object.keys(clickBindings).forEach((selector) => {
|
||||
const binding = clickBindings[selector];
|
||||
var bindings = binding.split(",");
|
||||
|
||||
var testName = binding + " clicks on " + selector;
|
||||
|
||||
test(testName, function (assert) {
|
||||
KeyboardShortcuts.bindEvents();
|
||||
$(selector).on("click", function () {
|
||||
assert.ok(true, selector + " was clicked");
|
||||
});
|
||||
|
||||
bindings.forEach(function (b) {
|
||||
testMouseTrap.trigger(b);
|
||||
}, this);
|
||||
});
|
||||
});
|
||||
|
||||
var functionBindings = KeyboardShortcuts.FUNCTION_BINDINGS || {};
|
||||
Object.keys(functionBindings).forEach((func) => {
|
||||
const binding = functionBindings[func];
|
||||
var testName = binding + " calls " + func;
|
||||
|
||||
test(testName, function (assert) {
|
||||
sandbox.stub(KeyboardShortcuts, func, function () {
|
||||
assert.ok(true, func + " is called when " + binding + " is triggered");
|
||||
});
|
||||
KeyboardShortcuts.bindEvents();
|
||||
|
||||
testMouseTrap.trigger(binding);
|
||||
});
|
||||
});
|
||||
|
||||
QUnit.test("selectDown calls _moveSelection with 1", (assert) => {
|
||||
var stub = sandbox.stub(KeyboardShortcuts, "_moveSelection");
|
||||
|
||||
KeyboardShortcuts.selectDown();
|
||||
assert.ok(stub.calledWith(1), "_moveSelection is called with 1");
|
||||
});
|
||||
|
||||
QUnit.test("selectUp calls _moveSelection with -1", (assert) => {
|
||||
var stub = sandbox.stub(KeyboardShortcuts, "_moveSelection");
|
||||
|
||||
KeyboardShortcuts.selectUp();
|
||||
assert.ok(stub.calledWith(-1), "_moveSelection is called with -1");
|
||||
});
|
||||
|
||||
QUnit.test("goBack calls history.back", (assert) => {
|
||||
var called = false;
|
||||
sandbox.stub(history, "back").callsFake(function () {
|
||||
called = true;
|
||||
});
|
||||
|
||||
KeyboardShortcuts.goBack();
|
||||
assert.ok(called, "history.back is called");
|
||||
});
|
||||
|
||||
QUnit.test("nextSection calls _changeSection with 1", (assert) => {
|
||||
var spy = sandbox.spy(KeyboardShortcuts, "_changeSection");
|
||||
|
||||
KeyboardShortcuts.nextSection();
|
||||
assert.ok(spy.calledWith(1), "_changeSection is called with 1");
|
||||
});
|
||||
|
||||
QUnit.test("prevSection calls _changeSection with -1", (assert) => {
|
||||
var spy = sandbox.spy(KeyboardShortcuts, "_changeSection");
|
||||
|
||||
KeyboardShortcuts.prevSection();
|
||||
assert.ok(spy.calledWith(-1), "_changeSection is called with -1");
|
||||
});
|
||||
@@ -0,0 +1,27 @@
|
||||
import { configureEyeline } from "discourse/lib/eyeline";
|
||||
import componentTest from "helpers/component-test";
|
||||
|
||||
moduleForComponent("load-more", { integration: true });
|
||||
|
||||
componentTest("updates once after initialization", {
|
||||
template: `
|
||||
{{#load-more selector=".numbers tr" action=loadMore}}
|
||||
<table class="numbers"><tr></tr></table>
|
||||
{{/load-more}}`,
|
||||
|
||||
beforeEach() {
|
||||
this.set("loadMore", () => this.set("loadedMore", true));
|
||||
configureEyeline({
|
||||
skipUpdate: false,
|
||||
rootElement: "#ember-testing",
|
||||
});
|
||||
},
|
||||
|
||||
afterEach() {
|
||||
configureEyeline();
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
assert.ok(this.loadedMore);
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,92 @@
|
||||
import I18n from "I18n";
|
||||
import componentTest from "helpers/component-test";
|
||||
moduleForComponent("secret-value-list", { integration: true });
|
||||
|
||||
componentTest("adding a value", {
|
||||
template: "{{secret-value-list values=values}}",
|
||||
|
||||
async test(assert) {
|
||||
this.set("values", "firstKey|FirstValue\nsecondKey|secondValue");
|
||||
|
||||
await fillIn(".new-value-input.key", "thirdKey");
|
||||
await click(".add-value-btn");
|
||||
|
||||
assert.ok(
|
||||
find(".values .value").length === 2,
|
||||
"it doesn't add the value to the list if secret is missing"
|
||||
);
|
||||
|
||||
await fillIn(".new-value-input.key", "");
|
||||
await fillIn(".new-value-input.secret", "thirdValue");
|
||||
await click(".add-value-btn");
|
||||
|
||||
assert.ok(
|
||||
find(".values .value").length === 2,
|
||||
"it doesn't add the value to the list if key is missing"
|
||||
);
|
||||
|
||||
await fillIn(".new-value-input.key", "thirdKey");
|
||||
await fillIn(".new-value-input.secret", "thirdValue");
|
||||
await click(".add-value-btn");
|
||||
|
||||
assert.ok(
|
||||
find(".values .value").length === 3,
|
||||
"it adds the value to the list of values"
|
||||
);
|
||||
|
||||
assert.deepEqual(
|
||||
this.values,
|
||||
"firstKey|FirstValue\nsecondKey|secondValue\nthirdKey|thirdValue",
|
||||
"it adds the value to the list of values"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("adding an invalid value", {
|
||||
template: "{{secret-value-list values=values}}",
|
||||
|
||||
async test(assert) {
|
||||
await fillIn(".new-value-input.key", "someString");
|
||||
await fillIn(".new-value-input.secret", "keyWithAPipe|Hidden");
|
||||
await click(".add-value-btn");
|
||||
|
||||
assert.ok(
|
||||
find(".values .value").length === 0,
|
||||
"it doesn't add the value to the list of values"
|
||||
);
|
||||
|
||||
assert.deepEqual(
|
||||
this.values,
|
||||
undefined,
|
||||
"it doesn't add the value to the list of values"
|
||||
);
|
||||
|
||||
assert.ok(
|
||||
find(".validation-error")
|
||||
.html()
|
||||
.indexOf(I18n.t("admin.site_settings.secret_list.invalid_input")) > -1,
|
||||
"it shows validation error"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("removing a value", {
|
||||
template: "{{secret-value-list values=values}}",
|
||||
|
||||
async test(assert) {
|
||||
this.set("values", "firstKey|FirstValue\nsecondKey|secondValue");
|
||||
|
||||
await click(".values .value[data-index='0'] .remove-value-btn");
|
||||
|
||||
assert.ok(
|
||||
find(".values .value").length === 1,
|
||||
"it removes the value from the list of values"
|
||||
);
|
||||
|
||||
assert.equal(
|
||||
this.values,
|
||||
"secondKey|secondValue",
|
||||
"it removes the expected value"
|
||||
);
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,115 @@
|
||||
import componentTest from "helpers/component-test";
|
||||
import selectKit, {
|
||||
testSelectKitModule,
|
||||
setDefaultState,
|
||||
DEFAULT_CONTENT,
|
||||
} from "helpers/select-kit-helper";
|
||||
import { withPluginApi } from "discourse/lib/plugin-api";
|
||||
import { clearCallbacks } from "select-kit/mixins/plugin-api";
|
||||
|
||||
testSelectKitModule("select-kit:api", {
|
||||
beforeEach() {
|
||||
this.setProperties({
|
||||
comboBox: selectKit(".combo-box"),
|
||||
singleSelect: selectKit(".single-select:not(.combo-box)"),
|
||||
});
|
||||
},
|
||||
|
||||
afterEach() {
|
||||
clearCallbacks();
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("modifySelectKit(identifier).appendContent", {
|
||||
template: `
|
||||
{{combo-box value=value content=content onChange=onChange}}
|
||||
{{single-select value=value content=content onChange=onChange}}
|
||||
`,
|
||||
|
||||
beforeEach() {
|
||||
setDefaultState(this, null, { content: DEFAULT_CONTENT });
|
||||
|
||||
withPluginApi("0.8.43", (api) => {
|
||||
api.modifySelectKit("combo-box").appendContent(() => {
|
||||
return {
|
||||
id: "alpaca",
|
||||
name: "Alpaca",
|
||||
};
|
||||
});
|
||||
api.modifySelectKit("combo-box").appendContent(() => {});
|
||||
});
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.comboBox.expand();
|
||||
|
||||
assert.equal(this.comboBox.rows().length, 4);
|
||||
|
||||
const appendedRow = this.comboBox.rowByIndex(3);
|
||||
assert.ok(appendedRow.exists());
|
||||
assert.equal(appendedRow.value(), "alpaca");
|
||||
|
||||
await this.comboBox.collapse();
|
||||
|
||||
assert.notOk(this.singleSelect.rowByValue("alpaca").exists());
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("modifySelectKit(identifier).prependContent", {
|
||||
template: `
|
||||
{{combo-box value=value content=content onChange=onChange}}
|
||||
{{single-select value=value content=content onChange=onChange}}
|
||||
`,
|
||||
|
||||
beforeEach() {
|
||||
setDefaultState(this, null, { content: DEFAULT_CONTENT });
|
||||
|
||||
withPluginApi("0.8.43", (api) => {
|
||||
api.modifySelectKit("combo-box").prependContent(() => {
|
||||
return {
|
||||
id: "alpaca",
|
||||
name: "Alpaca",
|
||||
};
|
||||
});
|
||||
api.modifySelectKit("combo-box").prependContent(() => {});
|
||||
});
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.comboBox.expand();
|
||||
|
||||
assert.equal(this.comboBox.rows().length, 4);
|
||||
|
||||
const prependedRow = this.comboBox.rowByIndex(0);
|
||||
assert.ok(prependedRow.exists());
|
||||
assert.equal(prependedRow.value(), "alpaca");
|
||||
|
||||
await this.comboBox.collapse();
|
||||
|
||||
assert.notOk(this.singleSelect.rowByValue("alpaca").exists());
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("modifySelectKit(identifier).onChange", {
|
||||
template: `
|
||||
<div id="test"></div>
|
||||
{{combo-box value=value content=content onChange=onChange}}
|
||||
`,
|
||||
|
||||
beforeEach() {
|
||||
setDefaultState(this, null, { content: DEFAULT_CONTENT });
|
||||
|
||||
withPluginApi("0.8.43", (api) => {
|
||||
api.modifySelectKit("combo-box").onChange((component, value, item) => {
|
||||
find("#test").text(item.name);
|
||||
});
|
||||
});
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.comboBox.expand();
|
||||
await this.comboBox.selectRowByIndex(0);
|
||||
|
||||
assert.equal(find("#test").text(), "foo");
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,146 @@
|
||||
import I18n from "I18n";
|
||||
import componentTest from "helpers/component-test";
|
||||
import { testSelectKitModule } from "helpers/select-kit-helper";
|
||||
|
||||
testSelectKitModule("category-chooser");
|
||||
|
||||
function template(options = []) {
|
||||
return `
|
||||
{{category-chooser
|
||||
value=value
|
||||
options=(hash
|
||||
${options.join("\n")}
|
||||
)
|
||||
}}
|
||||
`;
|
||||
}
|
||||
|
||||
componentTest("with value", {
|
||||
template: template(),
|
||||
|
||||
beforeEach() {
|
||||
this.set("value", 2);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
assert.equal(this.subject.header().value(), 2);
|
||||
assert.equal(this.subject.header().label(), "feature");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("with excludeCategoryId", {
|
||||
template: template(["excludeCategoryId=2"]),
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
|
||||
assert.notOk(this.subject.rowByValue(2).exists());
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("with scopedCategoryId", {
|
||||
template: template(["scopedCategoryId=2"]),
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
|
||||
assert.equal(
|
||||
this.subject.rowByIndex(0).title(),
|
||||
"Discussion about features or potential features of Discourse: how they work, why they work, etc."
|
||||
);
|
||||
assert.equal(this.subject.rowByIndex(0).value(), 2);
|
||||
assert.equal(
|
||||
this.subject.rowByIndex(1).title(),
|
||||
"My idea here is to have mini specs for features we would like built but have no bandwidth to build"
|
||||
);
|
||||
assert.equal(this.subject.rowByIndex(1).value(), 26);
|
||||
assert.equal(this.subject.rows().length, 2, "default content is scoped");
|
||||
|
||||
await this.subject.fillInFilter("bug");
|
||||
|
||||
assert.equal(
|
||||
this.subject.rowByIndex(0).name(),
|
||||
"bug",
|
||||
"search finds outside of scope"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("with allowUncategorized=null", {
|
||||
template: template(["allowUncategorized=null"]),
|
||||
|
||||
beforeEach() {
|
||||
this.siteSettings.allow_uncategorized_topics = false;
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
assert.equal(this.subject.header().value(), null);
|
||||
assert.equal(this.subject.header().label(), "category…");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("with allowUncategorized=null rootNone=true", {
|
||||
template: template(["allowUncategorized=null", "none=true"]),
|
||||
|
||||
beforeEach() {
|
||||
this.siteSettings.allow_uncategorized_topics = false;
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
assert.equal(this.subject.header().value(), null);
|
||||
assert.equal(this.subject.header().label(), "(no category)");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("with disallowed uncategorized, none", {
|
||||
template: template(["allowUncategorized=null", "none='test.root'"]),
|
||||
|
||||
beforeEach() {
|
||||
I18n.translations[I18n.locale].js.test = { root: "root none label" };
|
||||
this.siteSettings.allow_uncategorized_topics = false;
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
assert.equal(this.subject.header().value(), null);
|
||||
assert.equal(this.subject.header().label(), "root none label");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("with allowed uncategorized", {
|
||||
template: template(["allowUncategorized=true"]),
|
||||
|
||||
beforeEach() {
|
||||
this.siteSettings.allow_uncategorized_topics = true;
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
assert.equal(this.subject.header().value(), null);
|
||||
assert.equal(this.subject.header().label(), "uncategorized");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("with allowed uncategorized and none=true", {
|
||||
template: template(["allowUncategorized=true", "none=true"]),
|
||||
|
||||
beforeEach() {
|
||||
this.siteSettings.allow_uncategorized_topics = true;
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
assert.equal(this.subject.header().value(), null);
|
||||
assert.equal(this.subject.header().label(), "(no category)");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("with allowed uncategorized and none", {
|
||||
template: template(["allowUncategorized=true", "none='test.root'"]),
|
||||
|
||||
beforeEach() {
|
||||
I18n.translations[I18n.locale].js.test = { root: "root none label" };
|
||||
this.siteSettings.allow_uncategorized_topics = true;
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
assert.equal(this.subject.header().value(), null);
|
||||
assert.equal(this.subject.header().label(), "root none label");
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,347 @@
|
||||
import I18n from "I18n";
|
||||
import DiscourseURL from "discourse/lib/url";
|
||||
import Category from "discourse/models/category";
|
||||
import componentTest from "helpers/component-test";
|
||||
import { testSelectKitModule } from "helpers/select-kit-helper";
|
||||
import {
|
||||
NO_CATEGORIES_ID,
|
||||
ALL_CATEGORIES_ID,
|
||||
} from "select-kit/components/category-drop";
|
||||
import { set } from "@ember/object";
|
||||
|
||||
testSelectKitModule("category-drop");
|
||||
|
||||
function initCategories(context) {
|
||||
const categories = context.site.categoriesList;
|
||||
context.setProperties({
|
||||
category: categories.firstObject,
|
||||
categories,
|
||||
});
|
||||
}
|
||||
|
||||
function initCategoriesWithParentCategory(context) {
|
||||
const parentCategory = Category.findById(2);
|
||||
const childCategories = context.site.categoriesList.filter((c) => {
|
||||
return c.parentCategory === parentCategory;
|
||||
});
|
||||
|
||||
context.setProperties({
|
||||
parentCategory,
|
||||
category: null,
|
||||
categories: childCategories,
|
||||
});
|
||||
}
|
||||
|
||||
function template(options = []) {
|
||||
return `
|
||||
{{category-drop
|
||||
category=category
|
||||
categories=categories
|
||||
parentCategory=parentCategory
|
||||
options=(hash
|
||||
${options.join("\n")}
|
||||
)
|
||||
}}
|
||||
`;
|
||||
}
|
||||
|
||||
componentTest("caretUpIcon", {
|
||||
template: `
|
||||
{{category-drop
|
||||
category=value
|
||||
categories=content
|
||||
}}
|
||||
`,
|
||||
|
||||
async test(assert) {
|
||||
const $header = this.subject.header().el();
|
||||
|
||||
assert.ok(
|
||||
exists($header.find(`.d-icon-caret-right`)),
|
||||
"it uses the correct default icon"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("none", {
|
||||
template: `
|
||||
{{category-drop
|
||||
category=value
|
||||
categories=content
|
||||
}}
|
||||
`,
|
||||
|
||||
async test(assert) {
|
||||
const text = this.subject.header().label();
|
||||
assert.equal(
|
||||
text,
|
||||
I18n.t("category.all").toLowerCase(),
|
||||
"it uses the noneLabel"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("[not staff - TL0] displayCategoryDescription", {
|
||||
template: template(),
|
||||
|
||||
beforeEach() {
|
||||
set(this.currentUser, "staff", false);
|
||||
set(this.currentUser, "trust_level", 0);
|
||||
|
||||
initCategories(this);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
|
||||
const row = this.subject.rowByValue(this.category.id);
|
||||
assert.ok(
|
||||
exists(row.el().find(".category-desc")),
|
||||
"it shows category description for newcomers"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("[not staff - TL1] displayCategoryDescription", {
|
||||
template: template(),
|
||||
|
||||
beforeEach() {
|
||||
set(this.currentUser, "moderator", false);
|
||||
set(this.currentUser, "admin", false);
|
||||
set(this.currentUser, "trust_level", 1);
|
||||
initCategories(this);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
|
||||
const row = this.subject.rowByValue(this.category.id);
|
||||
assert.ok(
|
||||
!exists(row.el().find(".category-desc")),
|
||||
"it doesn't shows category description for TL0+"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("[staff - TL0] displayCategoryDescription", {
|
||||
template: template(),
|
||||
|
||||
beforeEach() {
|
||||
set(this.currentUser, "moderator", true);
|
||||
set(this.currentUser, "trust_level", 0);
|
||||
|
||||
initCategories(this);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
|
||||
const row = this.subject.rowByValue(this.category.id);
|
||||
assert.ok(
|
||||
!exists(row.el().find(".category-desc")),
|
||||
"it doesn't show category description for staff"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("hideParentCategory (default: false)", {
|
||||
template: template(),
|
||||
|
||||
beforeEach() {
|
||||
initCategories(this);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
|
||||
const row = this.subject.rowByValue(this.category.id);
|
||||
assert.equal(row.value(), this.category.id);
|
||||
assert.equal(this.category.parent_category_id, null);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("hideParentCategory (true)", {
|
||||
template: template(["hideParentCategory=true"]),
|
||||
|
||||
beforeEach() {
|
||||
initCategoriesWithParentCategory(this);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
|
||||
const parentRow = this.subject.rowByValue(this.parentCategory.id);
|
||||
assert.notOk(parentRow.exists(), "the parent row is not showing");
|
||||
|
||||
const childCategory = this.categories.firstObject;
|
||||
const childCategoryId = childCategory.id;
|
||||
const childRow = this.subject.rowByValue(childCategoryId);
|
||||
assert.ok(childRow.exists(), "the child row is showing");
|
||||
|
||||
const $categoryStatus = childRow.el().find(".category-status");
|
||||
assert.ok($categoryStatus.text().trim().match(/^spec/));
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("allow_uncategorized_topics (true)", {
|
||||
template: template(),
|
||||
|
||||
beforeEach() {
|
||||
this.siteSettings.allow_uncategorized_topics = true;
|
||||
initCategories(this);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
|
||||
const uncategorizedCategoryId = this.site.uncategorized_category_id;
|
||||
const row = this.subject.rowByValue(uncategorizedCategoryId);
|
||||
assert.ok(row.exists(), "the uncategorized row is showing");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("allow_uncategorized_topics (false)", {
|
||||
template: template(),
|
||||
|
||||
beforeEach() {
|
||||
this.siteSettings.allow_uncategorized_topics = false;
|
||||
initCategories(this);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
|
||||
const uncategorizedCategoryId = this.site.uncategorized_category_id;
|
||||
const row = this.subject.rowByValue(uncategorizedCategoryId);
|
||||
assert.notOk(row.exists(), "the uncategorized row is not showing");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("countSubcategories (default: false)", {
|
||||
template: template(),
|
||||
|
||||
beforeEach() {
|
||||
initCategories(this);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
|
||||
const category = Category.findById(7);
|
||||
const row = this.subject.rowByValue(category.id);
|
||||
const topicCount = row.el().find(".topic-count").text().trim();
|
||||
|
||||
assert.equal(
|
||||
topicCount,
|
||||
"× 481",
|
||||
"it doesn't include the topic count of subcategories"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("countSubcategories (true)", {
|
||||
template: template(["countSubcategories=true"]),
|
||||
|
||||
beforeEach() {
|
||||
initCategories(this);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
|
||||
const category = Category.findById(7);
|
||||
const row = this.subject.rowByValue(category.id);
|
||||
const topicCount = row.el().find(".topic-count").text().trim();
|
||||
|
||||
assert.equal(
|
||||
topicCount,
|
||||
"× 584",
|
||||
"it includes the topic count of subcategories"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("shortcuts:default", {
|
||||
template: template(),
|
||||
|
||||
beforeEach() {
|
||||
initCategories(this);
|
||||
this.set("category", null);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
|
||||
assert.equal(
|
||||
this.subject.rowByIndex(0).value(),
|
||||
this.categories.firstObject.id,
|
||||
"Shortcuts are not prepended when no category is selected"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("shortcuts:category is set", {
|
||||
template: template(),
|
||||
|
||||
beforeEach() {
|
||||
initCategories(this);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
|
||||
assert.equal(this.subject.rowByIndex(0).value(), ALL_CATEGORIES_ID);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("shortcuts with parentCategory/subCategory=true:default", {
|
||||
template: template(["subCategory=true"]),
|
||||
|
||||
beforeEach() {
|
||||
initCategoriesWithParentCategory(this);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
|
||||
assert.equal(this.subject.rowByIndex(0).value(), NO_CATEGORIES_ID);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest(
|
||||
"shortcuts with parentCategory/subCategory=true:category is selected",
|
||||
{
|
||||
template: template(["subCategory=true"]),
|
||||
|
||||
beforeEach() {
|
||||
initCategoriesWithParentCategory(this);
|
||||
this.set("category", this.categories.firstObject);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
|
||||
assert.equal(this.subject.rowByIndex(0).value(), ALL_CATEGORIES_ID);
|
||||
assert.equal(this.subject.rowByIndex(1).value(), NO_CATEGORIES_ID);
|
||||
},
|
||||
}
|
||||
);
|
||||
|
||||
componentTest("category url", {
|
||||
template: template(),
|
||||
|
||||
beforeEach() {
|
||||
initCategoriesWithParentCategory(this);
|
||||
sandbox.stub(DiscourseURL, "routeTo");
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
await this.subject.selectRowByValue(26);
|
||||
|
||||
assert.ok(
|
||||
DiscourseURL.routeTo.calledWith("/c/feature/spec/26"),
|
||||
"it builds a correct URL"
|
||||
);
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,102 @@
|
||||
import selectKit from "helpers/select-kit-helper";
|
||||
import componentTest from "helpers/component-test";
|
||||
|
||||
moduleForComponent("select-kit/combo-box", {
|
||||
integration: true,
|
||||
beforeEach() {
|
||||
this.set("subject", selectKit());
|
||||
},
|
||||
});
|
||||
|
||||
const DEFAULT_CONTENT = [
|
||||
{ id: 1, name: "foo" },
|
||||
{ id: 2, name: "bar" },
|
||||
{ id: 3, name: "baz" },
|
||||
];
|
||||
|
||||
const DEFAULT_VALUE = 1;
|
||||
|
||||
const setDefaultState = (ctx, options) => {
|
||||
const properties = Object.assign(
|
||||
{
|
||||
content: DEFAULT_CONTENT,
|
||||
value: DEFAULT_VALUE,
|
||||
},
|
||||
options || {}
|
||||
);
|
||||
ctx.setProperties(properties);
|
||||
};
|
||||
|
||||
componentTest("options.clearable", {
|
||||
template: `
|
||||
{{combo-box
|
||||
value=value
|
||||
content=content
|
||||
onChange=onChange
|
||||
options=(hash clearable=clearable)
|
||||
}}
|
||||
`,
|
||||
|
||||
beforeEach() {
|
||||
setDefaultState(this, {
|
||||
clearable: true,
|
||||
onChange: (value) => {
|
||||
this.set("value", value);
|
||||
},
|
||||
});
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
const $header = this.subject.header();
|
||||
|
||||
assert.ok(
|
||||
exists($header.el().find(".btn-clear")),
|
||||
"it shows the clear button"
|
||||
);
|
||||
assert.equal($header.value(), DEFAULT_VALUE);
|
||||
|
||||
await click($header.el().find(".btn-clear"));
|
||||
|
||||
assert.notOk(
|
||||
exists($header.el().find(".btn-clear")),
|
||||
"it hides the clear button"
|
||||
);
|
||||
assert.equal($header.value(), null);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("options.{caretUpIcon,caretDownIcon}", {
|
||||
template: `
|
||||
{{combo-box
|
||||
value=value
|
||||
content=content
|
||||
options=(hash
|
||||
caretUpIcon=caretUpIcon
|
||||
caretDownIcon=caretDownIcon
|
||||
)
|
||||
}}
|
||||
`,
|
||||
|
||||
beforeEach() {
|
||||
setDefaultState(this, {
|
||||
caretUpIcon: "pencil-alt",
|
||||
caretDownIcon: "trash-alt",
|
||||
});
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
const $header = this.subject.header().el();
|
||||
|
||||
assert.ok(
|
||||
exists($header.find(`.d-icon-${this.caretDownIcon}`)),
|
||||
"it uses the icon provided"
|
||||
);
|
||||
|
||||
await this.subject.expand();
|
||||
|
||||
assert.ok(
|
||||
exists($header.find(`.d-icon-${this.caretUpIcon}`)),
|
||||
"it uses the icon provided"
|
||||
);
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,113 @@
|
||||
import selectKit from "helpers/select-kit-helper";
|
||||
import componentTest from "helpers/component-test";
|
||||
|
||||
moduleForComponent("select-kit/dropdown-select-box", {
|
||||
integration: true,
|
||||
beforeEach() {
|
||||
this.set("subject", selectKit());
|
||||
},
|
||||
});
|
||||
|
||||
const DEFAULT_CONTENT = [
|
||||
{ id: 1, name: "foo" },
|
||||
{ id: 2, name: "bar" },
|
||||
{ id: 3, name: "baz" },
|
||||
];
|
||||
|
||||
const DEFAULT_VALUE = 1;
|
||||
|
||||
const setDefaultState = (ctx, options) => {
|
||||
const properties = Object.assign(
|
||||
{
|
||||
content: DEFAULT_CONTENT,
|
||||
value: DEFAULT_VALUE,
|
||||
onChange: (value) => {
|
||||
this.set("value", value);
|
||||
},
|
||||
},
|
||||
options || {}
|
||||
);
|
||||
ctx.setProperties(properties);
|
||||
};
|
||||
|
||||
componentTest("selection behavior", {
|
||||
template: `
|
||||
{{dropdown-select-box
|
||||
value=value
|
||||
content=content
|
||||
}}
|
||||
`,
|
||||
|
||||
beforeEach() {
|
||||
setDefaultState(this);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
assert.ok(this.subject.isExpanded());
|
||||
|
||||
await this.subject.selectRowByValue(DEFAULT_VALUE);
|
||||
assert.notOk(
|
||||
this.subject.isExpanded(),
|
||||
"it collapses the dropdown on select"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("options.showFullTitle=false", {
|
||||
template: `
|
||||
{{dropdown-select-box
|
||||
value=value
|
||||
content=content
|
||||
options=(hash
|
||||
icon="times"
|
||||
showFullTitle=showFullTitle
|
||||
none=none
|
||||
)
|
||||
}}
|
||||
`,
|
||||
|
||||
beforeEach() {
|
||||
setDefaultState(this, {
|
||||
value: null,
|
||||
showFullTitle: false,
|
||||
none: "test_none",
|
||||
});
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
assert.ok(
|
||||
!exists(this.subject.header().el().find(".selected-name")),
|
||||
"it hides the text of the selected item"
|
||||
);
|
||||
|
||||
assert.equal(
|
||||
this.subject.header().el().attr("title"),
|
||||
"[en_US.test_none]",
|
||||
"it adds a title attribute to the button"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("options.showFullTitle=true", {
|
||||
template: `
|
||||
{{dropdown-select-box
|
||||
value=value
|
||||
content=content
|
||||
options=(hash
|
||||
showFullTitle=showFullTitle
|
||||
)
|
||||
}}
|
||||
`,
|
||||
|
||||
beforeEach() {
|
||||
setDefaultState(this, { showFullTitle: true });
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
assert.ok(
|
||||
exists(this.subject.header().el().find(".selected-name")),
|
||||
"it shows the text of the selected item"
|
||||
);
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,35 @@
|
||||
import componentTest from "helpers/component-test";
|
||||
import { testSelectKitModule } from "helpers/select-kit-helper";
|
||||
|
||||
testSelectKitModule("list-setting");
|
||||
|
||||
function template(options = []) {
|
||||
return `
|
||||
{{list-setting
|
||||
value=value
|
||||
choices=choices
|
||||
options=(hash
|
||||
${options.join("\n")}
|
||||
)
|
||||
}}
|
||||
`;
|
||||
}
|
||||
|
||||
componentTest("default", {
|
||||
template: template(),
|
||||
|
||||
beforeEach() {
|
||||
this.set("value", ["bold", "italic"]);
|
||||
this.set("choices", ["bold", "italic", "underline"]);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
assert.equal(this.subject.header().name(), "bold,italic");
|
||||
assert.equal(this.subject.header().value(), "bold,italic");
|
||||
|
||||
await this.subject.expand();
|
||||
|
||||
assert.equal(this.subject.rows().length, 1);
|
||||
assert.equal(this.subject.rowByIndex(0).value(), "underline");
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,67 @@
|
||||
import I18n from "I18n";
|
||||
import componentTest from "helpers/component-test";
|
||||
import { testSelectKitModule } from "helpers/select-kit-helper";
|
||||
|
||||
testSelectKitModule("mini-tag-chooser");
|
||||
|
||||
function template() {
|
||||
return `{{mini-tag-chooser value=value}}`;
|
||||
}
|
||||
|
||||
componentTest("displays tags", {
|
||||
template: template(),
|
||||
|
||||
beforeEach() {
|
||||
this.set("value", ["foo", "bar"]);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
assert.equal(this.subject.header().value(), "foo,bar");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("create a tag", {
|
||||
template: template(),
|
||||
|
||||
beforeEach() {
|
||||
this.set("value", ["foo", "bar"]);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
assert.equal(this.subject.header().value(), "foo,bar");
|
||||
|
||||
await this.subject.expand();
|
||||
await this.subject.fillInFilter("mon");
|
||||
assert.equal(find(".select-kit-row").text().trim(), "monkey x1");
|
||||
await this.subject.fillInFilter("key");
|
||||
assert.equal(find(".select-kit-row").text().trim(), "monkey x1");
|
||||
await this.subject.keyboard("enter");
|
||||
|
||||
assert.equal(this.subject.header().value(), "foo,bar,monkey");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("max_tags_per_topic", {
|
||||
template: template(),
|
||||
|
||||
beforeEach() {
|
||||
this.set("value", ["foo", "bar"]);
|
||||
this.siteSettings.max_tags_per_topic = 2;
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
assert.equal(this.subject.header().value(), "foo,bar");
|
||||
|
||||
await this.subject.expand();
|
||||
await this.subject.fillInFilter("baz");
|
||||
await this.subject.keyboard("enter");
|
||||
|
||||
const error = find(".select-kit-error").text();
|
||||
assert.equal(
|
||||
error,
|
||||
I18n.t("select_kit.max_content_reached", {
|
||||
count: this.siteSettings.max_tags_per_topic,
|
||||
})
|
||||
);
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,63 @@
|
||||
import componentTest from "helpers/component-test";
|
||||
import { testSelectKitModule } from "helpers/select-kit-helper";
|
||||
|
||||
testSelectKitModule("multi-select");
|
||||
|
||||
function template(options = []) {
|
||||
return `
|
||||
{{multi-select
|
||||
value=value
|
||||
content=content
|
||||
options=(hash
|
||||
${options.join("\n")}
|
||||
)
|
||||
}}
|
||||
`;
|
||||
}
|
||||
|
||||
const DEFAULT_CONTENT = [
|
||||
{ id: 1, name: "foo" },
|
||||
{ id: 2, name: "bar" },
|
||||
{ id: 3, name: "baz" },
|
||||
];
|
||||
|
||||
const setDefaultState = (ctx, options) => {
|
||||
const properties = Object.assign(
|
||||
{
|
||||
content: DEFAULT_CONTENT,
|
||||
value: null,
|
||||
},
|
||||
options || {}
|
||||
);
|
||||
ctx.setProperties(properties);
|
||||
};
|
||||
|
||||
componentTest("content", {
|
||||
template: template(),
|
||||
|
||||
beforeEach() {
|
||||
setDefaultState(this);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
|
||||
const content = this.subject.displayedContent();
|
||||
assert.equal(content.length, 3, "it shows rows");
|
||||
assert.equal(
|
||||
content[0].name,
|
||||
this.content.firstObject.name,
|
||||
"it has the correct name"
|
||||
);
|
||||
assert.equal(
|
||||
content[0].id,
|
||||
this.content.firstObject.id,
|
||||
"it has the correct value"
|
||||
);
|
||||
assert.equal(
|
||||
this.subject.header().value(),
|
||||
null,
|
||||
"it doesn't set a value from the content"
|
||||
);
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,43 @@
|
||||
import componentTest from "helpers/component-test";
|
||||
import {
|
||||
testSelectKitModule,
|
||||
setDefaultState,
|
||||
} from "helpers/select-kit-helper";
|
||||
|
||||
testSelectKitModule("notifications-button");
|
||||
|
||||
componentTest("default", {
|
||||
template: `
|
||||
{{notifications-button
|
||||
value=value
|
||||
options=(hash
|
||||
i18nPrefix=i18nPrefix
|
||||
i18nPostfix=i18nPostfix
|
||||
)
|
||||
}}
|
||||
`,
|
||||
|
||||
beforeEach() {
|
||||
this.set("value", 1);
|
||||
|
||||
setDefaultState(this, 1, { i18nPrefix: "pre", i18nPostfix: "post" });
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
assert.ok(this.subject.header().value());
|
||||
|
||||
assert.ok(
|
||||
this.subject
|
||||
.header()
|
||||
.label()
|
||||
.includes(`${this.i18nPrefix}.regular${this.i18nPostfix}`),
|
||||
"it shows the regular choice when value is not set"
|
||||
);
|
||||
|
||||
const icon = this.subject.header().icon()[0];
|
||||
assert.ok(
|
||||
icon.classList.contains("d-icon-d-regular"),
|
||||
"it shows the correct icon"
|
||||
);
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,55 @@
|
||||
import selectKit from "helpers/select-kit-helper";
|
||||
import componentTest from "helpers/component-test";
|
||||
import Topic from "discourse/models/topic";
|
||||
|
||||
const buildTopic = function (pinned = true) {
|
||||
return Topic.create({
|
||||
id: 1234,
|
||||
title: "Qunit Test Topic",
|
||||
deleted_at: new Date(),
|
||||
pinned,
|
||||
});
|
||||
};
|
||||
|
||||
moduleForComponent("select-kit/pinned-options", {
|
||||
integration: true,
|
||||
beforeEach: function () {
|
||||
this.set("subject", selectKit());
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("unpinning", {
|
||||
template: "{{pinned-options value=topic.pinned topic=topic}}",
|
||||
|
||||
beforeEach() {
|
||||
this.siteSettings.automatically_unpin_topics = false;
|
||||
this.set("topic", buildTopic());
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
assert.equal(this.subject.header().name(), "pinned");
|
||||
|
||||
await this.subject.expand();
|
||||
await this.subject.selectRowByValue("unpinned");
|
||||
|
||||
assert.equal(this.subject.header().name(), "unpinned");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("pinning", {
|
||||
template: "{{pinned-options value=topic.pinned topic=topic}}",
|
||||
|
||||
beforeEach() {
|
||||
this.siteSettings.automatically_unpin_topics = false;
|
||||
this.set("topic", buildTopic(false));
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
assert.equal(this.subject.header().name(), "unpinned");
|
||||
|
||||
await this.subject.expand();
|
||||
await this.subject.selectRowByValue("pinned");
|
||||
|
||||
assert.equal(this.subject.header().name(), "pinned");
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,303 @@
|
||||
import I18n from "I18n";
|
||||
import componentTest from "helpers/component-test";
|
||||
import { testSelectKitModule } from "helpers/select-kit-helper";
|
||||
|
||||
testSelectKitModule("single-select");
|
||||
|
||||
function template(options = []) {
|
||||
return `
|
||||
{{single-select
|
||||
value=value
|
||||
content=content
|
||||
nameProperty=nameProperty
|
||||
valueProperty=valueProperty
|
||||
onChange=onChange
|
||||
options=(hash
|
||||
${options.join("\n")}
|
||||
)
|
||||
}}
|
||||
`;
|
||||
}
|
||||
|
||||
const DEFAULT_CONTENT = [
|
||||
{ id: 1, name: "foo" },
|
||||
{ id: 2, name: "bar" },
|
||||
{ id: 3, name: "baz" },
|
||||
];
|
||||
|
||||
const DEFAULT_VALUE = 1;
|
||||
|
||||
const setDefaultState = (ctx, options) => {
|
||||
const properties = Object.assign(
|
||||
{
|
||||
content: DEFAULT_CONTENT,
|
||||
value: DEFAULT_VALUE,
|
||||
nameProperty: "name",
|
||||
valueProperty: "id",
|
||||
onChange: (value) => {
|
||||
ctx.set("value", value);
|
||||
},
|
||||
},
|
||||
options || {}
|
||||
);
|
||||
ctx.setProperties(properties);
|
||||
};
|
||||
|
||||
componentTest("content", {
|
||||
template: "{{single-select content=content}}",
|
||||
|
||||
beforeEach() {
|
||||
setDefaultState(this);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
|
||||
const content = this.subject.displayedContent();
|
||||
assert.equal(content.length, 3, "it shows rows");
|
||||
assert.equal(
|
||||
content[0].name,
|
||||
this.content.firstObject.name,
|
||||
"it has the correct name"
|
||||
);
|
||||
assert.equal(
|
||||
content[0].id,
|
||||
this.content.firstObject.id,
|
||||
"it has the correct value"
|
||||
);
|
||||
assert.equal(
|
||||
this.subject.header().value(),
|
||||
null,
|
||||
"it doesn't set a value from the content"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("value", {
|
||||
template: template(),
|
||||
|
||||
beforeEach() {
|
||||
setDefaultState(this);
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
assert.equal(
|
||||
this.subject.header().value(this.content),
|
||||
1,
|
||||
"it selects the correct content to display"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("options.filterable", {
|
||||
template: template(["filterable=filterable"]),
|
||||
|
||||
beforeEach() {
|
||||
setDefaultState(this, { filterable: true });
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
assert.ok(this.subject.filter().exists(), "it shows the filter");
|
||||
|
||||
const filter = this.subject.displayedContent()[1].name;
|
||||
await this.subject.fillInFilter(filter);
|
||||
assert.equal(
|
||||
this.subject.displayedContent()[0].name,
|
||||
filter,
|
||||
"it filters the list"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("options.limitMatches", {
|
||||
template: template(["limitMatches=limitMatches", "filterable=filterable"]),
|
||||
|
||||
beforeEach() {
|
||||
setDefaultState(this, { limitMatches: 1, filterable: true });
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
await this.subject.fillInFilter("ba");
|
||||
|
||||
assert.equal(
|
||||
this.subject.displayedContent().length,
|
||||
1,
|
||||
"it returns only 1 result"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("valueAttribute (deprecated)", {
|
||||
template: `
|
||||
{{single-select
|
||||
value=value
|
||||
content=content
|
||||
valueAttribute="value"
|
||||
}}
|
||||
`,
|
||||
|
||||
beforeEach() {
|
||||
this.set("value", "normal");
|
||||
|
||||
const content = [
|
||||
{ name: "Smallest", value: "smallest" },
|
||||
{ name: "Smaller", value: "smaller" },
|
||||
{ name: "Normal", value: "normal" },
|
||||
{ name: "Larger", value: "larger" },
|
||||
{ name: "Largest", value: "largest" },
|
||||
];
|
||||
this.set("content", content);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
|
||||
assert.equal(this.subject.selectedRow().value(), this.value);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("none:string", {
|
||||
template: template(['none="test.none"']),
|
||||
|
||||
beforeEach() {
|
||||
I18n.translations[I18n.locale].js.test = { none: "(default)" };
|
||||
setDefaultState(this, { value: 1 });
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
|
||||
const noneRow = this.subject.rowByIndex(0);
|
||||
assert.equal(noneRow.value(), null);
|
||||
assert.equal(noneRow.name(), I18n.t("test.none"));
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("none:object", {
|
||||
template: template(["none=none"]),
|
||||
|
||||
beforeEach() {
|
||||
setDefaultState(this, { none: { value: null, name: "(default)" } });
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
|
||||
const noneRow = this.subject.rowByIndex(0);
|
||||
assert.equal(noneRow.value(), null);
|
||||
assert.equal(noneRow.name(), "(default)");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("content is a basic array", {
|
||||
template: template(['none="test.none"']),
|
||||
|
||||
beforeEach() {
|
||||
I18n.translations[I18n.locale].js.test = { none: "(default)" };
|
||||
setDefaultState(this, {
|
||||
nameProperty: null,
|
||||
valueProperty: null,
|
||||
value: "foo",
|
||||
content: ["foo", "bar", "baz"],
|
||||
});
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
|
||||
const noneRow = this.subject.rowByIndex(0);
|
||||
assert.equal(noneRow.value(), I18n.t("test.none"));
|
||||
assert.equal(noneRow.name(), I18n.t("test.none"));
|
||||
assert.equal(this.value, "foo");
|
||||
|
||||
await this.subject.selectRowByIndex(0);
|
||||
|
||||
assert.equal(this.value, null);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("selected value can be 0", {
|
||||
template: template(),
|
||||
|
||||
beforeEach() {
|
||||
setDefaultState(this, {
|
||||
value: 1,
|
||||
content: [
|
||||
{ id: 0, name: "foo" },
|
||||
{ id: 1, name: "bar" },
|
||||
],
|
||||
});
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
assert.equal(this.subject.header().value(), 1);
|
||||
|
||||
await this.subject.expand();
|
||||
await this.subject.selectRowByValue(0);
|
||||
|
||||
assert.equal(this.subject.header().value(), 0);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("prevents propagating click event on header", {
|
||||
template:
|
||||
"{{#d-button icon='times' action=onClick}}{{single-select options=(hash preventsClickPropagation=true) value=value content=content}}{{/d-button}}",
|
||||
|
||||
beforeEach() {
|
||||
this.setProperties({
|
||||
onClick: () => this.set("value", "foo"),
|
||||
content: DEFAULT_CONTENT,
|
||||
value: DEFAULT_VALUE,
|
||||
});
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
assert.equal(this.value, DEFAULT_VALUE);
|
||||
await this.subject.expand();
|
||||
assert.equal(this.value, DEFAULT_VALUE);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("labelProperty", {
|
||||
template: '{{single-select labelProperty="foo" value=value content=content}}',
|
||||
|
||||
beforeEach() {
|
||||
this.setProperties({
|
||||
content: [{ id: 1, name: "john", foo: "JACKSON" }],
|
||||
value: 1,
|
||||
});
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
assert.equal(this.subject.header().label(), "JACKSON");
|
||||
|
||||
await this.subject.expand();
|
||||
|
||||
const row = this.subject.rowByValue(1);
|
||||
|
||||
assert.equal(row.label(), "JACKSON");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("titleProperty", {
|
||||
template: '{{single-select titleProperty="foo" value=value content=content}}',
|
||||
|
||||
beforeEach() {
|
||||
this.setProperties({
|
||||
content: [{ id: 1, name: "john", foo: "JACKSON" }],
|
||||
value: 1,
|
||||
});
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
assert.equal(this.subject.header().title(), "JACKSON");
|
||||
|
||||
await this.subject.expand();
|
||||
|
||||
const row = this.subject.rowByValue(1);
|
||||
|
||||
assert.equal(row.title(), "JACKSON");
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,89 @@
|
||||
import I18n from "I18n";
|
||||
import componentTest from "helpers/component-test";
|
||||
import { testSelectKitModule } from "helpers/select-kit-helper";
|
||||
import Site from "discourse/models/site";
|
||||
import { set } from "@ember/object";
|
||||
import pretender from "helpers/create-pretender";
|
||||
|
||||
testSelectKitModule("tag-drop", {
|
||||
beforeEach() {
|
||||
const site = Site.current();
|
||||
set(site, "top_tags", ["jeff", "neil", "arpit", "régis"]);
|
||||
|
||||
const response = (object) => {
|
||||
return [200, { "Content-Type": "application/json" }, object];
|
||||
};
|
||||
|
||||
pretender.get("/tags/filter/search", (params) => {
|
||||
if (params.queryParams.q === "rég") {
|
||||
return response({
|
||||
results: [{ id: "régis", text: "régis", count: 2, pm_count: 0 }],
|
||||
});
|
||||
} else if (params.queryParams.q === "dav") {
|
||||
return response({
|
||||
results: [{ id: "David", text: "David", count: 2, pm_count: 0 }],
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
function initTags(context) {
|
||||
const categories = context.site.categoriesList;
|
||||
const parentCategory = categories.findBy("id", 2);
|
||||
const childCategories = categories.filter(
|
||||
(c) => c.parentCategory === parentCategory
|
||||
);
|
||||
|
||||
// top_tags
|
||||
context.setProperties({
|
||||
firstCategory: parentCategory,
|
||||
secondCategory: childCategories.firstObject,
|
||||
tagId: "jeff",
|
||||
});
|
||||
}
|
||||
|
||||
function template(options = []) {
|
||||
return `
|
||||
{{tag-drop
|
||||
firstCategory=firstCategory
|
||||
secondCategory=secondCategory
|
||||
tagId=tagId
|
||||
options=(hash
|
||||
${options.join("\n")}
|
||||
)
|
||||
}}
|
||||
`;
|
||||
}
|
||||
|
||||
componentTest("default", {
|
||||
template: template(["tagId=tagId"]),
|
||||
|
||||
beforeEach() {
|
||||
initTags(this);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
|
||||
assert.ok(true);
|
||||
// const row = this.subject.rowByValue(this.category.id);
|
||||
// assert.ok(
|
||||
// exists(row.el().find(".category-desc")),
|
||||
// "it shows category description for newcomers"
|
||||
// );
|
||||
|
||||
const content = this.subject.displayedContent();
|
||||
|
||||
assert.equal(
|
||||
content[0].name,
|
||||
I18n.t("tagging.selector_no_tags"),
|
||||
"it has the translated label for no-tags"
|
||||
);
|
||||
assert.equal(
|
||||
content[1].name,
|
||||
I18n.t("tagging.selector_all_tags"),
|
||||
"it has the correct label for all-tags"
|
||||
);
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,70 @@
|
||||
import I18n from "I18n";
|
||||
import selectKit from "helpers/select-kit-helper";
|
||||
import componentTest from "helpers/component-test";
|
||||
import Topic from "discourse/models/topic";
|
||||
|
||||
const buildTopic = function (level, archetype = "regular") {
|
||||
return Topic.create({
|
||||
id: 4563,
|
||||
}).updateFromJson({
|
||||
title: "Qunit Test Topic",
|
||||
details: {
|
||||
notification_level: level,
|
||||
},
|
||||
archetype,
|
||||
});
|
||||
};
|
||||
|
||||
const originalTranslation =
|
||||
I18n.translations.en.js.topic.notifications.tracking_pm.title;
|
||||
|
||||
moduleForComponent("select-kit/topic-notifications-button", {
|
||||
integration: true,
|
||||
|
||||
afterEach() {
|
||||
I18n.translations.en.js.topic.notifications.tracking_pm.title = originalTranslation;
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("the header has a localized title", {
|
||||
template:
|
||||
"{{topic-notifications-button notificationLevel=topic.details.notification_level topic=topic}}",
|
||||
|
||||
beforeEach() {
|
||||
this.set("topic", buildTopic(1));
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
assert.equal(
|
||||
selectKit().header().label(),
|
||||
"Normal",
|
||||
"it has the correct label"
|
||||
);
|
||||
|
||||
await this.set("topic", buildTopic(2));
|
||||
|
||||
assert.equal(
|
||||
selectKit().header().label(),
|
||||
"Tracking",
|
||||
"it correctly changes the label"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("the header has a localized title", {
|
||||
template:
|
||||
"{{topic-notifications-button notificationLevel=topic.details.notification_level topic=topic}}",
|
||||
|
||||
beforeEach() {
|
||||
I18n.translations.en.js.topic.notifications.tracking_pm.title = `${originalTranslation} PM`;
|
||||
this.set("topic", buildTopic(2, "private_message"));
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
assert.equal(
|
||||
selectKit().header().label(),
|
||||
`${originalTranslation} PM`,
|
||||
"it has the correct label for PMs"
|
||||
);
|
||||
},
|
||||
});
|
||||
+93
@@ -0,0 +1,93 @@
|
||||
import I18n from "I18n";
|
||||
import selectKit from "helpers/select-kit-helper";
|
||||
import componentTest from "helpers/component-test";
|
||||
import Topic from "discourse/models/topic";
|
||||
|
||||
const buildTopic = function (archetype) {
|
||||
return Topic.create({
|
||||
id: 4563,
|
||||
}).updateFromJson({
|
||||
title: "Qunit Test Topic",
|
||||
details: {
|
||||
notification_level: 1,
|
||||
},
|
||||
archetype,
|
||||
});
|
||||
};
|
||||
|
||||
function extractDescs(rows) {
|
||||
return Array.from(
|
||||
rows.find(".desc").map(function () {
|
||||
return this.textContent.trim();
|
||||
})
|
||||
);
|
||||
}
|
||||
|
||||
function getTranslations(type = "") {
|
||||
return ["watching", "tracking", "regular", "muted"].map((key) => {
|
||||
return I18n.t(`topic.notifications.${key}${type}.description`);
|
||||
});
|
||||
}
|
||||
|
||||
moduleForComponent("select-kit/topic-notifications-options", {
|
||||
integration: true,
|
||||
});
|
||||
|
||||
componentTest("regular topic notification level descriptions", {
|
||||
template:
|
||||
"{{topic-notifications-options value=topic.details.notification_level topic=topic}}",
|
||||
|
||||
beforeEach() {
|
||||
this.set("topic", buildTopic("regular"));
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await selectKit().expand();
|
||||
|
||||
const uiTexts = extractDescs(selectKit().rows());
|
||||
const descriptions = getTranslations();
|
||||
|
||||
assert.equal(
|
||||
uiTexts.length,
|
||||
descriptions.length,
|
||||
"it has the correct copy"
|
||||
);
|
||||
uiTexts.forEach((text, index) => {
|
||||
assert.equal(
|
||||
text.trim(),
|
||||
descriptions[index].trim(),
|
||||
"it has the correct copy"
|
||||
);
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("PM topic notification level descriptions", {
|
||||
template:
|
||||
"{{topic-notifications-options value=topic.details.notification_level topic=topic}}",
|
||||
|
||||
beforeEach() {
|
||||
this.set("topic", buildTopic("private_message"));
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await selectKit().expand();
|
||||
|
||||
const uiTexts = extractDescs(selectKit().rows());
|
||||
const descriptions = getTranslations("_pm");
|
||||
|
||||
assert.equal(
|
||||
uiTexts.length,
|
||||
descriptions.length,
|
||||
"it has the correct copy"
|
||||
);
|
||||
|
||||
uiTexts.forEach((text, index) => {
|
||||
assert.equal(
|
||||
text.trim(),
|
||||
descriptions[index].trim(),
|
||||
"it has the correct copy"
|
||||
);
|
||||
});
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,33 @@
|
||||
import componentTest from "helpers/component-test";
|
||||
import { testSelectKitModule } from "helpers/select-kit-helper";
|
||||
|
||||
testSelectKitModule("user-chooser");
|
||||
|
||||
function template() {
|
||||
return `{{user-chooser value=value}}`;
|
||||
}
|
||||
|
||||
componentTest("displays usernames", {
|
||||
template: template(),
|
||||
|
||||
beforeEach() {
|
||||
this.set("value", ["bob", "martin"]);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
assert.equal(this.subject.header().name(), "bob,martin");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("can remove a username", {
|
||||
template: template(),
|
||||
|
||||
beforeEach() {
|
||||
this.set("value", ["bob", "martin"]);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.deselectItem("bob");
|
||||
assert.equal(this.subject.header().name(), "martin");
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,16 @@
|
||||
import componentTest from "helpers/component-test";
|
||||
|
||||
moduleForComponent("share-button", { integration: true });
|
||||
|
||||
componentTest("share button", {
|
||||
template: '{{share-button url="https://eviltrout.com"}}',
|
||||
|
||||
test(assert) {
|
||||
assert.ok(find(`button.share`).length, "it has all the classes");
|
||||
|
||||
assert.ok(
|
||||
find('button[data-share-url="https://eviltrout.com"]').length,
|
||||
"it has the data attribute for sharing"
|
||||
);
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,13 @@
|
||||
import Button from "discourse/components/d-button";
|
||||
|
||||
export default Button.extend({
|
||||
classNames: ["btn-default", "share"],
|
||||
icon: "link",
|
||||
title: "topic.share.help",
|
||||
label: "topic.share.title",
|
||||
attributeBindings: ["url:data-share-url"],
|
||||
|
||||
click() {
|
||||
return true;
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,84 @@
|
||||
import componentTest from "helpers/component-test";
|
||||
moduleForComponent("simple-list", { integration: true });
|
||||
|
||||
componentTest("adding a value", {
|
||||
template: "{{simple-list values=values}}",
|
||||
|
||||
beforeEach() {
|
||||
this.set("values", "vinkas\nosama");
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
assert.ok(
|
||||
find(".add-value-btn[disabled]").length,
|
||||
"while loading the + button is disabled"
|
||||
);
|
||||
|
||||
await fillIn(".add-value-input", "penar");
|
||||
await click(".add-value-btn");
|
||||
|
||||
assert.ok(
|
||||
find(".values .value").length === 3,
|
||||
"it adds the value to the list of values"
|
||||
);
|
||||
|
||||
assert.ok(
|
||||
find(".values .value[data-index='2'] .value-input")[0].value === "penar",
|
||||
"it sets the correct value for added item"
|
||||
);
|
||||
|
||||
await fillIn(".add-value-input", "eviltrout");
|
||||
await keyEvent(".add-value-input", "keydown", 13); // enter
|
||||
|
||||
assert.ok(
|
||||
find(".values .value").length === 4,
|
||||
"it adds the value when keying Enter"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("removing a value", {
|
||||
template: "{{simple-list values=values}}",
|
||||
|
||||
beforeEach() {
|
||||
this.set("values", "vinkas\nosama");
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await click(".values .value[data-index='0'] .remove-value-btn");
|
||||
|
||||
assert.ok(
|
||||
find(".values .value").length === 1,
|
||||
"it removes the value from the list of values"
|
||||
);
|
||||
|
||||
assert.ok(
|
||||
find(".values .value[data-index='0'] .value-input")[0].value === "osama",
|
||||
"it removes the correct value"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("delimiter support", {
|
||||
template: "{{simple-list values=values inputDelimiter='|'}}",
|
||||
|
||||
beforeEach() {
|
||||
this.set("values", "vinkas|osama");
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await fillIn(".add-value-input", "eviltrout");
|
||||
await click(".add-value-btn");
|
||||
|
||||
assert.ok(
|
||||
find(".values .value").length === 3,
|
||||
"it adds the value to the list of values"
|
||||
);
|
||||
|
||||
assert.ok(
|
||||
find(".values .value[data-index='2'] .value-input")[0].value ===
|
||||
"eviltrout",
|
||||
"it adds the correct value"
|
||||
);
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,87 @@
|
||||
import I18n from "I18n";
|
||||
import componentTest from "helpers/component-test";
|
||||
|
||||
moduleForComponent("text-field", { integration: true });
|
||||
|
||||
componentTest("renders correctly with no properties set", {
|
||||
template: `{{text-field}}`,
|
||||
|
||||
test(assert) {
|
||||
assert.ok(find("input[type=text]").length);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("support a placeholder", {
|
||||
template: `{{text-field placeholderKey="placeholder.i18n.key"}}`,
|
||||
|
||||
beforeEach() {
|
||||
sandbox.stub(I18n, "t").returnsArg(0);
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
assert.ok(find("input[type=text]").length);
|
||||
assert.equal(find("input").prop("placeholder"), "placeholder.i18n.key");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("sets the dir attribute to ltr for Hebrew text", {
|
||||
template: `{{text-field value='זהו שם עברי עם מקום עברי'}}`,
|
||||
beforeEach() {
|
||||
this.siteSettings.support_mixed_text_direction = true;
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
assert.equal(find("input").attr("dir"), "rtl");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("sets the dir attribute to ltr for English text", {
|
||||
template: `{{text-field value='This is a ltr title'}}`,
|
||||
beforeEach() {
|
||||
this.siteSettings.support_mixed_text_direction = true;
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
assert.equal(find("input").attr("dir"), "ltr");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("supports onChange", {
|
||||
template: `{{text-field class="tf-test" value=value onChange=changed}}`,
|
||||
beforeEach() {
|
||||
this.called = false;
|
||||
this.newValue = null;
|
||||
this.set("value", "hello");
|
||||
this.set("changed", (v) => {
|
||||
this.newValue = v;
|
||||
this.called = true;
|
||||
});
|
||||
},
|
||||
async test(assert) {
|
||||
await fillIn(".tf-test", "hello");
|
||||
assert.ok(!this.called);
|
||||
await fillIn(".tf-test", "new text");
|
||||
assert.ok(this.called);
|
||||
assert.equal(this.newValue, "new text");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("supports onChangeImmediate", {
|
||||
template: `{{text-field class="tf-test" value=value onChangeImmediate=changed}}`,
|
||||
beforeEach() {
|
||||
this.called = false;
|
||||
this.newValue = null;
|
||||
this.set("value", "old");
|
||||
this.set("changed", (v) => {
|
||||
this.newValue = v;
|
||||
this.called = true;
|
||||
});
|
||||
},
|
||||
async test(assert) {
|
||||
await fillIn(".tf-test", "old");
|
||||
assert.ok(!this.called);
|
||||
await fillIn(".tf-test", "no longer old");
|
||||
assert.ok(this.called);
|
||||
assert.equal(this.newValue, "no longer old");
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,55 @@
|
||||
import selectKit from "helpers/select-kit-helper";
|
||||
import componentTest from "helpers/component-test";
|
||||
|
||||
moduleForComponent("time-input", {
|
||||
integration: true,
|
||||
|
||||
beforeEach() {
|
||||
this.set("subject", selectKit());
|
||||
},
|
||||
});
|
||||
|
||||
function setTime(time) {
|
||||
this.setProperties(time);
|
||||
}
|
||||
|
||||
componentTest("default", {
|
||||
template: `{{time-input hours=hours minutes=minutes}}`,
|
||||
|
||||
beforeEach() {
|
||||
this.setProperties({ hours: "14", minutes: "58" });
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
assert.equal(this.subject.header().name(), "14:58");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("prevents mutations", {
|
||||
template: `{{time-input hours=hours minutes=minutes}}`,
|
||||
|
||||
beforeEach() {
|
||||
this.setProperties({ hours: "14", minutes: "58" });
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
await this.subject.selectRowByIndex(3);
|
||||
assert.equal(this.subject.header().name(), "14:58");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("allows mutations through actions", {
|
||||
template: `{{time-input hours=hours minutes=minutes onChange=onChange}}`,
|
||||
|
||||
beforeEach() {
|
||||
this.setProperties({ hours: "14", minutes: "58" });
|
||||
this.set("onChange", setTime);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await this.subject.expand();
|
||||
await this.subject.selectRowByIndex(3);
|
||||
assert.equal(this.subject.header().name(), "00:45");
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,54 @@
|
||||
import componentTest from "helpers/component-test";
|
||||
|
||||
moduleForComponent("user-selector", { integration: true });
|
||||
|
||||
function paste(element, text) {
|
||||
let e = new Event("paste");
|
||||
e.clipboardData = { getData: () => text };
|
||||
element.dispatchEvent(e);
|
||||
}
|
||||
|
||||
componentTest("pasting a list of usernames", {
|
||||
template: `{{user-selector usernames=usernames class="test-selector"}}`,
|
||||
|
||||
beforeEach() {
|
||||
this.set("usernames", "evil,trout");
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
let element = find(".test-selector")[0];
|
||||
|
||||
assert.equal(this.get("usernames"), "evil,trout");
|
||||
paste(element, "zip,zap,zoom");
|
||||
assert.equal(this.get("usernames"), "evil,trout,zip,zap,zoom");
|
||||
paste(element, "evil,abc,abc,abc");
|
||||
assert.equal(this.get("usernames"), "evil,trout,zip,zap,zoom,abc");
|
||||
|
||||
this.set("usernames", "");
|
||||
paste(element, "names with spaces");
|
||||
assert.equal(this.get("usernames"), "names,with,spaces");
|
||||
|
||||
this.set("usernames", null);
|
||||
paste(element, "@eviltrout,@codinghorror sam");
|
||||
assert.equal(this.get("usernames"), "eviltrout,codinghorror,sam");
|
||||
|
||||
this.set("usernames", null);
|
||||
paste(element, "eviltrout\nsam\ncodinghorror");
|
||||
assert.equal(this.get("usernames"), "eviltrout,sam,codinghorror");
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("excluding usernames", {
|
||||
template: `{{user-selector usernames=usernames excludedUsernames=excludedUsernames class="test-selector"}}`,
|
||||
|
||||
beforeEach() {
|
||||
this.set("usernames", "mark");
|
||||
this.set("excludedUsernames", ["jeff", "sam", "robin"]);
|
||||
},
|
||||
|
||||
test(assert) {
|
||||
let element = find(".test-selector")[0];
|
||||
paste(element, "roman,penar,jeff,robin");
|
||||
assert.equal(this.get("usernames"), "mark,roman,penar");
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,138 @@
|
||||
import selectKit from "helpers/select-kit-helper";
|
||||
import componentTest from "helpers/component-test";
|
||||
moduleForComponent("value-list", { integration: true });
|
||||
|
||||
componentTest("adding a value", {
|
||||
template: "{{value-list values=values}}",
|
||||
|
||||
skip: true,
|
||||
|
||||
beforeEach() {
|
||||
this.set("values", "vinkas\nosama");
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await selectKit().expand();
|
||||
await selectKit().fillInFilter("eviltrout");
|
||||
await selectKit().keyboard("enter");
|
||||
|
||||
assert.ok(
|
||||
find(".values .value").length === 3,
|
||||
"it adds the value to the list of values"
|
||||
);
|
||||
|
||||
assert.deepEqual(
|
||||
this.values,
|
||||
"vinkas\nosama\neviltrout",
|
||||
"it adds the value to the list of values"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("removing a value", {
|
||||
template: "{{value-list values=values}}",
|
||||
|
||||
beforeEach() {
|
||||
this.set("values", "vinkas\nosama");
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await click(".values .value[data-index='0'] .remove-value-btn");
|
||||
|
||||
assert.ok(
|
||||
find(".values .value").length === 1,
|
||||
"it removes the value from the list of values"
|
||||
);
|
||||
|
||||
assert.equal(this.values, "osama", "it removes the expected value");
|
||||
|
||||
await selectKit().expand();
|
||||
|
||||
assert.ok(
|
||||
find(".select-kit-collection li.select-kit-row span.name")[0]
|
||||
.innerText === "vinkas",
|
||||
"it adds the removed value to choices"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("selecting a value", {
|
||||
template: "{{value-list values=values choices=choices}}",
|
||||
|
||||
beforeEach() {
|
||||
this.setProperties({
|
||||
values: "vinkas\nosama",
|
||||
choices: ["maja", "michael"],
|
||||
});
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
await selectKit().expand();
|
||||
await selectKit().selectRowByValue("maja");
|
||||
|
||||
assert.ok(
|
||||
find(".values .value").length === 3,
|
||||
"it adds the value to the list of values"
|
||||
);
|
||||
|
||||
assert.deepEqual(
|
||||
this.values,
|
||||
"vinkas\nosama\nmaja",
|
||||
"it adds the value to the list of values"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("array support", {
|
||||
template: "{{value-list values=values inputType='array'}}",
|
||||
|
||||
beforeEach() {
|
||||
this.set("values", ["vinkas", "osama"]);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
this.set("values", ["vinkas", "osama"]);
|
||||
|
||||
await selectKit().expand();
|
||||
await selectKit().fillInFilter("eviltrout");
|
||||
await selectKit().keyboard("enter");
|
||||
|
||||
assert.ok(
|
||||
find(".values .value").length === 3,
|
||||
"it adds the value to the list of values"
|
||||
);
|
||||
|
||||
assert.deepEqual(
|
||||
this.values,
|
||||
["vinkas", "osama", "eviltrout"],
|
||||
"it adds the value to the list of values"
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
componentTest("delimiter support", {
|
||||
template: "{{value-list values=values inputDelimiter='|'}}",
|
||||
|
||||
beforeEach() {
|
||||
this.set("values", "vinkas|osama");
|
||||
},
|
||||
|
||||
skip: true,
|
||||
|
||||
async test(assert) {
|
||||
await selectKit().expand();
|
||||
await selectKit().fillInFilter("eviltrout");
|
||||
await selectKit().keyboard("enter");
|
||||
|
||||
assert.ok(
|
||||
find(".values .value").length === 3,
|
||||
"it adds the value to the list of values"
|
||||
);
|
||||
|
||||
assert.deepEqual(
|
||||
this.values,
|
||||
"vinkas|osama|eviltrout",
|
||||
"it adds the value to the list of values"
|
||||
);
|
||||
},
|
||||
});
|
||||
Reference in New Issue
Block a user