mirror of
https://github.com/discourse/discourse.git
synced 2024-12-04 15:46:18 +08:00
39f3dbd945
* renames `select-box-kit` into `select-kit`
* introduces `single-select` and `multi-select` as base components
* introduces {{search-advanced-category-chooser}} as a better component for selecting category in advanced search
* improves events handling in select-kit
* recreates color selection inputs using {{multi-select}} and a custom {{selected-color}} component
* replaces category-selector by a component using select-kit and based on multi-select
* improves positioning of wrapper
* removes the need for offscreen, and instead use `select-kit-header` as a base focus point for all select-kit based components
* introduces a formal plugin api for select-kit based components
* introduces a formal pattern for loading and updating select-kit based components:
```
computeValue()
computeContent()
mutateValue()
```
118 lines
3.4 KiB
JavaScript
118 lines
3.4 KiB
JavaScript
import { acceptance } from "helpers/qunit-helpers";
|
|
|
|
acceptance('Details Button', { loggedIn: true });
|
|
|
|
function findTextarea() {
|
|
return find(".d-editor-input")[0];
|
|
}
|
|
|
|
test('details button', (assert) => {
|
|
visit("/");
|
|
|
|
click('#create-topic');
|
|
click('button.options');
|
|
click('.popup-menu .d-caret-right');
|
|
|
|
andThen(() => {
|
|
assert.equal(
|
|
find(".d-editor-input").val(),
|
|
`\n[details="${I18n.t("composer.details_title")}"]\n${I18n.t("composer.details_text")}\n[/details]\n`,
|
|
'it should contain the right output'
|
|
);
|
|
});
|
|
|
|
fillIn('.d-editor-input', "This is my title");
|
|
|
|
andThen(() => {
|
|
const textarea = findTextarea();
|
|
textarea.selectionStart = 0;
|
|
textarea.selectionEnd = textarea.value.length;
|
|
});
|
|
|
|
click('button.options');
|
|
click('.popup-menu .d-caret-right');
|
|
|
|
andThen(() => {
|
|
assert.equal(
|
|
find(".d-editor-input").val(),
|
|
`\n[details="${I18n.t("composer.details_title")}"]\nThis is my title\n[/details]\n`,
|
|
'it should contain the right selected output'
|
|
);
|
|
|
|
const textarea = findTextarea();
|
|
assert.equal(textarea.selectionStart, 21, 'it should start highlighting at the right position');
|
|
assert.equal(textarea.selectionEnd, 37, 'it should end highlighting at the right position');
|
|
});
|
|
|
|
fillIn('.d-editor-input', "Before some text in between After");
|
|
|
|
andThen(() => {
|
|
const textarea = findTextarea();
|
|
textarea.selectionStart = 7;
|
|
textarea.selectionEnd = 28;
|
|
});
|
|
|
|
click('button.options');
|
|
click('.popup-menu .d-caret-right');
|
|
|
|
andThen(() => {
|
|
assert.equal(
|
|
find(".d-editor-input").val(),
|
|
`Before \n[details="${I18n.t("composer.details_title")}"]\nsome text in between\n[/details]\n After`,
|
|
'it should contain the right output'
|
|
);
|
|
|
|
const textarea = findTextarea();
|
|
assert.equal(textarea.selectionStart, 28, 'it should start highlighting at the right position');
|
|
assert.equal(textarea.selectionEnd, 48, 'it should end highlighting at the right position');
|
|
});
|
|
|
|
fillIn('.d-editor-input', "Before \nsome text in between\n After");
|
|
|
|
andThen(() => {
|
|
const textarea = findTextarea();
|
|
textarea.selectionStart = 8;
|
|
textarea.selectionEnd = 29;
|
|
});
|
|
|
|
click('button.options');
|
|
click('.popup-menu .d-caret-right');
|
|
|
|
andThen(() => {
|
|
assert.equal(
|
|
find(".d-editor-input").val(),
|
|
`Before \n\n[details="${I18n.t("composer.details_title")}"]\nsome text in between\n[/details]\n\n After`,
|
|
'it should contain the right output'
|
|
);
|
|
|
|
const textarea = findTextarea();
|
|
assert.equal(textarea.selectionStart, 29, 'it should start highlighting at the right position');
|
|
assert.equal(textarea.selectionEnd, 49, 'it should end highlighting at the right position');
|
|
});
|
|
});
|
|
|
|
test('details button surrounds all selected text in a single details block', (assert) => {
|
|
const multilineInput = 'first line\n\nsecond line\n\nthird line';
|
|
|
|
visit("/");
|
|
click('#create-topic');
|
|
fillIn('.d-editor-input', multilineInput);
|
|
|
|
andThen(() => {
|
|
const textarea = findTextarea();
|
|
textarea.selectionStart = 0;
|
|
textarea.selectionEnd = textarea.value.length;
|
|
});
|
|
|
|
click('button.options');
|
|
click('.popup-menu .d-caret-right');
|
|
|
|
andThen(() => {
|
|
assert.equal(
|
|
find(".d-editor-input").val(),
|
|
`\n[details="${I18n.t('composer.details_title')}"]\n${multilineInput}\n[/details]\n`,
|
|
'it should contain the right output'
|
|
);
|
|
});
|
|
});
|