mirror of
https://github.com/discourse/discourse.git
synced 2024-11-30 13:29:42 +08:00
913fd3a7b3
Why this change? Previously just using the `addToolbarPopupMenuOptionsCallback` plugin API itself was insufficient because it required the return object to include an `action` key which only accepted a name of the action function as a string. This was highly problematic because the action function had to be defined on the `composer` service which means using the `modifyClass` API to add the action function. This made the API awkward to use leading to poor developer experiencec. What does this change do? This commit introduces a couple of improvemnts to the API. 1. First the API has been renamed to `addComposerToolbarPopupMenuOption` because the API no longer accepts a callback function which was quite redundant. Instead, it now accepts an Object. The `addToolbarPopupMenuOptionsCallback` API function is deprecated and will be dropped in Discourse 3.3. Note that passing the API a function is still supported but will be dropped when the `addToolbarPopupMenuOptionsCallback` is removed. 2. The `action` key in the Object passed to the function can now be a function and is passed the `toolbarEvent` object when called. 3. The `condition` on key in the Object passed to the function can now be a function and is passed the `composer` service when called.
140 lines
4.1 KiB
JavaScript
140 lines
4.1 KiB
JavaScript
import { acceptance, query } from "discourse/tests/helpers/qunit-helpers";
|
|
import I18n from "I18n";
|
|
import selectKit from "discourse/tests/helpers/select-kit-helper";
|
|
import { test } from "qunit";
|
|
import { click, fillIn, visit } from "@ember/test-helpers";
|
|
|
|
acceptance("Details Button", function (needs) {
|
|
needs.user();
|
|
|
|
test("details button", async function (assert) {
|
|
const popupMenu = selectKit(".toolbar-popup-menu-options");
|
|
|
|
await visit("/");
|
|
await click("#create-topic");
|
|
const categoryChooser = selectKit(".category-chooser");
|
|
await categoryChooser.expand();
|
|
await categoryChooser.selectRowByValue(2);
|
|
|
|
await popupMenu.expand();
|
|
await popupMenu.selectRowByName(I18n.t("details.title"));
|
|
|
|
assert.strictEqual(
|
|
query(".d-editor-input").value,
|
|
`\n[details="${I18n.t("composer.details_title")}"]\n${I18n.t(
|
|
"composer.details_text"
|
|
)}\n[/details]\n`,
|
|
"it should contain the right output"
|
|
);
|
|
|
|
await fillIn(".d-editor-input", "This is my title");
|
|
|
|
const textarea = query(".d-editor-input");
|
|
textarea.selectionStart = 0;
|
|
textarea.selectionEnd = textarea.value.length;
|
|
|
|
await popupMenu.expand();
|
|
await popupMenu.selectRowByName(I18n.t("details.title"));
|
|
|
|
assert.strictEqual(
|
|
query(".d-editor-input").value,
|
|
`\n[details="${I18n.t(
|
|
"composer.details_title"
|
|
)}"]\nThis is my title\n[/details]\n`,
|
|
"it should contain the right selected output"
|
|
);
|
|
|
|
assert.strictEqual(
|
|
textarea.selectionStart,
|
|
21,
|
|
"it should start highlighting at the right position"
|
|
);
|
|
assert.strictEqual(
|
|
textarea.selectionEnd,
|
|
37,
|
|
"it should end highlighting at the right position"
|
|
);
|
|
|
|
await fillIn(".d-editor-input", "Before some text in between After");
|
|
|
|
textarea.selectionStart = 7;
|
|
textarea.selectionEnd = 28;
|
|
|
|
await popupMenu.expand();
|
|
await popupMenu.selectRowByName(I18n.t("details.title"));
|
|
|
|
assert.strictEqual(
|
|
query(".d-editor-input").value,
|
|
`Before \n[details="${I18n.t(
|
|
"composer.details_title"
|
|
)}"]\nsome text in between\n[/details]\n After`,
|
|
"it should contain the right output"
|
|
);
|
|
|
|
assert.strictEqual(
|
|
textarea.selectionStart,
|
|
28,
|
|
"it should start highlighting at the right position"
|
|
);
|
|
assert.strictEqual(
|
|
textarea.selectionEnd,
|
|
48,
|
|
"it should end highlighting at the right position"
|
|
);
|
|
|
|
await fillIn(".d-editor-input", "Before \nsome text in between\n After");
|
|
|
|
textarea.selectionStart = 8;
|
|
textarea.selectionEnd = 29;
|
|
|
|
await popupMenu.expand();
|
|
await popupMenu.selectRowByName(I18n.t("details.title"));
|
|
|
|
assert.strictEqual(
|
|
query(".d-editor-input").value,
|
|
`Before \n\n[details="${I18n.t(
|
|
"composer.details_title"
|
|
)}"]\nsome text in between\n[/details]\n\n After`,
|
|
"it should contain the right output"
|
|
);
|
|
|
|
assert.strictEqual(
|
|
textarea.selectionStart,
|
|
29,
|
|
"it should start highlighting at the right position"
|
|
);
|
|
assert.strictEqual(
|
|
textarea.selectionEnd,
|
|
49,
|
|
"it should end highlighting at the right position"
|
|
);
|
|
});
|
|
|
|
test("details button surrounds all selected text in a single details block", async function (assert) {
|
|
const multilineInput = "first line\n\nsecond line\n\nthird line";
|
|
const popupMenu = selectKit(".toolbar-popup-menu-options");
|
|
|
|
await visit("/");
|
|
await click("#create-topic");
|
|
const categoryChooser = selectKit(".category-chooser");
|
|
await categoryChooser.expand();
|
|
await categoryChooser.selectRowByValue(2);
|
|
await fillIn(".d-editor-input", multilineInput);
|
|
|
|
const textarea = query(".d-editor-input");
|
|
textarea.selectionStart = 0;
|
|
textarea.selectionEnd = textarea.value.length;
|
|
|
|
await popupMenu.expand();
|
|
await popupMenu.selectRowByName(I18n.t("details.title"));
|
|
|
|
assert.strictEqual(
|
|
query(".d-editor-input").value,
|
|
`\n[details="${I18n.t(
|
|
"composer.details_title"
|
|
)}"]\n${multilineInput}\n[/details]\n`,
|
|
"it should contain the right output"
|
|
);
|
|
});
|
|
});
|